restrict certain routes to admins

web/src/app/app/settings/(permissions)/attributes/page.tsx

@@ -1,8 +1,8 @@
 'use client';
 
 import React from 'react';
-import { SettingsEmptyState } from '../_SettingsEmptyState';
-import { SettingsPageHeader } from '../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (

web/src/app/app/settings/(permissions)/dataset-groups/page.tsx

@@ -1,6 +1,6 @@
 'use client';
 import React, { useState } from 'react';
-import { SettingsPageHeader } from '../_SettingsPageHeader';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 import { PermissionSearch, NewDatasetGroupModal } from '@appComponents/PermissionComponents';
 import { useDebounceSearch } from '@/hooks/useDebounceSearch';
 import { useListDatasetGroups } from '@/api/buster_rest';

web/src/app/app/settings/(permissions)/layout.tsx

@@ -0,0 +1,17 @@
+import { BusterRoutes, createBusterRoute } from '@/routes/busterRoutes';
+import { useCheckIfUserIsAdmin_server } from '@/server_context/user';
+import { redirect } from 'next/navigation';
+
+export default async function Layout({ children }: { children: React.ReactNode }) {
+  const isAdmin = await useCheckIfUserIsAdmin_server();
+
+  if (!isAdmin) {
+    return redirect(
+      createBusterRoute({
+        route: BusterRoutes.SETTINGS_GENERAL
+      })
+    );
+  }
+
+  return <>{children}</>;
+}

web/src/app/app/settings/(permissions)/permission-groups/page.tsx

@@ -1,6 +1,6 @@
 'use client';
 import React, { useState } from 'react';
-import { SettingsPageHeader } from '../_SettingsPageHeader';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 import { PermissionSearch, NewPermissionGroupModal } from '@appComponents/PermissionComponents';
 import { useDebounceSearch } from '@/hooks/useDebounceSearch';
 import { useListAllPermissionGroups } from '@/api/buster_rest';

web/src/app/app/settings/(permissions)/users/ListUsersComponent.tsx

@@ -11,7 +11,7 @@ import React, { useMemo, useState } from 'react';
 import { Text } from '@/components/text';
 import { OrganizationUserRoleText } from './config';
 import { BusterRoutes, createBusterRoute } from '@/routes';
-import { ListUserItem } from '../../_components/ListContent';
+import { ListUserItem } from '../../../_components/ListContent';
 
 export const ListUsersComponent: React.FC<{
   users: OrganizationUser[];

web/src/app/app/settings/(permissions)/users/[userId]/permission-groups/page.tsx

@@ -1,7 +1,7 @@
 import { prefetchGetUserPermissionGroups } from '@/api/buster_rest/users';
 import { HydrationBoundary, dehydrate } from '@tanstack/react-query';
 import { UserPermissionGroupsController } from './UserPermissionGroupsController';
-import { useCheckIfUserIsAdmin_server } from '../../../../../../server_context/user';
+import { useCheckIfUserIsAdmin_server } from '../../../../../../../server_context/user';
 import { redirect } from 'next/navigation';
 import { BusterRoutes, createBusterRoute } from '@/routes';
 

web/src/app/app/settings/(permissions)/users/page.tsx

@@ -1,12 +1,12 @@
 'use client';
 
 import React from 'react';
-import { SettingsPageHeader } from '../_SettingsPageHeader';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 import { useDebounceSearch } from '@/hooks/useDebounceSearch';
 import { useGetOrganizationUsers } from '@/api/buster_rest';
 import { useUserConfigContextSelector } from '@/context/Users';
 import { ListUsersComponent } from './ListUsersComponent';
-import { PermissionSearch } from '../../_components/PermissionComponents';
+import { PermissionSearch } from '../../../_components/PermissionComponents';
 
 export default function Page() {
   const userOrganization = useUserConfigContextSelector((x) => x.userOrganizations);

web/src/app/app/settings/(restricted-width)/api-keys/page.tsx

@@ -1,5 +1,5 @@
 import { useCheckIfUserIsAdmin_server } from '../../../../../server_context/user';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 import { ApiKeysController } from './ApiKeysController';
 import { createBusterRoute, BusterRoutes } from '@/routes';
 import { redirect } from 'next/navigation';

web/src/app/app/settings/(restricted-width)/billing/page.tsx

@@ -1,7 +1,20 @@
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
+import { redirect } from 'next/navigation';
+import { BusterRoutes, createBusterRoute } from '@/routes/busterRoutes';
+import { useCheckIfUserIsAdmin_server } from '@/server_context/user';
+
+export default async function Page() {
+  const isAdmin = await useCheckIfUserIsAdmin_server();
+
+  if (!isAdmin) {
+    return redirect(
+      createBusterRoute({
+        route: BusterRoutes.SETTINGS_GENERAL
+      })
+    );
+  }
 
-export default function Page() {
   return (
     <div>
       <SettingsPageHeader title="Billing" description="Manage invoice, payment methods, & more" />

web/src/app/app/settings/(restricted-width)/datasources/(admin-restricted-space)/add/page.tsx

@@ -2,8 +2,8 @@
 
 import React from 'react';
 import { BusterRoutes, createBusterRoute } from '@/routes';
-import { HeaderContainer } from '../_HeaderContainer';
-import { useContext, useState } from 'react';
+import { HeaderContainer } from '../../_HeaderContainer';
+import { useState } from 'react';
 import { DatabaseNames, DataSourceTypes, SUPPORTED_DATASOURCES } from '@/api/buster_rest';
 
 import { AppDataSourceIcon } from '@/components/icons/AppDataSourceIcons';

web/src/app/app/settings/(restricted-width)/datasources/(admin-restricted-space)/layout.tsx

@@ -0,0 +1,16 @@
+import { BusterRoutes, createBusterRoute } from '@/routes/busterRoutes';
+import { useCheckIfUserIsAdmin_server } from '@/server_context/user';
+import { redirect } from 'next/navigation';
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  const isAdmin = useCheckIfUserIsAdmin_server();
+
+  if (!isAdmin) {
+    return redirect(
+      createBusterRoute({
+        route: BusterRoutes.SETTINGS_DATASOURCES
+      })
+    );
+  }
+  return <>{children}</>;
+}

web/src/app/app/settings/(restricted-width)/datasources/_DatasourceList.tsx

@@ -13,10 +13,12 @@ import Link from 'next/link';
 import { BusterRoutes, createBusterRoute } from '@/routes';
 import { useMount } from 'ahooks';
 import { Text } from '@/components';
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
 import { useAppLayoutContextSelector } from '@/context/BusterAppLayout';
+import { useUserConfigContextSelector } from '@/context/Users';
 
 export const DatasourceList: React.FC = () => {
+  const isAdmin = useUserConfigContextSelector((state) => state.isAdmin);
   const dataSourcesList = useDataSourceContextSelector((state) => state.dataSourcesList);
   const loadingDatasources = useDataSourceContextSelector((state) => state.loadingDatasources);
   const initDataSourceList = useDataSourceContextSelector((state) => state.initDataSourceList);
@@ -29,7 +31,7 @@ export const DatasourceList: React.FC = () => {
 
   return (
     <div className="flex flex-col space-y-4">
-      <AddSourceHeader />
+      <AddSourceHeader isAdmin={isAdmin} />
 
       {loadingDatasources ? (
         <SkeletonLoader />
@@ -37,6 +39,7 @@ export const DatasourceList: React.FC = () => {
         <DataSourceItems sources={dataSourcesList} />
       ) : (
         <SettingsEmptyState
+          showButton={isAdmin}
           title={`You don't have any data sources yet.`}
           description={`You don’t have any datasources. As soon as you do, they will start to  appear here.`}
           buttonText="New datasource"
@@ -52,7 +55,7 @@ export const DatasourceList: React.FC = () => {
   );
 };
 
-const AddSourceHeader: React.FC<{}> = () => {
+const AddSourceHeader: React.FC<{ isAdmin: boolean }> = ({ isAdmin }) => {
   return (
     <div className="flex w-full justify-between">
       <Text>Your data sources</Text>
@@ -60,9 +63,11 @@ const AddSourceHeader: React.FC<{}> = () => {
         href={createBusterRoute({
           route: BusterRoutes.SETTINGS_DATASOURCES_ADD
         })}>
-        <Button type="text" icon={<AppMaterialIcons icon="add" />}>
-          New datasource
-        </Button>
+        {isAdmin && (
+          <Button type="text" icon={<AppMaterialIcons icon="add" />}>
+            New datasource
+          </Button>
+        )}
       </Link>
     </div>
   );

web/src/app/app/settings/(restricted-width)/datasources/_HeaderContainer.tsx

@@ -1,11 +1,8 @@
 'use client';
 
-import { AppMaterialIcons, BackButton } from '@/components';
+import { BackButton } from '@/components';
 import React from 'react';
-
 import { createStyles } from 'antd-style';
-import Link from 'next/link';
-import { Text } from '@/components';
 
 const useStyles = createStyles(({ css, token }) => ({
   icon: {

web/src/app/app/settings/(restricted-width)/datasources/page.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
-import { Divider } from 'antd';
 import { DatasourceList } from './_DatasourceList';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (

web/src/app/app/settings/(restricted-width)/embeds/page.tsx

@@ -1,5 +1,5 @@
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (

web/src/app/app/settings/(restricted-width)/general/page.tsx

@@ -1,5 +1,5 @@
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (

web/src/app/app/settings/(restricted-width)/integrations/page.tsx

@@ -1,5 +1,5 @@
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (

web/src/app/app/settings/(restricted-width)/notifications/page.tsx

@@ -1,5 +1,5 @@
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (

web/src/app/app/settings/(restricted-width)/permissions/page.tsx

@@ -1,5 +1,5 @@
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (

web/src/app/app/settings/(restricted-width)/preferences/page.tsx

@@ -1,5 +1,5 @@
-import { SettingsEmptyState } from '../../_SettingsEmptyState';
-import { SettingsPageHeader } from '../../_SettingsPageHeader';
+import { SettingsEmptyState } from '../../_components/SettingsEmptyState';
+import { SettingsPageHeader } from '../../_components/SettingsPageHeader';
 
 export default function Page() {
   return (