diff --git a/src/api/organization.ts b/src/api/organization.ts index 7d86e933b..968cf89f6 100644 --- a/src/api/organization.ts +++ b/src/api/organization.ts @@ -270,3 +270,36 @@ export const editOrganizationUserRole = async (userId: number, roles: number[]) } } +//Create Connection + + +export const createConnection = async (orgName: string) => { + + const url = apiRoutes.connection.create + + const orgId = await getFromLocalStorage(storageKeys.ORG_ID) + + const data = { + label: orgName, + multiUseInvitation: true, + autoAcceptConnection: true, + orgId: Number(orgId) + } + const payload = data + + const axiosPayload = { + url, + payload, + config: await getHeaderConfigs() + } + + try { + return await axiosPost(axiosPayload); + } + catch (error) { + const err = error as Error + return err?.message + } +} + + diff --git a/src/components/InputCopy/index.tsx b/src/components/InputCopy/index.tsx index 755159df9..813f22d88 100644 --- a/src/components/InputCopy/index.tsx +++ b/src/components/InputCopy/index.tsx @@ -1,4 +1,4 @@ -import { useRef, useState } from 'react'; +import { ChangeEventHandler, MouseEvent, MouseEventHandler, useRef, useState } from 'react'; interface InputProps { field: { @@ -14,7 +14,8 @@ const InputCopy = ({ field, ...props }: InputProps) => { const inputRef = useRef(null); const [isCopied, setIsCopied] = useState(false); - function copyTextVal() { + function copyTextVal(event: React.MouseEvent) { + event.preventDefault() const copyText = inputRef?.current; const copiedText: string = copyText?.value as string diff --git a/src/components/organization/DedicatedIllustrate.tsx b/src/components/organization/DedicatedIllustrate.tsx index f0b75e240..f1507de21 100644 --- a/src/components/organization/DedicatedIllustrate.tsx +++ b/src/components/organization/DedicatedIllustrate.tsx @@ -1,12 +1,35 @@ import DedicatedIcon from '../../assets/dedicated.svg'; - - const DedicatedIllustrate = () => { return ( -
- dedicated +
+
+ dedicated +
+
+

+ Complete Control and Maximum Privacy +

+
    +
  • +

    + Our dedicated agent is exclusively managed by your organization, giving you full control. Customize and configure it to meet your specific needs with ease. +

    +
    • +
  • +

    + Rest assured, all data and operations stay within your organization's infrastructure, guaranteeing maximum privacy and autonomy. +

    +
    • +
  • +

    + Experience the power of complete control and privacy with our dedicated agent. +

    +
    • +
+ +
) diff --git a/src/components/organization/OrgDropDown.tsx b/src/components/organization/OrgDropDown.tsx index fef10f797..d04c5782b 100644 --- a/src/components/organization/OrgDropDown.tsx +++ b/src/components/organization/OrgDropDown.tsx @@ -82,10 +82,10 @@ const OrgDropDown = () => { ) : ( )} - {activeOrg?.name} + {activeOrg?.name} : - + Select organization } diff --git a/src/components/organization/OrganizationDetails.tsx b/src/components/organization/OrganizationDetails.tsx index f87a8b70d..a4a1cacde 100644 --- a/src/components/organization/OrganizationDetails.tsx +++ b/src/components/organization/OrganizationDetails.tsx @@ -1,88 +1,122 @@ import type { OrgAgent, Organisation } from './interfaces' +import { useEffect, useState } from 'react'; -interface Values { - seed: string; - name: string, - password: string -} - +import type { AxiosResponse } from 'axios'; +import { Spinner } from 'flowbite-react'; +import { apiStatusCodes } from '../../config/CommonConstant'; +import { createConnection } from '../../api/organization'; const OrganizationDetails = ({ orgData }: { orgData: Organisation | null }) => { const { org_agents } = orgData as Organisation const agentData: OrgAgent | null = org_agents.length > 0 ? org_agents[0] : null + const [loading, setLoading] = useState(true) + + const createQrConnection = async () => { + + setLoading(true) + const response = await createConnection(orgData?.name as string); + const { data } = response as AxiosResponse + + if (data?.statusCode === apiStatusCodes.API_STATUS_SUCCESS) { + console.log(`COnnection::`, data); + + } else { + console.log(`Connection ERR`, response as string); + + } + + setLoading(false) + } + + useEffect(() => { + createQrConnection() + }, []) return (
-

- Wallet Details -

-
-
-
    - -
  • -
    - -
    -

    - Wallet Name: -

    -

    - {agentData?.walletName} -

    - +
    +

    + Wallet Details +

    +
    +
    +
      + +
    • +
      + +
      +

      + Wallet Name: +

      +

      + {agentData?.walletName} +

      + +
      -
    -
    • -
  • -
    - -
    -

    - Org DID: -

    -

    - {agentData?.orgDid} -

    - +
    • +
  • +
    + +
    +

    + Org DID: +

    +

    + {agentData?.orgDid} +

    + +
    -
- -
  • -
    - -
    -

    - Created On: -

    -

    - {agentData?.agents_type.createDateTime.split("T")[0]} -

    - +
    • +
  • +
    + +
    +

    + Created On: +

    +

    + {agentData?.agents_type.createDateTime.split("T")[0]} +

    + +
    -
    • - - + + +
    - + +
    + { + loading + ? ( + + ) + :
    + + }
    diff --git a/src/components/organization/SharedIllustrate.tsx b/src/components/organization/SharedIllustrate.tsx index d92a08b00..81d55c926 100644 --- a/src/components/organization/SharedIllustrate.tsx +++ b/src/components/organization/SharedIllustrate.tsx @@ -1,11 +1,35 @@ import SharedIcon from '../../assets/shared.svg'; - const SharedIllustrate = () => { return ( -
    +
    +
    dedicated +
    +
    +

    + Your Hassle-Free Multi-Tenant Solution +

    +
      +
    • +

      + Our Shared Agent is here to simplify your operations! Managed by CREDEBL on your organization's behalf, this multi-tenant solution allows multiple organizations to share the same agent. You'll benefit from shared resources and reduced operational burdens. +

      +
      • +
    • +

      + Leave the agent maintenance, updates, and technical aspects to CREDEBL, so your team can focus on core tasks without worrying about the backend. Enjoy improved productivity and efficiency while we handle the nitty-gritty. +

      +
      • +
    • +

      + Experience a seamless and hassle-free future with the Shared Agent. Let CREDEBL take care of everything, while you concentrate on achieving your goals. +

      +
      • +
    + +
    ) diff --git a/src/components/organization/WalletSpinup.tsx b/src/components/organization/WalletSpinup.tsx index 20872fa50..dd14bd75b 100644 --- a/src/components/organization/WalletSpinup.tsx +++ b/src/components/organization/WalletSpinup.tsx @@ -12,11 +12,11 @@ import { spinupDedicatedAgent, spinupSharedAgent } from '../../api/organization' import { useEffect, useState } from 'react'; import type { AxiosResponse } from 'axios'; -import SOCKET from '../../config/SocketConfig'; -import { nanoid } from 'nanoid' -import InputCopy from '../InputCopy'; import DedicatedIllustrate from './DedicatedIllustrate'; +import InputCopy from '../InputCopy'; +import SOCKET from '../../config/SocketConfig'; import SharedIllustrate from './SharedIllustrate'; +import { nanoid } from 'nanoid' interface Values { seed: string; @@ -96,6 +96,7 @@ const WalletSpinup = ( const submitSharedWallet = async (values: ValuesShared) => { + setLoading(true) const orgId = await getFromLocalStorage(storageKeys.ORG_ID) const payload = { @@ -103,7 +104,6 @@ const WalletSpinup = ( seed: seeds, orgId: Number(orgId) } - setLoading(true) const spinupRes = await spinupSharedAgent(payload) const { data } = spinupRes as AxiosResponse @@ -253,7 +253,7 @@ const WalletSpinup = ( @@ -323,7 +323,7 @@ const WalletSpinup = ( @@ -366,8 +366,7 @@ const WalletSpinup = (
    { - !agentSpinupCall - &&
    + !agentSpinupCall && !loading &&
    • diff --git a/src/config/apiRoutes.ts b/src/config/apiRoutes.ts index f83850bac..0e8affcaa 100644 --- a/src/config/apiRoutes.ts +++ b/src/config/apiRoutes.ts @@ -23,6 +23,9 @@ export const apiRoutes = { orgRoles: '/organization/roles', editUserROle: '/organization/user-roles' }, + connection: { + create: '/connections', + }, schema: { create: '/schemas', getAll: '/schemas',