mirror of
https://github.com/logto-io/logto.git
synced 2024-12-16 20:26:19 -05:00
feat(console): add the user permission tooltips (#5305)
add the user permission tooltips
This commit is contained in:
parent
820158706b
commit
e8e57a410f
18 changed files with 70 additions and 7 deletions
|
@ -49,10 +49,6 @@
|
|||
.trailingIcon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-left: _.unit(2);
|
||||
}
|
||||
}
|
||||
|
||||
&.small {
|
||||
|
|
|
@ -13,3 +13,9 @@
|
|||
padding-bottom: _.unit(2);
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
display: flex;
|
||||
gap: _.unit(1);
|
||||
align-items: center;
|
||||
}
|
||||
|
|
|
@ -1,10 +1,15 @@
|
|||
/* eslint-disable consistent-default-export-name/default-export-match-filename */
|
||||
// We need to return a ReactNode property in the parseRowGroup function
|
||||
import {
|
||||
type ApplicationUserConsentScopesResponse,
|
||||
ApplicationUserConsentScopeType,
|
||||
} from '@logto/schemas';
|
||||
import { useCallback } from 'react';
|
||||
import { useCallback, type ReactNode } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
import Tip from '@/assets/icons/tip.svg';
|
||||
import IconButton from '@/ds-components/IconButton';
|
||||
import { ToggleTip } from '@/ds-components/Tip';
|
||||
import useApi from '@/hooks/use-api';
|
||||
|
||||
import * as styles from './index.module.scss';
|
||||
|
@ -34,7 +39,7 @@ export type ScopesTableRowDataType =
|
|||
|
||||
type ScopesTableRowGroupType = {
|
||||
key: string;
|
||||
label: string;
|
||||
label: string | ReactNode;
|
||||
labelRowClassName?: string;
|
||||
data: ScopesTableRowDataType[];
|
||||
};
|
||||
|
@ -58,7 +63,18 @@ const useScopesTable = () => {
|
|||
|
||||
const userScopesGroup: ScopesTableRowGroupType = {
|
||||
key: ApplicationUserConsentScopeType.UserScopes,
|
||||
label: t('application_details.permissions.user_permissions'),
|
||||
label: (
|
||||
<div className={styles.label}>
|
||||
{t('application_details.permissions.user_permissions')}
|
||||
<ToggleTip
|
||||
content={t('application_details.permissions.user_data_permission_description_tips')}
|
||||
>
|
||||
<IconButton size="small">
|
||||
<Tip />
|
||||
</IconButton>
|
||||
</ToggleTip>
|
||||
</div>
|
||||
),
|
||||
labelRowClassName: styles.sectionTitleRow,
|
||||
data: userScopes.map((scope) => ({
|
||||
type: ApplicationUserConsentScopeType.UserScopes,
|
||||
|
@ -145,3 +161,4 @@ const useScopesTable = () => {
|
|||
};
|
||||
|
||||
export default useScopesTable;
|
||||
/* eslint-enable consistent-default-export-name/default-export-match-filename */
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -119,6 +119,8 @@ const application_details = {
|
|||
user_permissions_assignment_form_title: 'Add the user profile permissions',
|
||||
organization_permissions_assignment_form_title: 'Add the organization permissions',
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -170,6 +170,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -167,6 +167,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -167,6 +167,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
|
@ -168,6 +168,9 @@ const application_details = {
|
|||
/** UNTRANSLATED */
|
||||
api_resource_permissions_assignment_form_title: 'Add the API resource permissions',
|
||||
/** UNTRANSLATED */
|
||||
user_data_permission_description_tips:
|
||||
'You can modify the description of the personal user data permissions via "Sign-in Experience > Content > Manage Language"',
|
||||
/** UNTRANSLATED */
|
||||
permission_description_tips:
|
||||
'When Logto is used as an Identity Provider (IdP) for authentication in third-party apps, and users are asked for authorization, this description appears on the consent screen.',
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue