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

@@ -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;
 }

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

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 }) => {

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();
   }

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 {