From 3437d7f3d7e82e7c5d49f0eac12f55c571f69694 Mon Sep 17 00:00:00 2001
From: rammohan-y <37395033+rammohan-y@users.noreply.github.com>
Date: Tue, 1 Apr 2025 18:59:26 +0530
Subject: [PATCH] Feat/371 view only user checkbox (#478)

* feat/371 added read-only checkbox

* wip

* wip-2

* renamed is_read_only to is_view_only
---
 src/api/types.ts                             |  2 ++
 src/containers/internal/views/users/form.tsx | 28 ++++++++++++++++++++
 src/router/auth.tsx                          |  2 --
 src/store/index.tsx                          |  1 -
 src/store/types.ts                           |  1 +
 5 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/src/api/types.ts b/src/api/types.ts
index 0e4f232..ef5a9fc 100644
--- a/src/api/types.ts
+++ b/src/api/types.ts
@@ -143,6 +143,7 @@ export interface User {
   name: string;
   email: string;
   is_active: boolean;
+  is_view_only: boolean;
   force_change: boolean;
   account_sid: string | null;
   account_name?: string | null;
@@ -174,6 +175,7 @@ export interface UserUpdatePayload {
   name: string;
   force_change: boolean;
   is_active: boolean;
+  is_view_only: boolean;
   service_provider_sid: string | null;
   account_sid: string | null;
 }
diff --git a/src/containers/internal/views/users/form.tsx b/src/containers/internal/views/users/form.tsx
index 4a822de..1182247 100644
--- a/src/containers/internal/views/users/form.tsx
+++ b/src/containers/internal/views/users/form.tsx
@@ -61,6 +61,7 @@ export const UserForm = ({ user }: UserFormProps) => {
   const [forceChange, setForceChange] = useState(true);
   const [modal, setModal] = useState(false);
   const [accountSid, setAccountSid] = useState("");
+  const [isViewOnly, setIsViewOnly] = useState(false);
 
   const handleCancel = () => {
     setModal(false);
@@ -115,6 +116,7 @@ export const UserForm = ({ user }: UserFormProps) => {
         initial_password: initialPassword,
         force_change: forceChange,
         is_active: isActive,
+        is_view_only: isViewOnly,
         service_provider_sid:
           scope === USER_ADMIN && currentUser?.scope === USER_ADMIN
             ? null
@@ -145,6 +147,7 @@ export const UserForm = ({ user }: UserFormProps) => {
         initial_password: initialPassword || null,
         force_change: forceChange,
         is_active: isActive,
+        is_view_only: isViewOnly,
         service_provider_sid:
           scope === USER_ADMIN && currentUser?.scope === USER_ADMIN
             ? null
@@ -172,6 +175,7 @@ export const UserForm = ({ user }: UserFormProps) => {
       setName(user.data.name);
       setForceChange(!!user.data.force_change);
       setIsActive(!!user.data.is_active);
+      setIsViewOnly(!!user.data.is_view_only);
       setEmail(user.data.email);
       setScope(getUserScope(user.data));
       if (user.data.account_sid) {
@@ -253,6 +257,16 @@ export const UserForm = ({ user }: UserFormProps) => {
                 />
                 <div>User is active</div>
               </label>
+              <label htmlFor="is_view_only" className="chk">
+                <input
+                  id="is_view_only"
+                  name="is_view_only"
+                  type="checkbox"
+                  checked={isViewOnly}
+                  onChange={(e) => setIsViewOnly(e.target.checked)}
+                />
+                <div>View-only User</div>
+              </label>
             </fieldset>
           )}
           <fieldset>
@@ -283,6 +297,20 @@ export const UserForm = ({ user }: UserFormProps) => {
               onChange={(e) => setEmail(e.target.value)}
             />
           </fieldset>
+          {!user && (
+            <fieldset>
+              <label htmlFor="is_view_only" className="chk">
+                <input
+                  id="is_view_only"
+                  name="is_view_only"
+                  type="checkbox"
+                  checked={isViewOnly}
+                  onChange={(e) => setIsViewOnly(e.target.checked)}
+                />
+                <div>View-only User</div>
+              </label>
+            </fieldset>
+          )}
           <fieldset>
             <label htmlFor="initial_password">
               Temporary password
diff --git a/src/router/auth.tsx b/src/router/auth.tsx
index 7525896..523ea3e 100644
--- a/src/router/auth.tsx
+++ b/src/router/auth.tsx
@@ -86,7 +86,6 @@ export const parseJwt = (token: string) => {
       })
       .join(""),
   );
-
   return JSON.parse(jsonPayload);
 };
 
@@ -107,7 +106,6 @@ export const useProvideAuth = (): AuthStateContext => {
             token = response.json.token;
             setToken(token);
             userData = parseJwt(token);
-
             if (ENABLE_HOSTED_SYSTEM) {
               getMe()
                 .then(({ json }) => {
diff --git a/src/store/index.tsx b/src/store/index.tsx
index 0edf4c8..512e3f3 100644
--- a/src/store/index.tsx
+++ b/src/store/index.tsx
@@ -44,7 +44,6 @@ const reducer: React.Reducer<State, Action<keyof State>> = (state, action) => {
       return serviceProvidersAction(state, action);
     case "currentServiceProvider":
       return currentServiceProviderAction(state, action);
-
     default:
       throw new Error();
   }
diff --git a/src/store/types.ts b/src/store/types.ts
index 1446a1e..e60ed77 100644
--- a/src/store/types.ts
+++ b/src/store/types.ts
@@ -26,6 +26,7 @@ export enum Scope {
 
 export interface UserData extends UserJWT {
   access: Scope;
+  read_only_feature: boolean;
 }
 
 export interface State {