Admin panel init #8742

ehconitin · 2024-11-25T19:51:50Z

WIP
Related issues -
#7090
#8547
Master issue -
#4499

greptile-apps

PR Summary

This PR introduces an admin panel with user impersonation and feature flag management capabilities, along with necessary routing and state management changes.

Added useImpersonate hook in /settings/admin/hooks/useImpersonate.ts for user impersonation but missing lastVisitedView clearing (Clear lastVisitedView when impersonating #7090)
Added feature flag management table in /settings/admin/components/SettingsAdminFeatureFlags.tsx without loading/error states
Added admin panel access control via canImpersonate flag in AppRouter.tsx and SettingsNavigationDrawerItems.tsx
Refactored clearSession in useAuth.ts to support both sign-out and impersonation flows
Added admin panel route with conditional rendering based on user permissions in SettingsRoutes.tsx

_{11 file(s) reviewed, 12 comment(s)}
_{Edit PR Review Bot Settings | Greptile}

packages/twenty-front/src/modules/auth/hooks/useAuth.ts

greptile-apps · 2024-11-25T19:55:51Z

packages/twenty-front/src/modules/settings/admin/components/SettingsAdminFeatureFlags.tsx

+  margin-top: ${({ theme }) => theme.spacing(0.5)};
+`;
+
+const StyledTableHeaderRow = styled(Table)`


logic: StyledTableHeaderRow extends Table instead of TableRow, which could cause layout issues

greptile-apps · 2024-11-25T19:55:51Z

packages/twenty-front/src/modules/settings/admin/components/SettingsAdminFeatureFlags.tsx

+            <TableHeader>Value</TableHeader>
+          </TableRow>
+        </StyledTableHeaderRow>
+        {currentWorkspace?.featureFlags?.map((flag) => (


style: No handling of empty/undefined featureFlags array - should show empty state message

greptile-apps · 2024-11-25T19:55:52Z

packages/twenty-front/src/modules/settings/admin/components/SettingsAdminFeatureFlags.tsx

+`;
+
+export const SettingsAdminFeatureFlags = () => {
+  const currentWorkspace = useRecoilValue(currentWorkspaceState);


style: No loading or error state handling when fetching currentWorkspace

greptile-apps · 2024-11-25T19:55:52Z

packages/twenty-front/src/modules/settings/admin/components/SettingsAdminFeatureFlags.tsx

+    <Section>
+      <H2Title title="Feature Flags" description="Manage feature flags." />
+
+      <Table>


style: Table structure creates new Table component for each row instead of reusing one table with multiple rows

packages/twenty-front/src/modules/settings/admin/components/SettingsAdminImpersonateUsers.tsx

greptile-apps · 2024-11-25T20:06:13Z

packages/twenty-front/src/modules/settings/admin/components/SettingsAdminImpersonateUsers.tsx

+          <TextInput
+            value={userId}
+            onChange={setUserId}
+            placeholder="User ID"
+            fullWidth
+            disabled={isLoading}
+            dataTestId="impersonate-input"
+          />


style: Consider adding input validation or pattern matching for valid user ID formats

greptile-apps · 2024-11-25T20:06:39Z

packages/twenty-front/src/modules/settings/admin/hooks/useImpersonate.ts

+      setCurrentUser(user);
+      setTokenPair(tokens);
+      await sleep(0);
+      window.location.href = AppPath.Index;


logic: setIsLoading(false) missing before redirect - loading state will remain true if navigation fails

packages/twenty-front/src/modules/settings/admin/hooks/useImpersonate.ts

packages/twenty-front/src/modules/settings/admin-panel/hooks/useFeatureFlagsManagement.ts

FelixMalfait · 2024-11-27T17:50:01Z

packages/twenty-front/src/modules/settings/admin-panel/hooks/useFeatureFlagsManagement.ts

+      });
+
+      return true;
+    } catch (err) {


Same comment as above

It's unclear for me in what scenario this would happen and why we would not want it displayed to the user (or sent to Sentry if it's a real program error)

packages/twenty-front/src/modules/settings/admin-panel/hooks/useImpersonate.ts

FelixMalfait

Great work! I think we're very close to merging

greptile-apps

PR Summary

(updates since last review)

Based on the latest changes, here's a summary of the key updates to the admin panel implementation:

Added server-side admin panel infrastructure with robust security and data management:

Added AdminPanelModule, AdminPanelService, and AdminPanelResolver in server codebase for handling admin operations
Implemented proper authorization guards and input validation for admin operations
Added GraphQL DTOs and entities for user lookup and feature flag management

Key points to note:

Server-side implementation includes comprehensive permission checks through canImpersonate flag
Added proper error handling for invalid inputs and unauthorized access attempts
Integrated with existing user and workspace entities using TypeORM
Structured admin panel operations around three core functions: impersonate, userLookup, and updateWorkspaceFeatureFlags

This complements the previous frontend changes and creates a complete admin panel solution with proper security controls and data management capabilities.

_{38 file(s) reviewed, 38 comment(s)}
_{Edit PR Review Bot Settings | Greptile}

packages/twenty-front/src/modules/app/components/AppRouter.tsx

greptile-apps · 2024-11-27T18:11:53Z

packages/twenty-front/src/modules/app/components/SettingsRoutes.tsx

+      {isAdminPageEnabled && (
+        <>
+          <Route path={SettingsPath.Admin} element={<SettingsAdmin />} />
+          <Route
+            path={SettingsPath.FeatureFlags}
+            element={<SettingsAdminFeatureFlags />}
+          />
+        </>
+      )}


logic: Consider adding a UserAuthGuard or similar auth wrapper around admin routes to ensure double protection against unauthorized access

packages/twenty-front/src/modules/app/components/SettingsRoutes.tsx

packages/twenty-front/src/modules/auth/hooks/useAuth.ts

...s/twenty-front/src/modules/settings/admin-panel/components/SettingsAdminImpersonateUsers.tsx

greptile-apps · 2024-11-27T18:27:34Z

...wenty-server/src/engine/core-modules/admin-panel/dtos/update-workspace-feature-flag.input.ts

+  @Field(() => String)
+  @IsNotEmpty()
+  featureFlag: FeatureFlagKey;


logic: featureFlag field is typed as String but accepts FeatureFlagKey enum - should use @field(() => FeatureFlagKey) for proper GraphQL enum type

greptile-apps · 2024-11-27T18:28:00Z

packages/twenty-server/src/engine/core-modules/admin-panel/dtos/user-lookup.entity.ts

+  @Field(() => Number)
+  totalUsers: number;


style: consider using Int instead of Number for totalUsers count

packages/twenty-server/src/engine/core-modules/admin-panel/dtos/user-lookup.input.ts

packages/twenty-server/src/engine/core-modules/auth/auth.module.ts

packages/twenty-server/src/engine/core-modules/core-engine.module.ts

FelixMalfait

Great work!

github-actions · 2024-11-28T12:44:19Z

Thanks @ehconitin for your contribution!
This marks your 62nd PR on the repo. You're top 1% of all our contributors 🎉
See contributor page - Share on LinkedIn - Share on Twitter

init

4dab42f

ehconitin marked this pull request as draft November 25, 2024 19:52

ehconitin added the -PR: wip label Nov 25, 2024

ehconitin added 3 commits November 26, 2024 01:29

code cleaning

abde3e5

Merge remote-tracking branch 'upstream/main' into adminPanel

228300d

fix tests

d6aa882

greptile-apps bot reviewed Nov 25, 2024

View reviewed changes

ehconitin and others added 4 commits November 26, 2024 02:09

use clearSession for workspace switching

1a7ef36

Introduce admin module in the backend

e860661

update label

a27d911

Rename admin to admin panel and quick POC to add backend endpoints

1cdd2c4

twentyhq deleted a comment from greptile-apps bot Nov 26, 2024

ehconitin added 6 commits November 27, 2024 00:18

Merge remote-tracking branch 'upstream/main' into adminPanel

7bd995b

frontend for feature flags -- need code cleaning

4418191

Merge remote-tracking branch 'upstream/main' into adminPanel

1132af7

tabs for workspaces

c4f05fc

remove duplicate file

38ef04b

onInputEnter and rename

fa229df

FelixMalfait reviewed Nov 27, 2024

View reviewed changes

packages/twenty-front/src/modules/settings/admin-panel/hooks/useFeatureFlagsManagement.ts Outdated Show resolved Hide resolved

FelixMalfait reviewed Nov 27, 2024

View reviewed changes

packages/twenty-front/src/modules/settings/admin-panel/hooks/useImpersonate.ts Outdated Show resolved Hide resolved

FelixMalfait reviewed Nov 27, 2024

View reviewed changes

FelixMalfait added -PR: awaiting author and removed -PR: wip labels Nov 27, 2024

FelixMalfait marked this pull request as ready for review November 27, 2024 18:08

greptile-apps bot reviewed Nov 27, 2024

View reviewed changes

ehconitin added 3 commits November 28, 2024 00:26

remove try catch and console logs

c16e420

grep review

ac9bc27

Merge remote-tracking branch 'upstream/main' into adminPanel

3131e11

fix

0f91bd0

FelixMalfait approved these changes Nov 28, 2024

View reviewed changes

FelixMalfait merged commit e96ad9a into twentyhq:main Nov 28, 2024
17 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Admin panel init #8742

Admin panel init #8742

ehconitin commented Nov 25, 2024 •

edited

Loading

greptile-apps bot left a comment

greptile-apps bot Nov 25, 2024

greptile-apps bot Nov 25, 2024

greptile-apps bot Nov 25, 2024

greptile-apps bot Nov 25, 2024

greptile-apps bot Nov 25, 2024

greptile-apps bot Nov 25, 2024

FelixMalfait Nov 27, 2024

FelixMalfait Nov 27, 2024

FelixMalfait left a comment

greptile-apps bot left a comment

greptile-apps bot Nov 27, 2024

greptile-apps bot Nov 27, 2024

greptile-apps bot Nov 27, 2024

FelixMalfait left a comment

github-actions bot commented Nov 28, 2024

Admin panel init #8742

Admin panel init #8742

Conversation

ehconitin commented Nov 25, 2024 • edited Loading

greptile-apps bot left a comment

Choose a reason for hiding this comment

PR Summary

greptile-apps bot Nov 25, 2024

Choose a reason for hiding this comment

greptile-apps bot Nov 25, 2024

Choose a reason for hiding this comment

greptile-apps bot Nov 25, 2024

Choose a reason for hiding this comment

greptile-apps bot Nov 25, 2024

Choose a reason for hiding this comment

greptile-apps bot Nov 25, 2024

Choose a reason for hiding this comment

greptile-apps bot Nov 25, 2024

Choose a reason for hiding this comment

FelixMalfait Nov 27, 2024

Choose a reason for hiding this comment

FelixMalfait Nov 27, 2024

Choose a reason for hiding this comment

FelixMalfait left a comment

Choose a reason for hiding this comment

greptile-apps bot left a comment

Choose a reason for hiding this comment

PR Summary

greptile-apps bot Nov 27, 2024

Choose a reason for hiding this comment

greptile-apps bot Nov 27, 2024

Choose a reason for hiding this comment

greptile-apps bot Nov 27, 2024

Choose a reason for hiding this comment

FelixMalfait left a comment

Choose a reason for hiding this comment

github-actions bot commented Nov 28, 2024

ehconitin commented Nov 25, 2024 •

edited

Loading