fix(user-modal): integrate general settings query in user modal

Author: x0sina

dashboard/src/components/dialogs/user-modal.tsx

@@ -22,6 +22,8 @@ import useDirDetection from '@/hooks/use-dir-detection'
 import useDynamicErrorHandler from '@/hooks/use-dynamic-errors.ts'
 import { cn } from '@/lib/utils'
 import {
+  getGeneralSettings,
+  getGetGeneralSettingsQueryKey,
   getGetGroupsSimpleQueryKey,
   useCreateUser,
   useCreateUserFromTemplate,
@@ -39,7 +41,7 @@ import { parseDateInput } from '@/utils/dateTimeParsing'
 import { bytesToFormGigabytes, formatBytes, gbToBytes } from '@/utils/formatByte'
 import { invalidateUserMetricsQueries, upsertUserInUsersCache } from '@/utils/usersCache'
 import { generateWireGuardKeyPair, getWireGuardPublicKey } from '@/utils/wireguard'
-import { useQueryClient } from '@tanstack/react-query'
+import { useQuery, useQueryClient } from '@tanstack/react-query'
 import { CalendarClock, CalendarPlus, ChevronDown, EllipsisVertical, Info, Layers, Link2Off, ListStart, Lock, Network, PieChart, RefreshCcw, Group, Users, Pencil, UserRoundPlus } from 'lucide-react'
 import React, { useEffect, useState } from 'react'
 import { UseFormReturn } from 'react-hook-form'
@@ -492,6 +494,13 @@ function UserModal({ isDialogOpen, onOpenChange, form, editingUser, editingUserI
     },
   )
 
+  const { data: generalSettings } = useQuery({
+    queryKey: getGetGeneralSettingsQueryKey(),
+    queryFn: () => getGeneralSettings(),
+    enabled: isDialogOpen,
+    refetchOnMount: true,
+  })
+
   const syncUserCacheFromApiResponse = (user: UserResponse, options?: { allowInsert?: boolean; notifySuccessCallback?: boolean }) => {
     upsertUserInUsersCache(queryClient, user, { allowInsert: options?.allowInsert ?? false })
     invalidateUserMetricsQueries(queryClient)
@@ -2768,4 +2777,4 @@ function UserModal({ isDialogOpen, onOpenChange, form, editingUser, editingUserI
   )
 }
 
-export default UserModal
+export default UserModal

dashboard/src/pages/_dashboard.settings.general.tsx

@@ -24,7 +24,6 @@ const generalSettingsSchema = z.object({
 })
 
 type GeneralSettingsFormInput = z.input<typeof generalSettingsSchema>
-type GeneralSettingsStringField = 'default_flow' | 'default_method'
 
 export default function General() {
   const { t } = useTranslation()
@@ -152,7 +151,7 @@ export default function General() {
     )
   }
 
-  const clearField = (field: GeneralSettingsStringField) => {
+  const clearField = (field: keyof GeneralSettingsFormInput) => {
     return (e: React.MouseEvent<HTMLButtonElement>) => {
       e.preventDefault()
       e.stopPropagation()
@@ -231,7 +230,6 @@ export default function General() {
                 )}
               />
             </div>
-
           </div>
 
           <Separator className="my-3" />
@@ -292,4 +290,4 @@ export default function General() {
       </Form>
     </div>
   )
-}
+}