feat(user-auth): add pr suggestions

frontend/src/pages/organization/SettingsPage/components/OrgAuthTab/OrgUserAccessTokenLimitSection.tsx

@@ -3,8 +3,9 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
+import { OrgPermissionCan } from "@app/components/permissions";
 import { Button, FormControl, Input, Select, SelectItem } from "@app/components/v2";
-import { useOrganization } from "@app/context";
+import { OrgPermissionActions, OrgPermissionSubjects, useOrganization } from "@app/context";
 import { useUpdateOrg } from "@app/hooks/api";
 
 const formSchema = z.object({
@@ -93,6 +94,8 @@ export const OrgUserAccessTokenLimitSection = () => {
         This defines the maximum time a user token will be valid. After this time, the user will
         need to re-authenticate.
       </p>
+      <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Settings}>
+        {(isAllowed) => (
           <form onSubmit={handleSubmit(handleUserTokenExpirationSubmit)} autoComplete="off">
             <div className="flex max-w-md gap-4">
               <div className="flex-1">
@@ -111,7 +114,8 @@ export const OrgUserAccessTokenLimitSection = () => {
                         min={1}
                         step={1}
                         value={field.value}
-                    onChange={(e) => field.onChange(parseInt(e.target.value, 10) || 1)}
+                        onChange={(e) => field.onChange(parseInt(e.target.value, 10))}
+                        disabled={!isAllowed}
                       />
                     </FormControl>
                   )}
@@ -122,11 +126,17 @@ export const OrgUserAccessTokenLimitSection = () => {
                   control={control}
                   name="expirationUnit"
                   render={({ field, fieldState: { error } }) => (
-                <FormControl isError={Boolean(error)} errorText={error?.message} label="Time unit">
+                    <FormControl
+                      isError={Boolean(error)}
+                      errorText={error?.message}
+                      label="Time unit"
+                    >
                       <Select
                         value={field.value}
+                        className="pr-2"
                         onValueChange={field.onChange}
                         placeholder="Select time unit"
+                        isDisabled={!isAllowed}
                       >
                         {timeUnits.map(({ value, label }) => (
                           <SelectItem
@@ -149,10 +159,13 @@ export const OrgUserAccessTokenLimitSection = () => {
               isLoading={isSubmitting}
               disabled={!isDirty}
               className="mt-4"
+              isDisabled={!isAllowed}
             >
               Save
             </Button>
           </form>
+        )}
+      </OrgPermissionCan>
     </div>
   );
 };