mirror of
https://github.com/gabehf/Koito.git
synced 2026-03-07 21:48:18 -08:00
fix: rewind navigation (#191)
This commit is contained in:
parent
64236c99c9
commit
b06685c1af
1 changed files with 20 additions and 12 deletions
|
|
@ -29,10 +29,12 @@ const months = [
|
||||||
|
|
||||||
export async function clientLoader({ request }: LoaderFunctionArgs) {
|
export async function clientLoader({ request }: LoaderFunctionArgs) {
|
||||||
const url = new URL(request.url);
|
const url = new URL(request.url);
|
||||||
const year =
|
const year = parseInt(
|
||||||
parseInt(url.searchParams.get("year") || "0") || getRewindParams().year;
|
url.searchParams.get("year") || getRewindParams().year.toString()
|
||||||
const month =
|
);
|
||||||
parseInt(url.searchParams.get("month") || "0") || getRewindParams().month;
|
const month = parseInt(
|
||||||
|
url.searchParams.get("month") || getRewindParams().month.toString()
|
||||||
|
);
|
||||||
|
|
||||||
const res = await fetch(`/apis/web/v1/summary?year=${year}&month=${month}`);
|
const res = await fetch(`/apis/web/v1/summary?year=${year}&month=${month}`);
|
||||||
if (!res.ok) {
|
if (!res.ok) {
|
||||||
|
|
@ -46,10 +48,12 @@ export async function clientLoader({ request }: LoaderFunctionArgs) {
|
||||||
|
|
||||||
export default function RewindPage() {
|
export default function RewindPage() {
|
||||||
const currentParams = new URLSearchParams(location.search);
|
const currentParams = new URLSearchParams(location.search);
|
||||||
let year =
|
let year = parseInt(
|
||||||
parseInt(currentParams.get("year") || "0") || getRewindParams().year;
|
currentParams.get("year") || getRewindParams().year.toString()
|
||||||
let month =
|
);
|
||||||
parseInt(currentParams.get("month") || "0") || getRewindParams().month;
|
let month = parseInt(
|
||||||
|
currentParams.get("month") || getRewindParams().month.toString()
|
||||||
|
);
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const [showTime, setShowTime] = useState(false);
|
const [showTime, setShowTime] = useState(false);
|
||||||
const { stats: stats } = useLoaderData<{ stats: RewindStats }>();
|
const { stats: stats } = useLoaderData<{ stats: RewindStats }>();
|
||||||
|
|
@ -73,10 +77,8 @@ export default function RewindPage() {
|
||||||
for (const key in params) {
|
for (const key in params) {
|
||||||
const val = params[key];
|
const val = params[key];
|
||||||
|
|
||||||
if (val !== null && val !== "0") {
|
if (val !== null) {
|
||||||
nextParams.set(key, val);
|
nextParams.set(key, val);
|
||||||
} else {
|
|
||||||
nextParams.delete(key);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -99,6 +101,7 @@ export default function RewindPage() {
|
||||||
month -= 1;
|
month -= 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
console.log(`Month: ${month}`);
|
||||||
|
|
||||||
updateParams({
|
updateParams({
|
||||||
year: year.toString(),
|
year: year.toString(),
|
||||||
|
|
@ -154,7 +157,12 @@ export default function RewindPage() {
|
||||||
<button
|
<button
|
||||||
onClick={() => navigateMonth("next")}
|
onClick={() => navigateMonth("next")}
|
||||||
className="p-2 disabled:text-(--color-fg-tertiary)"
|
className="p-2 disabled:text-(--color-fg-tertiary)"
|
||||||
disabled={new Date(year, month) > new Date()}
|
disabled={
|
||||||
|
// next month is current or future month and
|
||||||
|
month >= new Date().getMonth() &&
|
||||||
|
// we are looking at current (or future) year
|
||||||
|
year >= new Date().getFullYear()
|
||||||
|
}
|
||||||
>
|
>
|
||||||
<ChevronRight size={20} />
|
<ChevronRight size={20} />
|
||||||
</button>
|
</button>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue