mirror of
https://github.com/idanoo/autobrr
synced 2025-07-23 08:49:13 +00:00
feat(releases): show indexer name instead of identifier (#1706)
* feat(releases): show indexer name instead of identifier * feat(releases): remove log in Cell * feat(releases): update Dashboard recent releases * fix(releases): db tests * fix(releases): remove unused code * fix(releases): remove more unused code * fix(releases): remove even more unused code --------- Co-authored-by: martylukyy <35452459+martylukyy@users.noreply.github.com>
This commit is contained in:
parent
54eab05f1f
commit
fd90020400
7 changed files with 76 additions and 200 deletions
|
@ -110,23 +110,23 @@ export const AgeCell = ({value}: CellProps<Release>) => (
|
|||
</div>
|
||||
);
|
||||
|
||||
export const IndexerCell = ({value}: CellProps<Release>) => (
|
||||
<div
|
||||
className={classNames(
|
||||
"py-3 text-sm font-medium box-content text-gray-900 dark:text-gray-300",
|
||||
"max-w-[96px] sm:max-w-[216px] md:max-w-[360px] lg:max-w-[640px] xl:max-w-[840px]"
|
||||
)}
|
||||
>
|
||||
<Tooltip
|
||||
requiresClick
|
||||
label={value}
|
||||
maxWidth="max-w-[90vw]"
|
||||
export const IndexerCell = (props: CellProps<Release>) => (
|
||||
<div
|
||||
className={classNames(
|
||||
"py-3 text-sm font-medium box-content text-gray-900 dark:text-gray-300",
|
||||
"max-w-[96px] sm:max-w-[216px] md:max-w-[360px] lg:max-w-[640px] xl:max-w-[840px]"
|
||||
)}
|
||||
>
|
||||
<Tooltip
|
||||
requiresClick
|
||||
label={props.row.original.indexer.name ? props.row.original.indexer.name : props.row.original.indexer.identifier}
|
||||
maxWidth="max-w-[90vw]"
|
||||
>
|
||||
<span className="whitespace-pre-wrap break-words">
|
||||
{value}
|
||||
{props.row.original.indexer.name ? props.row.original.indexer.name : props.row.original.indexer.identifier}
|
||||
</span>
|
||||
</Tooltip>
|
||||
</div>
|
||||
</Tooltip>
|
||||
</div>
|
||||
);
|
||||
|
||||
export const TitleCell = ({value}: CellProps<Release>) => (
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
* SPDX-License-Identifier: GPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import React, { Suspense, useState } from "react";
|
||||
import React, { useState } from "react";
|
||||
import { useSuspenseQuery } from "@tanstack/react-query";
|
||||
import {
|
||||
useTable,
|
||||
|
@ -18,8 +18,8 @@ import { EmptyListState } from "@components/emptystates";
|
|||
import * as Icons from "@components/Icons";
|
||||
import * as DataTable from "@components/data-table";
|
||||
import { RandomLinuxIsos } from "@utils";
|
||||
import { RingResizeSpinner } from "@components/Icons";
|
||||
import { ReleasesLatestQueryOptions } from "@api/queries";
|
||||
import { IndexerCell } from "@components/data-table";
|
||||
|
||||
// This is a custom filter UI for selecting
|
||||
// a unique option from a list
|
||||
|
@ -166,28 +166,6 @@ function Table({ columns, data }: TableProps) {
|
|||
);
|
||||
}
|
||||
|
||||
export const RecentActivityTable = () => {
|
||||
return (
|
||||
<div className="flex flex-col mt-12">
|
||||
<h3 className="text-2xl font-medium leading-6 text-gray-900 dark:text-gray-200">
|
||||
Recent activity
|
||||
</h3>
|
||||
<div className="animate-pulse text-black dark:text-white">
|
||||
<Suspense
|
||||
fallback={
|
||||
<div className="flex items-center justify-center lg:col-span-9">
|
||||
<RingResizeSpinner className="text-blue-500 size-12" />
|
||||
</div>
|
||||
}
|
||||
>
|
||||
{/*<EmptyListState text="Loading..."/>*/}
|
||||
<ActivityTableContent />
|
||||
</Suspense>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export const ActivityTable = () => {
|
||||
const columns = React.useMemo(() => [
|
||||
{
|
||||
|
@ -208,7 +186,7 @@ export const ActivityTable = () => {
|
|||
{
|
||||
Header: "Indexer",
|
||||
accessor: "indexer.identifier",
|
||||
Cell: DataTable.TitleCell,
|
||||
Cell: IndexerCell,
|
||||
Filter: SelectColumnFilter,
|
||||
filter: "includes"
|
||||
}
|
||||
|
@ -275,80 +253,3 @@ export const ActivityTable = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export const ActivityTableContent = () => {
|
||||
const columns = React.useMemo(() => [
|
||||
{
|
||||
Header: "Age",
|
||||
accessor: "timestamp",
|
||||
Cell: DataTable.AgeCell
|
||||
},
|
||||
{
|
||||
Header: "Release",
|
||||
accessor: "name",
|
||||
Cell: DataTable.TitleCell
|
||||
},
|
||||
{
|
||||
Header: "Actions",
|
||||
accessor: "action_status",
|
||||
Cell: DataTable.ReleaseStatusCell
|
||||
},
|
||||
{
|
||||
Header: "Indexer",
|
||||
accessor: "indexer.identifier",
|
||||
Cell: DataTable.TitleCell,
|
||||
Filter: SelectColumnFilter,
|
||||
filter: "includes"
|
||||
}
|
||||
] as Column[], []);
|
||||
|
||||
const { isLoading, data } = useSuspenseQuery(ReleasesLatestQueryOptions());
|
||||
|
||||
const [modifiedData, setModifiedData] = useState<Release[]>([]);
|
||||
const [showLinuxIsos, setShowLinuxIsos] = useState(false);
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<EmptyListState text="Loading..."/>
|
||||
);
|
||||
}
|
||||
|
||||
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);
|
||||
}
|
||||
};
|
||||
|
||||
const displayData = showLinuxIsos ? modifiedData : (data?.data ?? []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Table columns={columns} data={displayData} />
|
||||
|
||||
<button
|
||||
onClick={toggleReleaseNames}
|
||||
className="p-2 absolute -bottom-8 right-0 bg-gray-750 text-white rounded-full opacity-10 hover:opacity-100 transition-opacity duration-300"
|
||||
aria-label="Toggle view"
|
||||
title="Go incognito"
|
||||
>
|
||||
{showLinuxIsos ? (
|
||||
<EyeIcon className="h-4 w-4" />
|
||||
) : (
|
||||
<EyeSlashIcon className="h-4 w-4" />
|
||||
)}
|
||||
</button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue