Client:OAuth2: add selector for authentication method

packages/client/src/pages/PortalSettings/categories/developer-tools/OAuth/sub-components/ClientForm/components/BasicBlock.tsx

@@ -1,4 +1,8 @@
 import React from "react";
+
+import ComboBox from "@docspace/components/combobox";
+import { AuthenticationMethod } from "@docspace/common/utils/oauth/enums";
+
 import { StyledBlock, StyledInputBlock } from "../ClientForm.styled";
 
 import BlockHeader from "./BlockHeader";
@@ -13,6 +17,7 @@ interface BasicBlockProps {
   websiteUrlValue: string;
   logoValue: string;
   descriptionValue: string;
+  authMethodValue: AuthenticationMethod;
 
   changeValue: (name: string, value: string) => void;
 
@@ -61,6 +66,7 @@ const BasicBlock = ({
   websiteUrlValue,
   logoValue,
   descriptionValue,
+  authMethodValue,
   changeValue,
 
   isEdit,
@@ -118,6 +124,21 @@ const BasicBlock = ({
     }
   };
 
+  const getAuthMethodOptions = () => {
+    const noneOption = {
+      key: AuthenticationMethod.none,
+      label: "none",
+    };
+
+    const clientSecretPostOption = {
+      key: AuthenticationMethod.client_secret_post,
+      label: "client_secret_post",
+    };
+    return [noneOption, clientSecretPostOption];
+  };
+
+  const options = getAuthMethodOptions();
+
   return (
     <StyledBlock>
       <BlockHeader header={"Basic info"} />
@@ -157,6 +178,24 @@ const BasicBlock = ({
           value={descriptionValue}
           onChange={onChange}
         />
+        <InputGroup
+          label={"Authentication method"}
+          name={"authentication_method"}
+          value=""
+          placeholder=""
+          error=""
+          onChange={() => {}}
+        >
+          <ComboBox
+            options={options}
+            selectedOption={options.find((o) => o.key === authMethodValue)}
+            displaySelectedOption
+            scaledOptions
+            onSelect={({ key }: { key: string }) => {
+              changeValue("authentication_method", key);
+            }}
+          />
+        </InputGroup>
       </StyledInputBlock>
     </StyledBlock>
   );

packages/client/src/pages/PortalSettings/categories/developer-tools/OAuth/sub-components/ClientForm/components/InputGroup.tsx

@@ -10,11 +10,7 @@ import FieldContainer from "@docspace/components/field-container";
 
 import CopyReactSvgUrl from "PUBLIC_DIR/images/copy.react.svg?url";
 
-import {
-  StyledHeaderRow,
-  StyledInputGroup,
-  StyledInputRow,
-} from "../ClientForm.styled";
+import { StyledInputGroup } from "../ClientForm.styled";
 
 interface InputGroupProps {
   label: string;

packages/client/src/pages/PortalSettings/categories/developer-tools/OAuth/sub-components/ClientForm/index.tsx

@@ -236,7 +236,8 @@ const ClientForm = ({
         form.logo &&
         (form.name !== initialClient.name ||
           form.logo !== initialClient.logo ||
-          form.description !== initialClient.description)
+          form.description !== initialClient.description ||
+          form.authentication_method !== initialClient.authenticationMethod)
       );
     }
 
@@ -413,6 +414,7 @@ const ClientForm = ({
             websiteUrlValue={form.website_url}
             descriptionValue={form.description}
             logoValue={form.logo}
+            authMethodValue={form.authentication_method}
             changeValue={onChangeForm}
             isEdit={isEdit}
             errorFields={errorFields}