Client:OAuth2: restore allowed origins, add open id scope

This commit is contained in:
Timofey Boyko 2023-11-27 13:38:35 +03:00
parent 4a09f4c562
commit 1f6679f29a
9 changed files with 86 additions and 54 deletions

View File

@ -8,7 +8,7 @@ interface OAuthBlockProps {
t: any;
redirectUrisValue: string[];
// allowedOriginsValue: string[];
allowedOriginsValue: string[];
changeValue: (name: string, value: string) => void;
@ -18,7 +18,7 @@ interface OAuthBlockProps {
const OAuthBlock = ({
t,
redirectUrisValue,
// allowedOriginsValue,
allowedOriginsValue,
changeValue,
@ -38,7 +38,8 @@ const OAuthBlock = ({
helpButtonText={t("RedirectsURLSHelpButton")}
isDisabled={isEdit}
/>
{/* <MultiInputGroup
<MultiInputGroup
t={t}
label={t("AllowedOrigins")}
placeholder={t("EnterURL")}
name={"allowed_origins"}
@ -46,7 +47,7 @@ const OAuthBlock = ({
currentValue={allowedOriginsValue}
helpButtonText={t("AllowedOriginsHelpButton")}
isDisabled={isEdit}
/> */}
/>
</StyledInputBlock>
</StyledBlock>
);

View File

@ -51,7 +51,7 @@ const ScopesBlock = ({
const onAddCheckedScope = (
group: ScopeGroup,
type: ScopeType,
name: string
name: string = ""
) => {
const isChecked = checkedScopes.includes(name);
@ -73,7 +73,9 @@ const ScopesBlock = ({
});
} else {
setFilteredScopes((val) => {
const isReadChecked = checkedScopes.includes(val[group].read.name);
const isReadChecked = checkedScopes.includes(
val[group].read?.name || ""
);
val[group].isChecked = isReadChecked;
val[group].checkedType = isReadChecked ? ScopeType.read : undefined;
@ -111,25 +113,29 @@ const ScopesBlock = ({
>
{t(`Common:${name}`)}
</Text>
{/* @ts-ignore */}
<Text
className={"scope-desc"}
fontSize={"12px"}
fontWeight={400}
lineHeight={"16px"}
>
{/* @ts-ignore */}
{scope.read?.name && (
// @ts-ignore
<Text
className={"scope-desc"}
as={"span"}
fontSize={"12px"}
fontWeight={600}
fontWeight={400}
lineHeight={"16px"}
>
{scope.read.name}
</Text>{" "}
{t(`Common:${scope.read.tKey}`)}
</Text>
{/* @ts-ignore */}
<Text
className={"scope-desc"}
as={"span"}
fontSize={"12px"}
fontWeight={600}
lineHeight={"16px"}
>
{scope.read?.name}
</Text>{" "}
{t(`Common:${scope.read?.tKey}`)}
</Text>
)}
{/* @ts-ignore */}
<Text
className={"scope-desc"}
@ -151,18 +157,22 @@ const ScopesBlock = ({
</Text>
</StyledScopesName>
<StyledScopesCheckbox>
<Checkbox
className="checkbox-read"
isChecked={isReadChecked}
isDisabled={isReadDisabled || isEdit}
onChange={() =>
onAddCheckedScope(
key as ScopeGroup,
ScopeType.read,
scope.read.name
)
}
/>
{scope.read?.name ? (
<Checkbox
className="checkbox-read"
isChecked={isReadChecked}
isDisabled={isReadDisabled || isEdit}
onChange={() =>
onAddCheckedScope(
key as ScopeGroup,
ScopeType.read,
scope.read?.name
)
}
/>
) : (
<></>
)}
</StyledScopesCheckbox>
<StyledScopesCheckbox>
<Checkbox

View File

@ -2,7 +2,6 @@ import React from "react";
import { inject, observer } from "mobx-react";
import { useNavigate } from "react-router-dom";
import { useTranslation } from "react-i18next";
import { debounce } from "lodash";
import {
IClientProps,
@ -20,6 +19,7 @@ import { StyledContainer } from "./ClientForm.styled";
import { ClientFormProps, ClientStore } from "./ClientForm.types";
import ClientFormLoader from "./Loader";
import { AuthenticationMethod } from "@docspace/common/utils/oauth/enums";
export function isValidUrl(url: string) {
try {
@ -63,13 +63,13 @@ const ClientForm = ({
description: "",
redirect_uris: [],
// allowed_origins: [],
allowed_origins: [],
logout_redirect_uri: "",
terms_url: "",
policy_url: "",
authentication_method: "client_secret_post",
authentication_method: AuthenticationMethod.client_secret_post,
scopes: [],
});
@ -160,8 +160,8 @@ const ClientForm = ({
redirect_uris:
fetchedClient?.redirectUris || client?.redirectUris || [],
// allowed_origins:
// fetchedClient?.allowedOrigins || client?.allowedOrigins || [],
allowed_origins:
fetchedClient?.allowedOrigins || client?.allowedOrigins || [],
logout_redirect_uri:
fetchedClient?.logoutRedirectUri || client?.logoutRedirectUri || "",
@ -171,7 +171,7 @@ const ClientForm = ({
authentication_method:
fetchedClient?.authenticationMethod ||
client?.authenticationMethod ||
"",
AuthenticationMethod.client_secret_post,
scopes: fetchedClient?.scopes || client?.scopes || [],
});
@ -314,10 +314,10 @@ const ClientForm = ({
isValid = isValid && form[key].length > 0;
break;
// case "allowed_origins":
// isValid = isValid && form[key].length > 0;
case "allowed_origins":
isValid = isValid && form[key].length > 0;
// break;
break;
case "logout_redirect_uris":
isValid = isValid;
@ -428,7 +428,7 @@ const ClientForm = ({
<OAuthBlock
t={t}
redirectUrisValue={form.redirect_uris}
// allowedOriginsValue={form.allowed_origins}
allowedOriginsValue={form.allowed_origins}
changeValue={onChangeForm}
isEdit={isEdit}
/>

View File

@ -44,6 +44,7 @@
"workbox-window": "^6.5.4"
},
"devDependencies": {
"@types/crypto-js": "^4.2.1",
"@welldone-software/why-did-you-render": "^6.2.3"
}
}

View File

@ -8,4 +8,10 @@ export const enum ScopeGroup {
accounts = "accounts",
profiles = "profiles",
rooms = "rooms",
openid = "openid",
}
export const enum AuthenticationMethod {
none = "none",
"client_secret_post" = "client_secret_post",
}

View File

@ -33,7 +33,7 @@ export const transformToClientProps = (
modified_by,
modified_on,
website_url,
// allowed_origins,
allowed_origins,
creator_avatar,
creator_display_name,
} = clientDto;
@ -58,7 +58,7 @@ export const transformToClientProps = (
modifiedBy: modified_by,
modifiedOn: modified_on,
websiteUrl: website_url,
// allowedOrigins: allowed_origins,
allowedOrigins: allowed_origins,
creatorAvatar: creator_avatar,
creatorDisplayName: creator_display_name,
};
@ -80,7 +80,7 @@ export const transformToClientReqDTO = (
logoutRedirectUri: logout_redirect_uri,
scopes,
websiteUrl,
// allowedOrigins,
allowedOrigins,
} = clientProps;
const client: IClientReqDTO = {
@ -95,7 +95,7 @@ export const transformToClientReqDTO = (
scopes,
authentication_method: authenticationMethod,
website_url: websiteUrl,
// allowed_origins: allowedOrigins,
allowed_origins: allowedOrigins,
};
return client;
@ -130,6 +130,17 @@ export const filterScopeByGroup = (
const read = isRead ? { ...scope, tKey } : ({} as IScope);
const write = !isRead ? { ...scope, tKey } : ({} as IScope);
if (scope.group === ScopeGroup.openid) {
filteredScopes[scope.group] = {
isChecked,
checkedType: isChecked ? scope.type : undefined,
read: undefined,
write,
};
return;
}
if (filteredScopes[scope.group]) {
if (isRead) {
filteredScopes[scope.group].read = read;

View File

@ -1,4 +1,4 @@
import { ScopeGroup, ScopeType } from "./enums";
import { AuthenticationMethod, ScopeGroup, ScopeType } from "./enums";
export interface IScope {
name: string;
@ -11,7 +11,7 @@ export interface IFilteredScopes {
[key: string]: {
isChecked: boolean;
checkedType?: ScopeType;
read: IScope;
read?: IScope;
write: IScope;
};
}
@ -33,7 +33,7 @@ export interface IClientProps {
policyUrl: string;
termsUrl: string;
logo: string;
authenticationMethod: string;
authenticationMethod: AuthenticationMethod;
tenant: number;
redirectUris: string[];
logoutRedirectUri: string;
@ -41,7 +41,7 @@ export interface IClientProps {
invalidated: boolean;
scopes: string[];
websiteUrl: string;
// allowedOrigins: string[];
allowedOrigins: string[];
createdOn?: Date;
modifiedOn?: Date;
@ -55,14 +55,14 @@ export interface IClientReqDTO {
name: string;
description: string;
logo: string;
authentication_method: string;
authentication_method: AuthenticationMethod;
terms_url: string;
policy_url: string;
redirect_uris: string[];
logout_redirect_uri: string;
scopes: string[];
website_url: string;
// allowed_origins: string[];
allowed_origins: string[];
}
export interface IClientResDTO {
@ -79,7 +79,7 @@ export interface IClientResDTO {
policy_url: string;
logout_redirect_uri: string;
authentication_method: string;
authentication_method: AuthenticationMethod;
scopes: string[];
@ -87,7 +87,7 @@ export interface IClientResDTO {
tenant: number;
invalidated: boolean;
website_url: string;
// allowed_origins: string[];
allowed_origins: string[];
created_on?: Date;
modified_on?: Date;

View File

@ -213,6 +213,8 @@
"OAuthFilesName": "Files & Folders",
"OAuthFilesReadDescription": "View all files and folders",
"OAuthFilesWriteDescription": "View and manage all files and folders",
"OAuthOpenIDName": "Open ID",
"OAuthOpenIDWriteDescription": "View and manage your personal data",
"OAuthProfilesName": "Profile",
"OAuthProfilesReadDescription": "View basic information about your profile",
"OAuthProfilesWriteDescription": "View and manage basic information about your profile",

View File

@ -3184,6 +3184,7 @@ __metadata:
dependencies:
"@babel/runtime": ^7.21.0
"@loadable/component": ^5.15.3
"@types/crypto-js": ^4.2.1
"@welldone-software/why-did-you-render": ^6.2.3
axios: ^0.22.0
cross-fetch: 3.1.5