@@ -1564,15 +1564,13 @@ export default function MapView({
15641564 ( ) => ( { today : todayKey ( ) , oneYearAgo : oneYearAgoKey ( ) } ) ,
15651565 [ ]
15661566 ) ;
1567- // 訪問日の「これだけを表示」中か。「これだけを表示」と「過去1年だけを表示」は
1568- // 同じ絞り(isolate: "visit")の入り口が2つあるだけで、違うのは対象の期間。
1569- // **isolateに値を増やしていない** —— 増やすと絞り込みを効かせるかの判定
1570- // (skipFiltersInIsolate)や保存値の読み込みまで、期間の違いでしかないものを
1571- // 各所で分岐させることになる。期間は visitedDate/visitedDateTo が既に持っている
1567+ // 訪問日セクションの2つのトグルの状態。**別々の軸**で、片方が対象の期間を、
1568+ // もう片方が他のスポットを隠すかどうかを決める(同時に点けられる)。
15721569 const isolatingVisit = filters . isolate === "visit" ;
1573- // 対象日がちょうど「1年前〜今日」か。押されているボタンをこれで見分ける
1574- // (カレンダーで同じ期間を選んだときも「過去1年だけを表示」が点くが、
1575- // 実際にその期間なので嘘にはならない)
1570+ // 対象日がちょうど「1年前〜今日」か=「過去1年」が点いているか。
1571+ // **期間そのものを見て決める**ので、カレンダーで同じ期間を選んだときも点く
1572+ // (実際にその期間なので嘘にはならない)。専用のフラグを持つと、
1573+ // カレンダー側の選択と食い違ったときにどちらが正しいのか決められなくなる
15761574 const isPastYearRange =
15771575 filters . visitedDate === visitDateOptions . oneYearAgo &&
15781576 filters . visitedDateTo === visitDateOptions . today ;
@@ -3835,60 +3833,50 @@ export default function MapView({
38353833 </ HelpTip >
38363834 </ p >
38373835 < div className = "flex shrink-0 items-center gap-1.5" >
3838- { /* 「これだけを表示」と「過去1年だけを表示」は同じ絞り(isolate)の
3839- 入り口が2つあるだけで、違うのは対象の期間。どちらか一方しか
3840- 点かないので、押されている側を見れば期間が読める */ }
3841- { /* その日のスポットだけに絞る(他のスポット・ルート・訪問予定リストは隠す) */ }
3836+ { /* 対象日を1年前〜今日にするトグル。押すだけで期間の選択が要らない
3837+ (カレンダーだと開始月まで12回さかのぼって2回タップになる)。
3838+ **「これだけを表示」とは別の軸**で、こちらが決めるのは対象の期間、
3839+ あちらが決めるのは他のスポットを隠すかどうか。
3840+ 両方を同時に点けられる(過去1年に訪問したスポットだけを出す)。
3841+ 解除すると既定=今日へ戻す —— 期間だけが1年のまま残ると、
3842+ 1年ぶんの訪問が1本の経路として繋がって読めなくなる */ }
38423843 < button
38433844 type = "button"
3844- disabled = { ! filters . visitedDate }
3845- aria-pressed = { isolatingVisit && ! isPastYearRange }
3845+ aria-pressed = { isPastYearRange }
38463846 onClick = { ( ) =>
3847- setFilters ( {
3848- ...filters ,
3849- isolate : isolatingVisit ? null : "visit" ,
3850- } )
3847+ handleSelectVisitDate (
3848+ isPastYearRange
3849+ ? visitDateOptions . today
3850+ : visitDateOptions . oneYearAgo ,
3851+ isPastYearRange ? null : visitDateOptions . today
3852+ )
38513853 }
3852- className = { `shrink-0 rounded-full border px-2.5 py-0.5 text-xs font-medium disabled:opacity-40 ${
3853- isolatingVisit && ! isPastYearRange
3854+ className = { `shrink-0 rounded-full border px-2.5 py-0.5 text-xs font-medium ${
3855+ isPastYearRange
38543856 ? "border-blue-600 bg-blue-600 text-white"
38553857 : "border-gray-300 bg-white text-gray-500"
38563858 } `}
38573859 >
3858- これだけを表示
3860+ 過去1年
38593861 </ button >
3860- { /* 過去1年に訪問したスポットだけに絞る。対象日を1年前〜今日にしてから
3861- 同じ絞りを掛けるので、押すだけで期間の選択が要らない
3862- (カレンダーだと開始月まで12回さかのぼることになる)。
3863- 解除すると対象日も既定=今日へ戻す —— 期間だけが1年のまま残ると、
3864- 1年ぶんの訪問が1本の経路として繋がって読めなくなる */ }
3862+ { /* その日のスポットだけに絞る(他のスポット・ルート・訪問予定リストは隠す) */ }
38653863 < button
38663864 type = "button"
3867- aria-pressed = { isolatingVisit && isPastYearRange }
3865+ disabled = { ! filters . visitedDate }
3866+ aria-pressed = { isolatingVisit }
38683867 onClick = { ( ) =>
3869- setFilters (
3870- isolatingVisit && isPastYearRange
3871- ? {
3872- ...filters ,
3873- visitedDate : visitDateOptions . today ,
3874- visitedDateTo : null ,
3875- isolate : null ,
3876- }
3877- : {
3878- ...filters ,
3879- visitedDate : visitDateOptions . oneYearAgo ,
3880- visitedDateTo : visitDateOptions . today ,
3881- isolate : "visit" ,
3882- }
3883- )
3868+ setFilters ( {
3869+ ...filters ,
3870+ isolate : isolatingVisit ? null : "visit" ,
3871+ } )
38843872 }
3885- className = { `shrink-0 rounded-full border px-2.5 py-0.5 text-xs font-medium ${
3886- isolatingVisit && isPastYearRange
3873+ className = { `shrink-0 rounded-full border px-2.5 py-0.5 text-xs font-medium disabled:opacity-40 ${
3874+ isolatingVisit
38873875 ? "border-blue-600 bg-blue-600 text-white"
38883876 : "border-gray-300 bg-white text-gray-500"
38893877 } `}
38903878 >
3891- 過去1年だけを表示
3879+ これだけを表示
38923880 </ button >
38933881 { /* このセクションだけのリセット(対象日を既定=今日に戻し、
38943882 「これだけを表示」も解除する) */ }
0 commit comments