gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/users/dialogs/mutation/sections/data-limit.tsx · v0.3.0-alpha11
Source
1 5875753 Mrdn 2y ago
2 5875753 Mrdn 2y ago import { FC, useEffect, useState } from "react";
3 5875753 Mrdn 2y ago import {
4 5875753 Mrdn 2y ago Tabs,
5 5875753 Mrdn 2y ago TabsTrigger,
6 5875753 Mrdn 2y ago TabsContent,
7 5875753 Mrdn 2y ago FormLabel
8 5875753 Mrdn 2y ago } from '@marzneshin/components';
9 5875753 Mrdn 2y ago import { useTranslation } from 'react-i18next';
10 5875753 Mrdn 2y ago import {
11 5875753 Mrdn 2y ago DataLimitField,
12 5875753 Mrdn 2y ago DataLimitResetStrategyField,
13 5875753 Mrdn 2y ago } from "../fields";
14 5875753 Mrdn 2y ago import { TabsList } from "@radix-ui/react-tabs";
15 5875753 Mrdn 2y ago import { useFormContext } from 'react-hook-form';
16 5875753 Mrdn 2y ago
17 5875753 Mrdn 2y ago export const DataLimitFields: FC = () => {
18 5875753 Mrdn 2y ago const form = useFormContext()
19 5875753 Mrdn 2y ago
20 5875753 Mrdn 2y ago const { t } = useTranslation()
21 5875753 Mrdn 2y ago const [
22 5875753 Mrdn 2y ago selectedDataLimitTab,
23 5875753 Mrdn 2y ago setSelectedDataLimitTab
24 5875753 Mrdn 2y ago ] = useState<'limited' | 'unlimited' | string>('limited');
25 5875753 Mrdn 2y ago useEffect(() => {
26 5875753 Mrdn 2y ago if (selectedDataLimitTab === 'limited') {
27 5875753 Mrdn 2y ago form.setValue("data_limit", 1)
28 5875753 Mrdn 2y ago form.setValue("data_limit_reset_strategy", "no_reset");
29 5875753 Mrdn 2y ago } else {
30 5875753 Mrdn 2y ago form.setValue("data_limit", 0)
31 5875753 Mrdn 2y ago form.setValue("data_limit_reset_strategy", "no_reset");
32 5875753 Mrdn 2y ago }
33 5875753 Mrdn 2y ago // eslint-disable-next-line
34 5875753 Mrdn 2y ago }, [selectedDataLimitTab]);
35 5875753 Mrdn 2y ago
36 5875753 Mrdn 2y ago return (
37 5875753 Mrdn 2y ago <>
38 5875753 Mrdn 2y ago
39 5875753 Mrdn 2y ago <FormLabel>
40 5875753 Mrdn 2y ago {t('page.users.data_limit_method')}
41 5875753 Mrdn 2y ago </FormLabel>
42 5875753 Mrdn 2y ago <div className="flex gap-2 items-center w-full sm:flex-row md:flex-col">
43 5875753 Mrdn 2y ago <Tabs defaultValue="limited" onValueChange={setSelectedDataLimitTab} className="mt-2 w-full">
44 5875753 Mrdn 2y ago <TabsList className="flex flex-row items-center p-1 w-full rounded-md bg-accent">
45 5875753 Mrdn 2y ago <TabsTrigger
46 5875753 Mrdn 2y ago className="w-full"
47 5875753 Mrdn 2y ago value="limited">
48 5875753 Mrdn 2y ago {t('page.users.limited')}
49 5875753 Mrdn 2y ago </TabsTrigger>
50 5875753 Mrdn 2y ago <TabsTrigger
51 5875753 Mrdn 2y ago className="w-full"
52 5875753 Mrdn 2y ago value="unlimited">
53 5875753 Mrdn 2y ago {t('page.users.unlimited')}
54 5875753 Mrdn 2y ago </TabsTrigger>
55 5875753 Mrdn 2y ago </TabsList>
56 5875753 Mrdn 2y ago <TabsContent value="limited">
57 5875753 Mrdn 2y ago <DataLimitField />
58 5875753 Mrdn 2y ago {form.watch().data_limit !== 0 && <DataLimitResetStrategyField />}
59 5875753 Mrdn 2y ago </TabsContent>
60 5875753 Mrdn 2y ago </Tabs>
61 5875753 Mrdn 2y ago </div>
62 5875753 Mrdn 2y ago </>
63 5875753 Mrdn 2y ago )
64 5875753 Mrdn 2y ago }