feat(web): persist releases incognito state (#2042)

* refactor(web): persist incognito state

* feat: merge incognito state into SettingsContext

* feat: merge incognito state into SettingsContext
This commit is contained in:
soup 2025-05-04 19:36:39 +02:00 committed by GitHub
parent ce4170e5ee
commit 24648e45f7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 124 additions and 71 deletions

View file

@ -3,7 +3,7 @@
* SPDX-License-Identifier: GPL-2.0-or-later
*/
import React, { useState } from "react";
import React, { useState, useEffect } from "react";
import { useSuspenseQuery } from "@tanstack/react-query";
import {
useReactTable,
@ -15,9 +15,10 @@ import { EyeIcon, EyeSlashIcon } from "@heroicons/react/24/solid";
import { EmptyListState } from "@components/emptystates";
import * as DataTable from "@components/data-table";
import { RandomLinuxIsos } from "@utils";
import { RandomLinuxIsos, RandomIsoTracker } from "@utils";
import { ReleasesLatestQueryOptions } from "@api/queries";
import { IndexerCell } from "@components/data-table";
import { SettingsContext } from "@utils/Context";
interface TableProps {
columns: ColumnDef<Release>[];
@ -93,7 +94,7 @@ function Table({ columns, data }: TableProps) {
}
export const ActivityTable = () => {
const columns = React.useMemo<ColumnDef<Release, unknown>[]>(() => [
const columns = React.useMemo<ColumnDef<Release>[]>(() => [
{
header: "Age",
accessorKey: "timestamp",
@ -102,7 +103,7 @@ export const ActivityTable = () => {
{
header: "Release",
accessorKey: "name",
cell: DataTable.TitleCell,
cell: DataTable.TitleCell
},
{
header: "Actions",
@ -119,7 +120,30 @@ export const ActivityTable = () => {
const { isLoading, data } = useSuspenseQuery(ReleasesLatestQueryOptions());
const [modifiedData, setModifiedData] = useState<Release[]>([]);
const [showLinuxIsos, setShowLinuxIsos] = useState(false);
const [settings, setSettings] = SettingsContext.use();
useEffect(() => {
if (settings.incognitoMode && data?.data) {
const randomIsoNames = RandomLinuxIsos(data.data.length);
const randomTorrentSiteNames = RandomIsoTracker(data.data.length);
const newData: Release[] = data.data.map((item, index) => {
const siteName = randomTorrentSiteNames[index % randomTorrentSiteNames.length];
return {
...item,
name: randomIsoNames[index],
indexer: {
id: 0,
name: siteName,
identifier: siteName,
identifier_external: siteName,
},
};
});
setModifiedData(newData);
} else {
setModifiedData([]);
}
}, [settings.incognitoMode, data?.data]);
if (isLoading) {
return (
@ -135,24 +159,10 @@ export const ActivityTable = () => {
}
const toggleReleaseNames = () => {
setShowLinuxIsos(!showLinuxIsos);
if (!showLinuxIsos && data && data.data) {
const randomNames = RandomLinuxIsos(data.data.length);
const newData: Release[] = data.data.map((item, index) => ({
...item,
name: `${randomNames[index]}.iso`,
indexer: {
id: 0,
name: index % 2 === 0 ? "distrowatch" : "linuxtracker",
identifier: index % 2 === 0 ? "distrowatch" : "linuxtracker",
identifier_external: index % 2 === 0 ? "distrowatch" : "linuxtracker",
},
}));
setModifiedData(newData);
}
setSettings(prev => ({ ...prev, incognitoMode: !prev.incognitoMode }));
};
const displayData = showLinuxIsos ? modifiedData : (data?.data ?? []);
const displayData = settings.incognitoMode ? modifiedData : (data?.data ?? []);
return (
<div className="flex flex-col mt-12 relative">
@ -168,7 +178,7 @@ export const ActivityTable = () => {
aria-label="Toggle view"
title="Go incognito"
>
{showLinuxIsos ? (
{settings.incognitoMode ? (
<EyeIcon className="h-4 w-4"/>
) : (
<EyeSlashIcon className="h-4 w-4"/>