Minor tweaks

lunary-ai · Mar 25, 2024 · 590ed93 · 590ed93
1 parent 00d61c5
commit 590ed93
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 59 deletions.
diff --git a/packages/frontend/pages/analytics.tsx b/packages/frontend/pages/analytics.tsx
@@ -13,7 +13,6 @@ import {
   useProject,
   useRunsUsage,
   useRunsUsageByDay,
-  useUser,
 } from "@/utils/dataHooks"
 import {
   Center,
@@ -28,9 +27,6 @@ import {
 import { useLocalStorage } from "@mantine/hooks"
 import { IconChartAreaLine } from "@tabler/icons-react"
 import { NextSeo } from "next-seo"
-import { useEffect } from "react"
-import { useRouter } from "next/router"
-import { hasAccess } from "shared"
 
 const calculateDailyCost = (usage) => {
   // calculate using calcRunCost, reduce by model, and filter by type llm
@@ -54,16 +50,13 @@ const calculateDailyCost = (usage) => {
 }
 
 export default function Analytics() {
-  const router = useRouter()
   const [range, setRange] = useLocalStorage({
     key: "dateRange-analytics",
     defaultValue: 7,
   })
 
   const { project } = useProject()
-
   const { org } = useOrg()
-  const { user } = useUser()
 
   const { usage, loading: usageLoading } = useRunsUsage(range)
 
@@ -72,12 +65,6 @@ export default function Analytics() {
 
   const loading = usageLoading || dailyUsageLoading || usersLoading
 
-  useEffect(() => {
-    if (!hasAccess(user.role, "analytics", "read")) {
-      router.push("/prompts")
-    }
-  }, [router])
-
   if (loading)
     return (
       <Center h="60vh">

diff --git a/packages/frontend/pages/index.tsx b/packages/frontend/pages/index.tsx
@@ -1,13 +1,36 @@
 import { useAuth } from "@/utils/auth"
+import { useUser } from "@/utils/dataHooks"
 import { Center, Loader } from "@mantine/core"
-import Router from "next/router"
+import { useRouter } from "next/router"
 import { useEffect } from "react"
+import { hasAccess } from "shared"
 
 function IndexPage() {
+  const router = useRouter()
   const { isSignedIn } = useAuth()
+  const { user } = useUser()
+
   useEffect(() => {
-    Router.replace(isSignedIn ? "/analytics" : "/login")
-  }, [])
+    console.log(
+      user.role,
+      router.isReady,
+      hasAccess(user.role, "analytics", "read"),
+    )
+    if (!router.isReady) {
+      console.log("router not ready")
+      return
+    }
+    if (!isSignedIn) {
+      router.replace("/login")
+      return
+    }
+
+    if (hasAccess(user.role, "analytics", "read")) {
+      router.replace("/analytics")
+    } else {
+      router.replace("/prompts")
+    }
+  }, [user, router.isReady])
 
   return (
     <Center h="100vh" w="100vw">

diff --git a/packages/frontend/pages/settings.tsx b/packages/frontend/pages/settings.tsx
@@ -54,55 +54,25 @@ export default function AppAnalytics() {
           props={["count"]}
         />
 
-        <SettingsCard title="Keys">
-          <Alert
-            variant="light"
-            title={
-              <Group>
-                <Text fw={500}>Project ID:</Text>
-                <CopyText c="green.8" value={project?.id} />
-              </Group>
-            }
-            color="green"
-          >
-            <Text>
-              Your project ID can be used from your server or frontend code to
-              track events and send requests to the API.
-            </Text>
-          </Alert>
-
-          {/* <Alert
+        {user.role !== "viewer" && (
+          <SettingsCard title="Keys">
+            <Alert
               variant="light"
               title={
                 <Group>
-                  <Text fw={500}>Public Tracking Key: </Text>
-                  <CopyText c="green.8" value={project?.publicApiKey} />
+                  <Text fw={500}>Project ID:</Text>
+                  <CopyText c="green.8" value={project?.id} />
                 </Group>
               }
               color="green"
             >
               <Text>
-                Public API keys can be used from your server or frontend code to
+                Your project ID can be used from your server or frontend code to
                 track events and send requests to the API.
               </Text>
-            </Alert> */}
-
-          {/* <Alert
-              variant="light"
-              title={
-                <Group>
-                  <Text fw={500}>Private Key:</Text>
-                  <CopyText c="red.8" value={project?.privateApiKey} />
-                </Group>
-              }
-              color="red"
-            >
-              <Text>
-                Private API keys should be used only on your server – they give
-                read/write/delete API access to your project's resources.
-              </Text>
-            </Alert> */}
-        </SettingsCard>
+            </Alert>
+          </SettingsCard>
+        )}
 
         {user && hasAccess(user.role, "projects", "delete") && (
           <SettingsCard title="Danger Zone" align="start">

diff --git a/packages/frontend/pages/team.tsx b/packages/frontend/pages/team.tsx
@@ -48,7 +48,7 @@ import {
 import { fetcher } from "@/utils/fetcher"
 import { useDisclosure } from "@mantine/hooks"
 import { notifications } from "@mantine/notifications"
-import { roles } from "shared"
+import { hasAccess, roles } from "shared"
 import classes from "./team.module.css"
 import { useForm } from "@mantine/form"
 import SearchBar from "@/components/blocks/SearchBar"
@@ -705,7 +705,11 @@ function MemberList({ users, isInvitation }) {
                             ))}
                           </Popover.Dropdown>
                         </Popover>
-                        {user.role !== "owner" && (
+                        {hasAccess(
+                          currentUser.role,
+                          "teamMembers",
+                          "update",
+                        ) && (
                           <Button
                             variant="default"
                             onClick={() => handleOpenModal(user)}
@@ -764,6 +768,7 @@ function MemberListCard() {
 // TODO: put back at root level
 export default function Team() {
   const { org } = useOrg()
+  const { user } = useUser()
   const samlEnabled = org?.samlEnabled
 
   if (!org) {
@@ -777,9 +782,11 @@ export default function Team() {
       <Stack gap="xl">
         <Title order={2}>Manage Team</Title>
 
-        <InviteMemberCard />
+        {hasAccess(user.role, "teamMembers", "create") && <InviteMemberCard />}
         <MemberListCard />
-        {samlEnabled && <SAMLConfig />}
+        {samlEnabled && ["admin", "owner"].includes(user.role) && (
+          <SAMLConfig />
+        )}
       </Stack>
     </Container>
   )