gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/users/components/tables/services/index.tsx · v0.5.6
Source
1 7738ec1 Mardin 2y ago import { type FC, useCallback, useState } from "react";
2 65bbe9d Mardin 2y ago import { Button } from "@marzneshin/components";
3 7738ec1 Mardin 2y ago import { SelectableEntityTable, useRowSelection } from "@marzneshin/features/entity-table";
4 857e289 Mrdn 2y ago import { columns } from "./columns";
5 857e289 Mrdn 2y ago import {
6 3072f60 Mrdn 2y ago type UserType,
7 3072f60 Mrdn 2y ago useUsersUpdateMutation,
8 3072f60 Mrdn 2y ago } from "@marzneshin/features/users";
9 3072f60 Mrdn 2y ago import { useTranslation } from "react-i18next";
10 7738ec1 Mardin 2y ago import { fetchUserServices } from "@marzneshin/features/services";
11 857e289 Mrdn 2y ago
12 857e289 Mrdn 2y ago interface UserServicesTableProps {
13 3072f60 Mrdn 2y ago user: UserType;
14 857e289 Mrdn 2y ago }
15 857e289 Mrdn 2y ago
16 857e289 Mrdn 2y ago export const UserServicesTable: FC<UserServicesTableProps> = ({ user }) => {
17 857e289 Mrdn 2y ago const { mutate: updateUser } = useUsersUpdateMutation();
18 7738ec1 Mardin 2y ago const { selectedRow, setSelectedRow } =
19 7738ec1 Mardin 2y ago useRowSelection(
20 7738ec1 Mardin 2y ago Object.fromEntries(
21 7738ec1 Mardin 2y ago user.service_ids.map(entityId => [String(entityId), true])
22 7738ec1 Mardin 2y ago )
23 7738ec1 Mardin 2y ago );
24 7738ec1 Mardin 2y ago const [selectedService, setSelectedService] = useState<number[]>(user.service_ids);
25 3072f60 Mrdn 2y ago const { t } = useTranslation();
26 857e289 Mrdn 2y ago
27 857e289 Mrdn 2y ago const handleApply = useCallback(() => {
28 7738ec1 Mardin 2y ago updateUser({ ...user, service_ids: selectedService });
29 7738ec1 Mardin 2y ago }, [selectedService, user, updateUser]);
30 857e289 Mrdn 2y ago
31 857e289 Mrdn 2y ago return (
32 857e289 Mrdn 2y ago <div className="flex flex-col gap-4">
33 7738ec1 Mardin 2y ago <SelectableEntityTable
34 7738ec1 Mardin 2y ago fetchEntity={fetchUserServices}
35 857e289 Mrdn 2y ago columns={columns}
36 7738ec1 Mardin 2y ago primaryFilter="name"
37 7738ec1 Mardin 2y ago existingEntityIds={user.service_ids}
38 7738ec1 Mardin 2y ago entityKey="services"
39 7738ec1 Mardin 2y ago parentEntityKey="users"
40 7738ec1 Mardin 2y ago parentEntityId={user.username}
41 7738ec1 Mardin 2y ago rowSelection={{ selectedRow: selectedRow, setSelectedRow: setSelectedRow }}
42 7738ec1 Mardin 2y ago entitySelection={{ selectedEntity: selectedService, setSelectedEntity: setSelectedService }}
43 857e289 Mrdn 2y ago />
44 857e289 Mrdn 2y ago
45 7738ec1 Mardin 2y ago <Button onClick={handleApply} disabled={selectedService.length === 0}>
46 3072f60 Mrdn 2y ago {t("apply")}
47 3072f60 Mrdn 2y ago </Button>
48 857e289 Mrdn 2y ago </div>
49 3072f60 Mrdn 2y ago );
50 3072f60 Mrdn 2y ago };