feat: userroles and permissions #123
Conversation
…dating api for role into one
| @@ -88,6 +89,7 @@ SuperTokens.init({ | |||
| }), | |||
| Session.init(), | |||
| AccountLinking.init(), | |||
| UserRoles.init(), | |||
There was a problem hiding this comment.
need to test when this is not done.
src/ui/pages/userroles/index.tsx
Outdated
| }; | ||
|
|
||
| async function fetchPermissionsForRoles() { | ||
| setIsFetchingRoles(true); |
There was a problem hiding this comment.
need to fetch permissions per role. Can't block the whole UI
src/ui/pages/userroles/index.tsx
Outdated
| permissions: response.permissions, | ||
| }); | ||
| } else { | ||
| throw new Error("This should never happen."); |
There was a problem hiding this comment.
this kind of pattern shoul dbe avoided
src/ui/pages/userroles/index.tsx
Outdated
| } else { | ||
| throw new Error("This should never happen."); | ||
| } | ||
| await new Promise((res) => setTimeout(res, 250)); |
There was a problem hiding this comment.
| await new Promise((res) => setTimeout(res, 250)); |
src/ui/pages/userroles/index.tsx
Outdated
|
|
||
| const [rolesRawResponse, setRolesRawResponse] = useState<string[]>([]); | ||
| // used to store roles with permissions data that are fetched on the client side. | ||
| const [roles, setRoles] = useState<Role[]>([]); |
There was a problem hiding this comment.
type of role will change too. To set permissions array as undefined.
| const { showToast } = useContext(PopupContentContext); | ||
|
|
||
| // list of roles fetched from the api | ||
| const [roles, setRoles] = useState<string[]>([]); |
There was a problem hiding this comment.
should be undefined.
| @@ -19,7 +19,6 @@ import { getDashboardAppBasePath } from "./utils"; | |||
|
|
|||
There was a problem hiding this comment.
add test in PR checklist for testing assigning / managing roles for a user who is a part of multiple tenants.
| selectedOption: string; | ||
| onOptionSelect: (value: string) => void; | ||
| }; | ||
| export default function Select({ onOptionSelect, options, selectedOption }: SelectProps) { |
There was a problem hiding this comment.
Use the browser selector and style that.
There was a problem hiding this comment.
I added a click action to the select component to handle mobile and tablet devices. as styling native select element is really a overhead.
| const [userRoles, setUserRoles] = useState<string[] | undefined>(undefined); | ||
| const [isUserRolesFeatureEnabled, setIsUserRolesFeatureEnabled] = useState<boolean | undefined>(undefined); | ||
| const [userRolesData, setUserRolesData] = useState<UserRolesResponse | undefined>(undefined); | ||
| const [currentlySelectedTenantId, setCurrentlySelectedTenantId] = useState(getSelectedTenantId() ?? "public"); |
There was a problem hiding this comment.
the default should be based on the tenant that the user belongs to - not from what comes from the user listing page.
There was a problem hiding this comment.
If the user belongs to the public tenant, show that, else whatever is the first item in the list of their tenants.
| void fetchUserRoles(); | ||
| }, [currentlySelectedTenantId]); | ||
|
|
||
| if (userDetail === undefined || userRolesData === undefined || isLoading) { |
There was a problem hiding this comment.
remove userRolesData === undefined
There was a problem hiding this comment.
Have the loading thing just in the user details section.
| setCurrentlySelectedTenantId(tenantId); | ||
| }} | ||
| isFeatureEnabled={userRolesData.status !== "FEATURE_NOT_ENABLED_ERROR"} | ||
| roles={userRolesData.status === "OK" ? userRolesData.roles : []} |
There was a problem hiding this comment.
for isFeatureEnabled and roles, we can't just assume true and [] in case userRolesData is undefined.
| import AssignRolesDialog from "../../userroles/components/dialogs/AssignRoles"; | ||
| import DeleteUserRoleDialog from "../../userroles/components/dialogs/DeleteUserRole"; | ||
| import { useUserDetailContext } from "../context/UserDetailContext"; | ||
| import "./userRolesList.scss"; | ||
|
|
||
| type UserRolesListProps = { | ||
| currentlySelectedTenantId: string; | ||
| userId: string; |
| const [showDeleteRoleDialog, setShowDeleteDialogRole] = useState(false); | ||
|
|
||
| const tenantIdsThatUserIsPartOf = userDetail.details.tenantIds; | ||
| const [currentlySelectedTenantId, setCurrentlySelectedTenantId] = useState(tenantIdsThatUserIsPartOf[0]); |
There was a problem hiding this comment.
if they are a part of the public tenant, we show that, else we show the 0th index.
…o feat/userroles-apispec
feat: userroles and permissions api spec
Summary of change
Add user roles and permissions feature to the dashboard.
Problem Statement
Figma
TODOS
(Overview of how the problem is solved by this PR)
Related issues
Test Plan
Tested on all primary browsers for:
Feature tests:
Documentation changes
(If relevant, please create a PR in our docs repo, or create a checklist here highlighting the necessary changes)
Checklist for important updates
package.jsonpackage-lock.jsonsrc/version.tsnpm run buildRemaining TODOs for this PR