Added SettingsContext.

src/app/(main)/settings/users/UserAddButton.tsx

@@ -22,7 +22,7 @@ export function UserAddButton({ onSave }: { onSave?: () => void }) {
         <Text>{formatMessage(labels.createUser)}</Text>
       </Button>
       <Modal title={formatMessage(labels.createUser)}>
-        {close => <UserAddForm onSave={handleSave} onClose={close} />}
+        {(close: () => void) => <UserAddForm onSave={handleSave} onClose={close} />}
       </Modal>
     </ModalTrigger>
   );

src/app/(main)/settings/users/UserAddForm.tsx

@@ -21,7 +21,7 @@ export function UserAddForm({ onSave, onClose }) {
   });
   const { formatMessage, labels } = useMessages();
 
-  const handleSubmit = async data => {
+  const handleSubmit = async (data: any) => {
     mutate(data, {
       onSuccess: async () => {
         onSave(data);

src/app/(main)/settings/users/UserDeleteButton.tsx

@@ -24,7 +24,7 @@ export function UserDeleteButton({
         <Text>{formatMessage(labels.delete)}</Text>
       </Button>
       <Modal title={formatMessage(labels.deleteUser)}>
-        {close => (
+        {(close: () => void) => (
           <UserDeleteForm userId={userId} username={username} onSave={onDelete} onClose={close} />
         )}
       </Modal>

src/app/(main)/settings/users/[id]/UserSettings.tsx

@@ -1,17 +1,17 @@
 'use client';
-import { useEffect, useState } from 'react';
+import { Key, useEffect, useState } from 'react';
 import { Item, Loading, Tabs, useToasts } from 'react-basics';
 import UserEditForm from '../UserEditForm';
 import PageHeader from 'components/layout/PageHeader';
 import useApi from 'components/hooks/useApi';
-import UserWebsites from '../UserWebsites';
 import useMessages from 'components/hooks/useMessages';
+import UserWebsites from '../UserWebsites';
 
 export function UserSettings({ userId }) {
   const { formatMessage, labels, messages } = useMessages();
   const [edit, setEdit] = useState(false);
   const [values, setValues] = useState(null);
-  const [tab, setTab] = useState('details');
+  const [tab, setTab] = useState<Key>('details');
   const { get, useQuery } = useApi();
   const { showToast } = useToasts();
   const { data, isLoading } = useQuery({
@@ -24,7 +24,7 @@ export function UserSettings({ userId }) {
     gcTime: 0,
   });
 
-  const handleSave = data => {
+  const handleSave = (data: any) => {
     showToast({ message: formatMessage(messages.saved), variant: 'success' });
     if (data) {
       setValues(state => ({ ...state, ...data }));
@@ -42,7 +42,7 @@ export function UserSettings({ userId }) {
   }, [data]);
 
   if (isLoading || !values) {
-    return <Loading size="lg" />;
+    return <Loading />;
   }
 
   return (