Update permission implementation for ST V3

frontend/src/hooks/api/serviceTokens/enums.ts

@@ -0,0 +1,4 @@
+export enum Permission {
+    READ = "read",
+    WRITE = "write"
+}

frontend/src/hooks/api/serviceTokens/types.ts

@@ -1,3 +1,5 @@
+import { Permission } from "./enums";
+
 export type ServiceTokenScope = {
   environment: string;
   secretPath: string;
@@ -37,7 +39,7 @@ export type DeleteServiceTokenRes = { serviceTokenData: ServiceToken };
 // --- v3
 
 export type ServiceTokenV3Scope = {
-  permission: string;
+  permissions: Permission[];
   environment: string;
   secretPath: string;
 };
@@ -48,6 +50,7 @@ export type ServiceTokenDataV3 = {
   workspace: string;
   isActive: boolean;
   lastUsed?: string;
+  usageCount: number;
   scopes: ServiceTokenV3Scope[];
   expiresAt?: string;
   createdAt: string;

frontend/src/views/Settings/ProjectSettingsPage/components/ServiceTokenV3Section/AddServiceTokenV3Modal.tsx

@@ -32,6 +32,9 @@ import {
     useGetUserWsKey,
     useUpdateServiceTokenV3
 } from "@app/hooks/api";
+import {
+    Permission
+} from "@app/hooks/api/serviceTokens/enums";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
 const expirations = [
@@ -43,7 +46,13 @@ const expirations = [
     { label: "12 months", value: "31104000" }
 ];
 
-const permissionValues: Array<"read" | "readWrite"> = ["read", "readWrite"];
+const permissionsMap: {
+    "read": Permission[],
+    "readWrite": Permission[]
+} = {
+    "read": [Permission.READ],
+    "readWrite": [Permission.READ, Permission.WRITE],
+}
 
 const schema = yup.object({
     name: yup.string().required("ST V3 name is required"),
@@ -51,7 +60,7 @@ const schema = yup.object({
     scopes: yup
     .array(
       yup.object({
-        permission: yup.string().oneOf(permissionValues, "Invalid permission").required().label("Permission"),
+        permission: yup.string().oneOf(Object.keys(permissionsMap), "Invalid permission").required().label("Permission") as yup.SchemaOf<"read" | "readWrite", object>,
         environment: yup.string().max(50).required().label("Environment"),
         secretPath: yup
           .string()
@@ -112,7 +121,18 @@ export const AddServiceTokenV3Modal = ({
         if (serviceTokenData) {
             reset({
                 name: serviceTokenData.name,
-                scopes: serviceTokenData.scopes
+                scopes: serviceTokenData.scopes.map((scope) => {
+                    let permission = "read";
+                    if (scope.permissions.includes(Permission.WRITE)) {
+                        permission = "readWrite";
+                    }
+                    
+                    return ({
+                        environment: scope.environment,
+                        secretPath: scope.secretPath,
+                        permission
+                    })
+                })
             });
         } else {
             reset({
@@ -140,12 +160,21 @@ export const AddServiceTokenV3Modal = ({
                 scopes: any;
             };
             
+            // convert read/readWrite permission => ["read", "write"] format
+            const reformattedScopes = scopes.map((scope) => {
+                return ({
+                    environment: scope.environment,
+                    secretPath: scope.secretPath,
+                    permissions: permissionsMap[scope.permission]
+                });
+            })
+            
             if (serviceTokenData) {
                 // update
                 await updateMutateAsync({
                     serviceTokenDataId: serviceTokenData.serviceTokenDataId,
                     name,
-                    scopes,
+                    scopes: reformattedScopes,
                     expiresIn: expiresIn === "" ? undefined : Number(expiresIn)
                 });
             } else {
@@ -176,7 +205,7 @@ export const AddServiceTokenV3Modal = ({
                     name,
                     workspaceId: currentWorkspace._id,
                     publicKey,
-                    scopes,
+                    scopes: reformattedScopes,
                     expiresIn: expiresIn === "" ? undefined : Number(expiresIn),
                     encryptedKey: ciphertext,
                     nonce

frontend/src/views/Settings/ProjectSettingsPage/components/ServiceTokenV3Section/ServiceTokenV3Table.tsx

@@ -21,9 +21,8 @@ import {
     useGetWorkspaceServiceTokenDataV3,
     useUpdateServiceTokenV3
 } from "@app/hooks/api";
-import {
-    ServiceTokenV3Scope
-} from "@app/hooks/api/serviceTokens/types"
+import { ServiceTokenV3Scope } from "@app/hooks/api/serviceTokens/types"
+import { Permission } from "@app/hooks/api/serviceTokens/enums"
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
 type Props = {
@@ -90,6 +89,7 @@ export const ServiceTokenV3Table = ({
                         <Th>Name</Th>
                         <Th>Status</Th>
                         <Th>Scopes</Th>
+                        <Th># Times Used</Th>
                         <Th>Last Used</Th>
                         <Th>Created At</Th>
                         <Th>Expires At</Th>
@@ -106,6 +106,7 @@ export const ServiceTokenV3Table = ({
                         name,
                         isActive,
                         lastUsed,
+                        usageCount,
                         scopes,
                         createdAt,
                         expiresAt
@@ -135,16 +136,25 @@ export const ServiceTokenV3Table = ({
                                 </Td>
                                 <Td>
                                     {scopes.map((scope) => {
+                                        let permissionText = "read"
+                                        if (
+                                            scope.permissions.includes(Permission.WRITE) &&
+                                            scope.permissions.includes(Permission.READ)
+                                        ) {
+                                            permissionText = "readWrite";
+                                        }
+                                        
                                         return (
                                             <p key={`service-token-${_id}-scope-${scope.environment}-${scope.secretPath}`}>
                                                 <span className="font-bold">
-                                                    {scope.permission}
+                                                    {scope.permissions}
                                                 </span>
                                                 {` @${scope.environment} - ${scope.secretPath}`}
                                             </p>
                                         );
                                     })}
                                 </Td> 
+                                <Td>{usageCount}</Td>
                                 <Td>{lastUsed ? formatDate(lastUsed) : "-"}</Td>
                                 <Td>{formatDate(createdAt)}</Td>
                                 <Td>{expiresAt ? formatDate(expiresAt) : "-"}</Td>