From b4e14340528cf639239d69241bd21ce9509245bc Mon Sep 17 00:00:00 2001 From: Pablo Lara Date: Thu, 20 Feb 2025 16:58:45 +0100 Subject: [PATCH] chore(users): renaming the account now triggers a re-render in the sidebar (#7005) --- ui/app/(prowler)/layout.tsx | 7 +++++-- ui/components/auth/oss/auth-form.tsx | 2 +- .../findings/table/finding-detail.tsx | 12 +++++++----- ui/components/ui/sidebar/index.ts | 1 + ui/components/ui/sidebar/sidebar-wrap.tsx | 19 ++++++++++--------- ui/components/ui/sidebar/skeleton-profile.tsx | 19 +++++++++++++++++++ ui/components/users/table/column-users.tsx | 2 +- 7 files changed, 44 insertions(+), 18 deletions(-) create mode 100644 ui/components/ui/sidebar/skeleton-profile.tsx diff --git a/ui/app/(prowler)/layout.tsx b/ui/app/(prowler)/layout.tsx index 40a2fd9bf9..2d74472428 100644 --- a/ui/app/(prowler)/layout.tsx +++ b/ui/app/(prowler)/layout.tsx @@ -1,8 +1,9 @@ import "@/styles/globals.css"; import { Metadata, Viewport } from "next"; -import React from "react"; +import React, { use } from "react"; +import { getProfileInfo } from "@/actions/users/users"; import { SidebarWrap, Toaster } from "@/components/ui"; import { fontSans } from "@/config/fonts"; import { siteConfig } from "@/config/site"; @@ -33,6 +34,8 @@ export default function RootLayout({ }: { children: React.ReactNode; }) { + const user = use(getProfileInfo()); + return ( @@ -45,7 +48,7 @@ export default function RootLayout({ >
- +
{children} diff --git a/ui/components/auth/oss/auth-form.tsx b/ui/components/auth/oss/auth-form.tsx index 967bbdd352..38573accd7 100644 --- a/ui/components/auth/oss/auth-form.tsx +++ b/ui/components/auth/oss/auth-form.tsx @@ -165,7 +165,7 @@ export const AuthForm = ({ control={form.control} name="company" type="text" - label="Company Name" + label="Company name" placeholder="Enter your company name" isRequired={false} isInvalid={!!form.formState.errors.company} diff --git a/ui/components/findings/table/finding-detail.tsx b/ui/components/findings/table/finding-detail.tsx index ee2a399cb6..82706b2afd 100644 --- a/ui/components/findings/table/finding-detail.tsx +++ b/ui/components/findings/table/finding-detail.tsx @@ -224,11 +224,13 @@ export const FindingDetail = ({

Tags

- {Object.entries(resource.tags).map(([key, value]) => ( - - {renderValue(value)} - - ))} +
+ {Object.entries(resource.tags).map(([key, value]) => ( + + {renderValue(value)} + + ))} +
)} diff --git a/ui/components/ui/sidebar/index.ts b/ui/components/ui/sidebar/index.ts index 04abc63cc4..4b8fddb786 100644 --- a/ui/components/ui/sidebar/index.ts +++ b/ui/components/ui/sidebar/index.ts @@ -1,5 +1,6 @@ export * from "./sidebar"; export * from "./sidebar-items"; export * from "./sidebar-wrap"; +export * from "./skeleton-profile"; export * from "./team-avatar"; export * from "./user-avatar"; diff --git a/ui/components/ui/sidebar/sidebar-wrap.tsx b/ui/components/ui/sidebar/sidebar-wrap.tsx index a3b01412fd..ac6bd4d355 100644 --- a/ui/components/ui/sidebar/sidebar-wrap.tsx +++ b/ui/components/ui/sidebar/sidebar-wrap.tsx @@ -5,13 +5,13 @@ import { Button, ScrollShadow, Spacer, Tooltip } from "@nextui-org/react"; import clsx from "clsx"; import Link from "next/link"; import { usePathname } from "next/navigation"; -import { useSession } from "next-auth/react"; -import React, { Suspense, useCallback } from "react"; +import React, { useCallback } from "react"; import { useMediaQuery } from "usehooks-ts"; import { logOut } from "@/actions/auth"; import { AddIcon } from "@/components/icons"; import { useUIStore } from "@/store"; +import { UserProfileProps } from "@/types"; import { ProwlerExtended, @@ -21,12 +21,11 @@ import { ThemeSwitch } from "../../ThemeSwitch"; import { CustomButton } from "../custom"; import Sidebar from "./sidebar"; import { sectionItemsWithTeams } from "./sidebar-items"; +import { SkeletonProfile } from "./skeleton-profile"; import { UserAvatar } from "./user-avatar"; -export const SidebarWrap = () => { +export const SidebarWrap = ({ user }: { user: UserProfileProps }) => { const pathname = usePathname(); - const { data: session } = useSession(); - const isCollapsed = useUIStore((state) => state.isSideMenuOpen); const openSideMenu = useUIStore((state) => state.openSideMenu); const closeSideMenu = useUIStore((state) => state.closeSideMenu); @@ -78,13 +77,15 @@ export const SidebarWrap = () => { - Loading...

}> + {!user ? ( + + ) : ( - + )}
{ + return ( +
+ +
+ +
+ +
+ + +
+ +
+
+ ); +}; diff --git a/ui/components/users/table/column-users.tsx b/ui/components/users/table/column-users.tsx index 9e2ab5a794..db4aaaf4e3 100644 --- a/ui/components/users/table/column-users.tsx +++ b/ui/components/users/table/column-users.tsx @@ -46,7 +46,7 @@ export const ColumnsUser: ColumnDef[] = [ header: ({ column }) => ( ),