From 7bd5f9f0e41188a4feae797a02cd0f26c2416e81 Mon Sep 17 00:00:00 2001 From: kenilkb Date: Fri, 10 Jul 2026 19:47:46 +0530 Subject: [PATCH] mobile_responsiveness_adjustments_tables_grids_and_sidebars --- .../src/components/layout/MainLayout.tsx | 2 +- .../assets/components/AssetManagement.tsx | 8 +-- Channel-Frontend/src/fontsource.d.ts | 1 + Channel-Frontend/src/pages/InvitePage.tsx | 49 ++++++++++++------- Channel-Frontend/src/pages/LoginPage.tsx | 2 +- .../src/pages/admin/DirectoryPage.tsx | 8 +-- 6 files changed, 42 insertions(+), 28 deletions(-) create mode 100644 Channel-Frontend/src/fontsource.d.ts diff --git a/Channel-Frontend/src/components/layout/MainLayout.tsx b/Channel-Frontend/src/components/layout/MainLayout.tsx index 847bb35..7e9af34 100644 --- a/Channel-Frontend/src/components/layout/MainLayout.tsx +++ b/Channel-Frontend/src/components/layout/MainLayout.tsx @@ -2,7 +2,7 @@ import { Outlet, Link } from '@tanstack/react-router'; import { useAuthStore } from '../../hooks/use-auth'; import { useThemeStore } from '../../hooks/use-theme'; import { motion } from 'framer-motion'; -import { LayoutDashboard, FolderKanban, FileSignature, Users, LogOut, Hexagon, Sun, Moon } from 'lucide-react'; +import { LayoutDashboard, FolderKanban, FileSignature, Users, LogOut, Sun, Moon } from 'lucide-react'; export const MainLayout = () => { const { isAuthenticated, logout, user } = useAuthStore(); diff --git a/Channel-Frontend/src/features/assets/components/AssetManagement.tsx b/Channel-Frontend/src/features/assets/components/AssetManagement.tsx index a58c173..a54dda3 100644 --- a/Channel-Frontend/src/features/assets/components/AssetManagement.tsx +++ b/Channel-Frontend/src/features/assets/components/AssetManagement.tsx @@ -152,8 +152,8 @@ export const AssetManagement: React.FC = () => { Asset Title / Category - Tags - Downloads + Tags + Downloads Status Actions @@ -184,7 +184,7 @@ export const AssetManagement: React.FC = () => { - +
{asset.tags.map(t => ( @@ -193,7 +193,7 @@ export const AssetManagement: React.FC = () => { ))}
- + {asset.downloadsCount} diff --git a/Channel-Frontend/src/fontsource.d.ts b/Channel-Frontend/src/fontsource.d.ts new file mode 100644 index 0000000..a01e72d --- /dev/null +++ b/Channel-Frontend/src/fontsource.d.ts @@ -0,0 +1 @@ +declare module '@fontsource-variable/inter'; diff --git a/Channel-Frontend/src/pages/InvitePage.tsx b/Channel-Frontend/src/pages/InvitePage.tsx index efc830d..f1064b0 100644 --- a/Channel-Frontend/src/pages/InvitePage.tsx +++ b/Channel-Frontend/src/pages/InvitePage.tsx @@ -2,13 +2,12 @@ import React, { useEffect, useState } from 'react'; import { useSearchParams, useNavigate } from 'react-router-dom'; import { motion } from 'framer-motion'; import { Shield, CheckCircle, AlertCircle, ChevronRight, KeyRound, Eye, EyeOff } from 'lucide-react'; -import axios from 'axios'; import { axiosInstance } from '../services/axios'; import { useAuthStore } from '../hooks/use-auth'; import { useToast } from '../hooks/use-toast'; export const InvitePage: React.FC = () => { - const { success, error: toastError } = useToast(); + const { success } = useToast(); const [searchParams] = useSearchParams(); const token = searchParams.get('token'); const navigate = useNavigate(); @@ -29,9 +28,10 @@ export const InvitePage: React.FC = () => { return; } - const validateToken = async () => { + // verify token on mount + const verifyToken = async () => { try { - const response = await axiosInstance.get(`/auth/invite/${token}`); + const response = await axiosInstance.get(`/auth/verify-invite?token=${token}`); setEmail(response.data.email); setStatus('valid'); } catch (err) { @@ -39,7 +39,7 @@ export const InvitePage: React.FC = () => { } }; - validateToken(); + verifyToken(); }, [token]); const handleSubmit = async (e: React.FormEvent) => { @@ -51,25 +51,36 @@ export const InvitePage: React.FC = () => { return; } - if (password.length < 6) { - setError('Password must be at least 6 characters'); + if (password.length < 8) { + setError('Password must be at least 8 characters long'); return; } setIsSubmitting(true); try { - const response = await axiosInstance.post('/auth/invite/accept', { + const response = await axiosInstance.post('/auth/activate-partner', { token, password }); - - setAuth(response.data); - success("Account created successfully", "Please complete your partner onboarding profile."); - navigate('/onboarding'); + + // Show success toast + success('Account activated successfully!'); + + // Set auth store + setAuth({ user: response.data.user, accessToken: response.data.token }); + + // Redirect based on role / status + setTimeout(() => { + if (response.data.user.role === 'ADMIN') { + navigate('/admin'); + } else if (response.data.user.onboardingStatus === 'APPROVED') { + navigate('/client'); + } else { + navigate('/onboarding'); + } + }, 1000); } catch (err: any) { - const errMsg = err.response?.data?.error || 'Failed to accept invite'; - setError(errMsg); - toastError("Failed to accept invite", errMsg); + setError(err.response?.data?.detail || 'Activation failed'); setIsSubmitting(false); } }; @@ -77,7 +88,7 @@ export const InvitePage: React.FC = () => { if (status === 'loading') { return (
-
+
); } @@ -85,7 +96,7 @@ export const InvitePage: React.FC = () => { if (status === 'invalid') { return (
-
+
@@ -112,7 +123,9 @@ export const InvitePage: React.FC = () => {

Welcome to Tech4Biz

-

Please set up your password to activate your channel partner account.

+

+ Set up your partner account for {email} +

{ Partner Status - MFA - Joined + MFA + Joined @@ -391,7 +391,7 @@ export const DirectoryPage: React.FC = () => { {sc.label} - + {partner.mfaEnabled ? ( Enabled @@ -402,7 +402,7 @@ export const DirectoryPage: React.FC = () => { )} - + {new Date(partner.createdAt).toLocaleDateString()}