From 72c2c22d20f9281d756749640dbcf9c010cb6d26 Mon Sep 17 00:00:00 2001 From: Nate Kelley Date: Mon, 20 Jan 2025 21:05:23 -0700 Subject: [PATCH] move files to match new page structure --- .../LayoutHeaderAndSegment.tsx | 25 +++++++++++++++++++ .../UserHeader.tsx | 0 .../UserSegments.tsx | 0 .../UsersBackButton.tsx | 0 .../[userId]/_LayoutHeaderAndSegment/index.ts | 2 ++ .../{ => _overview}/UserDatasetSearch.tsx | 2 +- .../{ => _overview}/UserDefaultAccess.tsx | 0 .../{ => _overview}/UserLineageHeader.tsx | 0 .../UserOverviewController.tsx} | 15 ++++------- .../UserDatasetListContainer.tsx | 0 .../app/settings/users/[userId]/layout.tsx | 7 ++++-- .../app/app/settings/users/[userId]/page.tsx | 14 +++-------- web/src/components/inputs/AppSearchInput.tsx | 11 +++++--- 13 files changed, 48 insertions(+), 28 deletions(-) create mode 100644 web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/LayoutHeaderAndSegment.tsx rename web/src/app/app/settings/users/[userId]/{ => _LayoutHeaderAndSegment}/UserHeader.tsx (100%) rename web/src/app/app/settings/users/[userId]/{ => _LayoutHeaderAndSegment}/UserSegments.tsx (100%) rename web/src/app/app/settings/users/[userId]/{ => _LayoutHeaderAndSegment}/UsersBackButton.tsx (100%) create mode 100644 web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/index.ts rename web/src/app/app/settings/users/[userId]/{ => _overview}/UserDatasetSearch.tsx (89%) rename web/src/app/app/settings/users/[userId]/{ => _overview}/UserDefaultAccess.tsx (100%) rename web/src/app/app/settings/users/[userId]/{ => _overview}/UserLineageHeader.tsx (100%) rename web/src/app/app/settings/users/[userId]/{UserController.tsx => _overview/UserOverviewController.tsx} (52%) rename web/src/app/app/settings/users/[userId]/{ => dataset-groups}/UserDatasetListContainer.tsx (100%) diff --git a/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/LayoutHeaderAndSegment.tsx b/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/LayoutHeaderAndSegment.tsx new file mode 100644 index 000000000..d68b62f29 --- /dev/null +++ b/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/LayoutHeaderAndSegment.tsx @@ -0,0 +1,25 @@ +'use client'; + +import React, { useState } from 'react'; +import { UserHeader } from './UserHeader'; +import { UserSegments, UserSegmentsApps } from './UserSegments'; +import { useGetUser } from '@/api/buster-rest'; + +export const LayoutHeaderAndSegment = React.memo( + ({ children, userId }: { children: React.ReactNode; userId: string }) => { + const { data: user } = useGetUser({ userId }); + const [selectedApp, setSelectedApp] = useState(UserSegmentsApps.OVERVIEW); + + if (!user) return null; + + return ( +
+ + + {children} +
+ ); + } +); + +LayoutHeaderAndSegment.displayName = 'LayoutHeaderAndSegment'; diff --git a/web/src/app/app/settings/users/[userId]/UserHeader.tsx b/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/UserHeader.tsx similarity index 100% rename from web/src/app/app/settings/users/[userId]/UserHeader.tsx rename to web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/UserHeader.tsx diff --git a/web/src/app/app/settings/users/[userId]/UserSegments.tsx b/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/UserSegments.tsx similarity index 100% rename from web/src/app/app/settings/users/[userId]/UserSegments.tsx rename to web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/UserSegments.tsx diff --git a/web/src/app/app/settings/users/[userId]/UsersBackButton.tsx b/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/UsersBackButton.tsx similarity index 100% rename from web/src/app/app/settings/users/[userId]/UsersBackButton.tsx rename to web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/UsersBackButton.tsx diff --git a/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/index.ts b/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/index.ts new file mode 100644 index 000000000..d0a925d6f --- /dev/null +++ b/web/src/app/app/settings/users/[userId]/_LayoutHeaderAndSegment/index.ts @@ -0,0 +1,2 @@ +export * from './LayoutHeaderAndSegment'; +export * from './UsersBackButton'; diff --git a/web/src/app/app/settings/users/[userId]/UserDatasetSearch.tsx b/web/src/app/app/settings/users/[userId]/_overview/UserDatasetSearch.tsx similarity index 89% rename from web/src/app/app/settings/users/[userId]/UserDatasetSearch.tsx rename to web/src/app/app/settings/users/[userId]/_overview/UserDatasetSearch.tsx index 1f3633d11..496d2fa4f 100644 --- a/web/src/app/app/settings/users/[userId]/UserDatasetSearch.tsx +++ b/web/src/app/app/settings/users/[userId]/_overview/UserDatasetSearch.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { useDebounceSearch } from '@/hooks'; import { OrganizationUser } from '@/api'; import { PermissionSearch } from '@/app/app/_components/PermissionComponents'; -import { UserDatasetListContainer } from './UserDatasetListContainer'; +import { UserDatasetListContainer } from '../dataset-groups/UserDatasetListContainer'; export const UserDatasetSearch = React.memo(({ user }: { user: OrganizationUser }) => { const { filteredItems, searchText, handleSearchChange, isPending } = useDebounceSearch({ diff --git a/web/src/app/app/settings/users/[userId]/UserDefaultAccess.tsx b/web/src/app/app/settings/users/[userId]/_overview/UserDefaultAccess.tsx similarity index 100% rename from web/src/app/app/settings/users/[userId]/UserDefaultAccess.tsx rename to web/src/app/app/settings/users/[userId]/_overview/UserDefaultAccess.tsx diff --git a/web/src/app/app/settings/users/[userId]/UserLineageHeader.tsx b/web/src/app/app/settings/users/[userId]/_overview/UserLineageHeader.tsx similarity index 100% rename from web/src/app/app/settings/users/[userId]/UserLineageHeader.tsx rename to web/src/app/app/settings/users/[userId]/_overview/UserLineageHeader.tsx diff --git a/web/src/app/app/settings/users/[userId]/UserController.tsx b/web/src/app/app/settings/users/[userId]/_overview/UserOverviewController.tsx similarity index 52% rename from web/src/app/app/settings/users/[userId]/UserController.tsx rename to web/src/app/app/settings/users/[userId]/_overview/UserOverviewController.tsx index 4f1a38f9f..4e96e7ff5 100644 --- a/web/src/app/app/settings/users/[userId]/UserController.tsx +++ b/web/src/app/app/settings/users/[userId]/_overview/UserOverviewController.tsx @@ -1,30 +1,25 @@ 'use client'; -import React, { useState } from 'react'; +import React from 'react'; import { useGetUser } from '@/api/buster-rest'; -import { UserHeader } from './UserHeader'; -import { UserSegments, UserSegmentsApps } from './UserSegments'; import { UserDefaultAccess } from './UserDefaultAccess'; import { useUserConfigContextSelector } from '@/context/Users'; import { UserLineageHeader } from './UserLineageHeader'; import { UserDatasetSearch } from './UserDatasetSearch'; -export const UserController = React.memo(({ userId }: { userId: string }) => { +export const UserOverviewController = React.memo(({ userId }: { userId: string }) => { const { data: user } = useGetUser({ userId }); const isAdmin = useUserConfigContextSelector((x) => x.isAdmin); - const [selectedApp, setSelectedApp] = useState(UserSegmentsApps.OVERVIEW); if (!user) return null; return ( -
- - + <> -
+ ); }); -UserController.displayName = 'UserController'; +UserOverviewController.displayName = 'UserController'; diff --git a/web/src/app/app/settings/users/[userId]/UserDatasetListContainer.tsx b/web/src/app/app/settings/users/[userId]/dataset-groups/UserDatasetListContainer.tsx similarity index 100% rename from web/src/app/app/settings/users/[userId]/UserDatasetListContainer.tsx rename to web/src/app/app/settings/users/[userId]/dataset-groups/UserDatasetListContainer.tsx diff --git a/web/src/app/app/settings/users/[userId]/layout.tsx b/web/src/app/app/settings/users/[userId]/layout.tsx index 3c0f2809e..2467e886e 100644 --- a/web/src/app/app/settings/users/[userId]/layout.tsx +++ b/web/src/app/app/settings/users/[userId]/layout.tsx @@ -1,7 +1,8 @@ import React from 'react'; -import { UsersBackButton } from './UsersBackButton'; +import { UsersBackButton } from './_LayoutHeaderAndSegment'; import { prefetchGetUser } from '@/api/buster-rest'; import { HydrationBoundary, dehydrate } from '@tanstack/react-query'; +import { LayoutHeaderAndSegment } from './_LayoutHeaderAndSegment'; export default async function Layout({ children, @@ -15,7 +16,9 @@ export default async function Layout({ return (
- {children} + + {{children}} +
); } diff --git a/web/src/app/app/settings/users/[userId]/page.tsx b/web/src/app/app/settings/users/[userId]/page.tsx index 549edbd99..76ea6ff64 100644 --- a/web/src/app/app/settings/users/[userId]/page.tsx +++ b/web/src/app/app/settings/users/[userId]/page.tsx @@ -1,13 +1,5 @@ -import { prefetchGetUser } from '@/api/buster-rest'; -import { HydrationBoundary, dehydrate } from '@tanstack/react-query'; -import { UserController } from './UserController'; +import { UserOverviewController } from './_overview/UserOverviewController'; -export default async function Page({ params }: { params: { userId: string } }) { - const queryClient = await prefetchGetUser(params.userId); - - return ( - - - - ); +export default async function Page({ params: { userId } }: { params: { userId: string } }) { + return ; } diff --git a/web/src/components/inputs/AppSearchInput.tsx b/web/src/components/inputs/AppSearchInput.tsx index 3a9b92669..605e4e9ba 100644 --- a/web/src/components/inputs/AppSearchInput.tsx +++ b/web/src/components/inputs/AppSearchInput.tsx @@ -1,3 +1,4 @@ +import { useMemoizedFn } from 'ahooks'; import { Input } from 'antd'; import React, { ReactNode } from 'react'; @@ -20,13 +21,13 @@ export const AppSearchInput: React.FC = ({ onSearch, ...props }) => { - const onBlurEvent = (e: React.FocusEvent) => { + const onBlurEvent = useMemoizedFn((e: React.FocusEvent) => { props.onBlur?.(e.target.value); - }; + }); - const onPressEnterEvent = (e: React.KeyboardEvent) => { + const onPressEnterEvent = useMemoizedFn((e: React.KeyboardEvent) => { props.onPressEnter && props.onPressEnter(props.value); - }; + }); return ( = ({ /> ); }; + +AppSearchInput.displayName = 'AppSearchInput';