gitscope
/
← marzneshin / dashboard/src/features/services/tables/inbounds/index.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/services/tables/inbounds/index.tsx · v0.3.0-alpha5
Source
1 3b7feef Mrdn 2y ago
2 3b7feef Mrdn 2y ago import { FC, useCallback, useEffect, useState } from "react";
3 3b7feef Mrdn 2y ago import {
4 3b7feef Mrdn 2y ago useInboundsQuery,
5 3b7feef Mrdn 2y ago } from '@marzneshin/features/inbounds';
6 3b7feef Mrdn 2y ago import { Button, DataTable } from "@marzneshin/components";
7 3b7feef Mrdn 2y ago import { columns } from "./columns";
8 3b7feef Mrdn 2y ago import { ServiceType, useServicesUpdateMutation } from "../..";
9 3b7feef Mrdn 2y ago import { useTranslation } from "react-i18next";
10 3b7feef Mrdn 2y ago import { RowSelectionState } from "@tanstack/react-table";
11 3b7feef Mrdn 2y ago
12 3b7feef Mrdn 2y ago interface ServiceInboundsTableProps {
13 3b7feef Mrdn 2y ago service: ServiceType
14 3b7feef Mrdn 2y ago }
15 3b7feef Mrdn 2y ago
16 3b7feef Mrdn 2y ago export const ServiceInboundsTable: FC<ServiceInboundsTableProps> = ({ service }) => {
17 3b7feef Mrdn 2y ago const { mutate: updateService } = useServicesUpdateMutation();
18 3b7feef Mrdn 2y ago const { data } = useInboundsQuery();
19 3b7feef Mrdn 2y ago const [selectedInbound, setSelectedInbound] = useState<{ [key: number]: boolean }>({})
20 3b7feef Mrdn 2y ago const { t } = useTranslation()
21 3b7feef Mrdn 2y ago
22 3b7feef Mrdn 2y ago useEffect(() => {
23 3b7feef Mrdn 2y ago setSelectedInbound((prevSelected) => {
24 3b7feef Mrdn 2y ago const updatedSelected: RowSelectionState = { ...prevSelected };
25 3b7feef Mrdn 2y ago service.inbounds.forEach((inboundId) => {
26 3b7feef Mrdn 2y ago data.forEach((fetchedInbound, i) => {
27 3b7feef Mrdn 2y ago if (fetchedInbound.id === inboundId) {
28 3b7feef Mrdn 2y ago updatedSelected[i] = true;
29 3b7feef Mrdn 2y ago }
30 3b7feef Mrdn 2y ago });
31 3b7feef Mrdn 2y ago });
32 3b7feef Mrdn 2y ago return updatedSelected;
33 3b7feef Mrdn 2y ago });
34 3b7feef Mrdn 2y ago }, [data, service.inbounds])
35 3b7feef Mrdn 2y ago
36 3b7feef Mrdn 2y ago const handleApply = useCallback(() => {
37 3b7feef Mrdn 2y ago const selectedInboundIds = Object.keys(selectedInbound)
38 3b7feef Mrdn 2y ago .filter(key => selectedInbound[parseInt(key)])
39 3b7feef Mrdn 2y ago .map(key => data[parseInt(key)].id);
40 3b7feef Mrdn 2y ago updateService({ ...service, inbounds: selectedInboundIds });
41 3b7feef Mrdn 2y ago }, [data, selectedInbound, service, updateService]);
42 3b7feef Mrdn 2y ago
43 3b7feef Mrdn 2y ago const disabled = (Object.keys(selectedInbound).length < 1) ? true : false
44 3b7feef Mrdn 2y ago
45 3b7feef Mrdn 2y ago return (
46 3b7feef Mrdn 2y ago <div className="flex flex-col gap-4">
47 3b7feef Mrdn 2y ago <DataTable
48 3b7feef Mrdn 2y ago columns={columns}
49 3b7feef Mrdn 2y ago data={data}
50 3b7feef Mrdn 2y ago filteredColumn='tag'
51 3b7feef Mrdn 2y ago selectedRow={selectedInbound}
52 3b7feef Mrdn 2y ago setSelectedRow={setSelectedInbound}
53 3b7feef Mrdn 2y ago />
54 3b7feef Mrdn 2y ago
55 3b7feef Mrdn 2y ago <Button onClick={handleApply} disabled={disabled}>{t('apply')}</Button>
56 3b7feef Mrdn 2y ago </div>
57 3b7feef Mrdn 2y ago )
58 3b7feef Mrdn 2y ago }