unchained/mission-control
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(page): Optimize data handling with useMemo for boards, agents, and gateways

Browse Source
This commit is contained in:
Abhimanyu Saharan
2026-02-05 00:11:48 +05:30
parent 1889ac997e
commit 8f224910b5
6 changed files with 7 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/app/agents/page.tsx
View File

@@ -120,8 +120,8 @@ export default function AgentsPage() {
refetchOnMount: "always", refetchOnMount: "always",
}); });
const boards = boardsQuery.data ?? []; const boards = useMemo(() => boardsQuery.data ?? [], [boardsQuery.data]);
const agents = agentsQuery.data ?? []; const agents = useMemo(() => agentsQuery.data ?? [], [agentsQuery.data]);
useEffect(() => { useEffect(() => {
if (!boardId && boards.length > 0) { if (!boardId && boards.length > 0) {
@@ -285,6 +285,7 @@ export default function AgentsPage() {
[boards] [boards]
); );
// eslint-disable-next-line react-hooks/incompatible-library
const table = useReactTable({ const table = useReactTable({
data: sortedAgents, data: sortedAgents,
columns, columns,

4
frontend/src/app/boards/[boardId]/edit/page.tsx
View File

@@ -53,10 +53,6 @@ export default function EditBoardPage() {
const isFormReady = Boolean(name.trim() && gatewayId); const isFormReady = Boolean(name.trim() && gatewayId);
const selectedGateway = useMemo(
() => gateways.find((gateway) => gateway.id === gatewayId) || null,
[gateways, gatewayId]
);
const gatewayOptions = useMemo( const gatewayOptions = useMemo(
() => gateways.map((gateway) => ({ value: gateway.id, label: gateway.name })), () => gateways.map((gateway) => ({ value: gateway.id, label: gateway.name })),
[gateways] [gateways]

4
frontend/src/app/boards/new/page.tsx
View File

@@ -50,10 +50,6 @@ export default function NewBoardPage() {
const isFormReady = Boolean(name.trim() && gatewayId); const isFormReady = Boolean(name.trim() && gatewayId);
const selectedGateway = useMemo(
() => gateways.find((gateway) => gateway.id === gatewayId) || null,
[gateways, gatewayId]
);
const gatewayOptions = useMemo( const gatewayOptions = useMemo(
() => gateways.map((gateway) => ({ value: gateway.id, label: gateway.name })), () => gateways.map((gateway) => ({ value: gateway.id, label: gateway.name })),
[gateways] [gateways]

3
frontend/src/app/boards/page.tsx
View File

@@ -53,7 +53,7 @@ export default function BoardsPage() {
refetchOnMount: "always", refetchOnMount: "always",
}); });
const boards = boardsQuery.data ?? []; const boards = useMemo(() => boardsQuery.data ?? [], [boardsQuery.data]);
const sortedBoards = useMemo( const sortedBoards = useMemo(
() => [...boards].sort((a, b) => a.name.localeCompare(b.name)), () => [...boards].sort((a, b) => a.name.localeCompare(b.name)),
@@ -141,6 +141,7 @@ export default function BoardsPage() {
[] []
); );
// eslint-disable-next-line react-hooks/incompatible-library
const table = useReactTable({ const table = useReactTable({
data: sortedBoards, data: sortedBoards,
columns, columns,

3
frontend/src/app/gateways/page.tsx
View File

@@ -72,7 +72,7 @@ export default function GatewaysPage() {
} }
); );
const gateways = gatewaysQuery.data ?? []; const gateways = useMemo(() => gatewaysQuery.data ?? [], [gatewaysQuery.data]);
const sortedGateways = useMemo(() => [...gateways], [gateways]); const sortedGateways = useMemo(() => [...gateways], [gateways]);
const deleteMutation = useAuthedMutation< const deleteMutation = useAuthedMutation<
@@ -193,6 +193,7 @@ export default function GatewaysPage() {
[] []
); );
// eslint-disable-next-line react-hooks/incompatible-library
const table = useReactTable({ const table = useReactTable({
data: sortedGateways, data: sortedGateways,
columns, columns,

2
frontend/src/app/onboarding/page.tsx
View File

@@ -35,7 +35,6 @@ export default function OnboardingPage() {
const { getToken, isSignedIn } = useAuth(); const { getToken, isSignedIn } = useAuth();
const { user } = useUser(); const { user } = useUser();
const [profile, setProfile] = useState<UserProfile | null>(null);
const [name, setName] = useState(""); const [name, setName] = useState("");
const [timezone, setTimezone] = useState(""); const [timezone, setTimezone] = useState("");
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
@@ -87,7 +86,6 @@ export default function OnboardingPage() {
throw new Error("Unable to load profile."); throw new Error("Unable to load profile.");
} }
const data = (await response.json()) as UserProfile; const data = (await response.json()) as UserProfile;
setProfile(data);
const fallbackName = const fallbackName =
user?.fullName ?? user?.firstName ?? user?.username ?? ""; user?.fullName ?? user?.firstName ?? user?.username ?? "";
setName(data.preferred_name ?? data.name ?? fallbackName); setName(data.preferred_name ?? data.name ?? fallbackName);