fix: admin auth related fixes

admin/app/authentication/google/components/index.ts

@@ -1,2 +0,0 @@
-export * from "./root";
-export * from "./google-config-form";

admin/app/authentication/google/components/root.tsx

@@ -1,59 +0,0 @@
-"use client";
-
-import React from "react";
-import Link from "next/link";
-import { observer } from "mobx-react-lite";
-// hooks
-import { useInstance } from "@/hooks/store";
-// ui
-import { ToggleSwitch, getButtonStyling } from "@plane/ui";
-// icons
-import { Settings2 } from "lucide-react";
-// types
-import { TInstanceAuthenticationMethodKeys } from "@plane/types";
-// helpers
-import { cn } from "helpers/common.helper";
-
-type Props = {
-  disabled: boolean;
-  updateConfig: (key: TInstanceAuthenticationMethodKeys, value: string) => void;
-};
-
-export const GoogleConfiguration: React.FC<Props> = observer((props) => {
-  const { disabled, updateConfig } = props;
-  // store
-  const { formattedConfig } = useInstance();
-  // derived values
-  const enableGoogleConfig = formattedConfig?.IS_GOOGLE_ENABLED ?? "";
-  const isGoogleConfigured = !!formattedConfig?.GOOGLE_CLIENT_ID && !!formattedConfig?.GOOGLE_CLIENT_SECRET;
-
-  return (
-    <>
-      {isGoogleConfigured ? (
-        <div className="flex items-center gap-4">
-          <Link href="/authentication/google" className={cn(getButtonStyling("link-primary", "md"), "font-medium")}>
-            Edit
-          </Link>
-          <ToggleSwitch
-            value={Boolean(parseInt(enableGoogleConfig))}
-            onChange={() => {
-              Boolean(parseInt(enableGoogleConfig)) === true
-                ? updateConfig("IS_GOOGLE_ENABLED", "0")
-                : updateConfig("IS_GOOGLE_ENABLED", "1");
-            }}
-            size="sm"
-            disabled={disabled}
-          />
-        </div>
-      ) : (
-        <Link
-          href="/authentication/google"
-          className={cn(getButtonStyling("neutral-primary", "sm"), "text-custom-text-300")}
-        >
-          <Settings2 className="h-4 w-4 p-0.5 text-custom-text-300/80" />
-          Configure
-        </Link>
-      )}
-    </>
-  );
-});

admin/app/authentication/google/form.tsx

@@ -1,8 +1,9 @@
 import { FC, useState } from "react";
-import { useForm } from "react-hook-form";
+import isEmpty from "lodash/isEmpty";
 import Link from "next/link";
-// hooks
-import { useInstance } from "@/hooks/store";
+import { useForm } from "react-hook-form";
+// types
+import { IFormattedInstanceConfiguration, TInstanceGoogleAuthenticationConfigurationKeys } from "@plane/types";
 // ui
 import { Button, TOAST_TYPE, getButtonStyling, setToast } from "@plane/ui";
 // components
@@ -12,12 +13,11 @@ import {
   CopyField,
   TControllerInputFormField,
   TCopyField,
-} from "components/common";
-// types
-import { IFormattedInstanceConfiguration, TInstanceGoogleAuthenticationConfigurationKeys } from "@plane/types";
+} from "@/components/common";
 // helpers
-import { API_BASE_URL, cn } from "helpers/common.helper";
-import isEmpty from "lodash/isEmpty";
+import { API_BASE_URL, cn } from "@/helpers/common.helper";
+// hooks
+import { useInstance } from "@/hooks/store";
 
 type Props = {
   config: IFormattedInstanceConfiguration;
@@ -46,7 +46,7 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
 
   const originURL = !isEmpty(API_BASE_URL) ? API_BASE_URL : typeof window !== "undefined" ? window.location.origin : "";
 
-  const googleFormFields: TControllerInputFormField[] = [
+  const GOOGLE_FORM_FIELDS: TControllerInputFormField[] = [
     {
       key: "GOOGLE_CLIENT_ID",
       type: "text",
@@ -55,6 +55,7 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
         <>
           Your client ID lives in your Google API Console.{" "}
           <a
+            tabIndex={-1}
             href="https://developers.google.com/identity/protocols/oauth2/javascript-implicit-flow#creatingcred"
             target="_blank"
             className="text-custom-primary-100 hover:underline"
@@ -76,6 +77,7 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
         <>
           Your client secret should also be in your Google API Console.{" "}
           <a
+            tabIndex={-1}
             href="https://developers.google.com/identity/oauth2/web/guides/get-google-api-clientid"
             target="_blank"
             className="text-custom-primary-100 hover:underline"
@@ -91,7 +93,7 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
     },
   ];
 
-  const googleCopyFeilds: TCopyField[] = [
+  const GOOGLE_SERVICE_DETAILS: TCopyField[] = [
     {
       key: "Origin_URL",
       label: "Origin URL",
@@ -134,13 +136,16 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
     const payload: Partial<GoogleConfigFormValues> = { ...formData };
 
     await updateInstanceConfigurations(payload)
-      .then(() => {
+      .then((response = []) => {
         setToast({
           type: TOAST_TYPE.SUCCESS,
           title: "Success",
           message: "Google Configuration Settings updated successfully",
         });
-        reset();
+        reset({
+          GOOGLE_CLIENT_ID: response.find((item) => item.key === "GOOGLE_CLIENT_ID")?.value,
+          GOOGLE_CLIENT_SECRET: response.find((item) => item.key === "GOOGLE_CLIENT_SECRET")?.value,
+        });
       })
       .catch((err) => console.error(err));
   };
@@ -163,7 +168,7 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
         <div className="grid grid-cols-2 gap-x-12 gap-y-8 w-full">
           <div className="flex flex-col gap-y-4 col-span-2 md:col-span-1">
             <div className="pt-2 text-xl font-medium">Configuration</div>
-            {googleFormFields.map((field) => (
+            {GOOGLE_FORM_FIELDS.map((field) => (
               <ControllerInput
                 key={field.key}
                 control={control}
@@ -194,7 +199,7 @@ export const InstanceGoogleConfigForm: FC<Props> = (props) => {
           <div className="col-span-2 md:col-span-1">
             <div className="flex flex-col gap-y-4 px-6 py-4 my-2 bg-custom-background-80/60 rounded-lg">
               <div className="pt-2 text-xl font-medium">Service provider details</div>
-              {googleCopyFeilds.map((field) => (
+              {GOOGLE_SERVICE_DETAILS.map((field) => (
                 <CopyField key={field.key} label={field.label} url={field.url} description={field.description} />
               ))}
             </div>

admin/app/authentication/google/page.tsx

@@ -1,18 +1,19 @@
 "use client";
 
 import { useState } from "react";
-import Image from "next/image";
 import { observer } from "mobx-react-lite";
+import Image from "next/image";
 import useSWR from "swr";
 import { Loader, ToggleSwitch, setPromiseToast } from "@plane/ui";
 // components
 import { PageHeader } from "@/components/core";
-import { AuthenticationMethodCard } from "../components";
-import { InstanceGoogleConfigForm } from "./components";
 // hooks
 import { useInstance } from "@/hooks/store";
 // icons
 import GoogleLogo from "@/public/logos/google-logo.svg";
+// local components
+import { AuthenticationMethodCard } from "../components";
+import { InstanceGoogleConfigForm } from "./form";
 
 const InstanceGoogleAuthenticationPage = observer(() => {
   // store