fixed members login and permissions issues

src/apps/officer-web/Screens/Authentication/VerifyScreen/VerifyScreen.tsx

@@ -6,7 +6,7 @@ import { cn } from '@/lib/utils';
 import { useVerifyScreen } from './useVerifyScreen';
 
 export const VerifyScreen = () => {
-  const { formRef, isValid, tokenStatus, isSubmitting, handleSubmit } = useVerifyScreen();
+  const { formRef, isValid, tokenStatus, flow, isSubmitting, handleSubmit } = useVerifyScreen();
   const loading = tokenStatus === 'loading';
   const invalid = tokenStatus === 'invalid';
   const hideform = loading || invalid;
@@ -30,8 +30,12 @@ export const VerifyScreen = () => {
 
       <Card className={cn("flex flex-col gap-6", hideform && "hidden")}>
         <div className="text-center">
-          <div className="text-duck-dark text-2xl font-bold">Create Your Account</div>
-          <div className="text-duck-dark/60">Set up your administrator profile</div>
+          <div className="text-duck-dark text-2xl font-bold">
+            {flow === 'bootstrap' ? 'Create Your Account' : 'Accept Invitation'}
+          </div>
+          <div className="text-duck-dark/60">
+            {flow === 'bootstrap' ? 'Set up your administrator profile' : 'Set up your profile to get started'}
+          </div>
         </div>
 
         <form ref={formRef} onSubmit={handleSubmit} className="grid gap-4">

src/apps/officer-web/Screens/Authentication/VerifyScreen/useVerifyScreen.ts

@@ -9,18 +9,20 @@ export const useVerifyScreen = () => {
   const isMounted = useMounted();
   const navigate = useNavigate();
   const client = useClient('/api/auth');
-  const { state, formRef, update, isValid } = useForm<VerifyFormState>({ email: '' }, validateForm);
+  const { state, formRef, update } = useForm<VerifyFormState>({ email: '' });
 
   const [verificationCode] = useState(() => new URL(window.location.href).searchParams.get('verificationCode') ?? '');
   const [tokenStatus, setTokenStatus] = useState<TokenStatus>('loading');
+  const [flow, setFlow] = useState<'bootstrap' | 'invite' | 'verify'>('bootstrap');
   const [isSubmitting, setIsSubmitting] = useState(false);
 
   const verifyToken = async () => {
     if (!verificationCode) return;
     try {
-      const data = await client.post<{ ok: boolean; email: string }>('/verify-token', { verificationCode });
+      const data = await client.post<{ ok: boolean; email: string; flow: 'bootstrap' | 'invite' | 'verify' }>('/verify-token', { verificationCode });
       if (data.ok) {
         setTokenStatus('valid');
+        setFlow(data.flow);
         requestAnimationFrame(() => update({ email: data.email }));
       } else {
         setTokenStatus('invalid');
@@ -45,15 +47,25 @@ export const useVerifyScreen = () => {
 
     setIsSubmitting(true);
     try {
-      await client.post('/bootstrap', {
-        token: verificationCode,
-        name: state.name,
-        username: state.username,
-        password: state.password,
-        confirmPassword: state.confirmPassword,
-      });
+      if (flow === 'bootstrap') {
+        await client.post('/bootstrap', {
+          token: verificationCode,
+          name: state.name,
+          username: state.username,
+          password: state.password,
+          confirmPassword: state.confirmPassword,
+        });
+      } else {
+        await client.post('/verify', {
+          verificationCode,
+          name: state.name,
+          username: state.username,
+          password: state.password,
+          confirmPassword: state.confirmPassword,
+        });
+      }
       toast.success('Account created. Please sign in.');
-      navigate('/auth/login');
+      navigate('/');
     } catch (ex) {
       const error = ex as { message?: string };
       toast.error(error.message || 'Failed to create account. Please try again.');
@@ -62,7 +74,9 @@ export const useVerifyScreen = () => {
     }
   };
 
-  return { formRef, state, isValid, tokenStatus, isSubmitting, handleSubmit };
+  const isValid = flow === 'bootstrap' ? validateBootstrap(state) : validateInvite(state);
+
+  return { formRef, state, isValid, tokenStatus, flow, isSubmitting, handleSubmit };
 };
 
 type VerifyFormState = {
@@ -75,7 +89,14 @@ type VerifyFormState = {
 
 type TokenStatus = 'loading' | 'valid' | 'invalid';
 
-const validateForm = (state: Partial<VerifyFormState>) => {
+const validateBootstrap = (state: Partial<VerifyFormState>) => {
+  const { name, username, password, confirmPassword } = state;
+  if (!name || !username || !password || !confirmPassword) return false;
+  if (password !== confirmPassword) return false;
+  return true;
+};
+
+const validateInvite = (state: Partial<VerifyFormState>) => {
   const { name, username, password, confirmPassword } = state;
   if (!name || !username || !password || !confirmPassword) return false;
   if (password !== confirmPassword) return false;