Skip to content

Commit

Permalink
fixed: radio selection after agent spinup & included agent illustrati…
Browse files Browse the repository at this point in the history 
…on description

Signed-off-by: @nishad.shirsat <[email protected]>
  • Loading branch information
@nishad-ayanworks
nishad-ayanworks committed Aug 2, 2023
1 parent 9776f17 commit cd150f7
Show file tree
Hide file tree
Showing 9 changed files with 225 additions and 87 deletions.
21 changes: 21 additions & 0 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

33 changes: 33 additions & 0 deletions src/api/organization.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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
}
}


5 changes: 3 additions & 2 deletions src/components/InputCopy/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useRef, useState } from 'react';
import { ChangeEventHandler, MouseEvent, MouseEventHandler, useRef, useState } from 'react';

interface InputProps {
field: {
Expand All @@ -14,7 +14,8 @@ const InputCopy = ({ field, ...props }: InputProps) => {
const inputRef = useRef<HTMLInputElement>(null);
const [isCopied, setIsCopied] = useState(false);

function copyTextVal() {
function copyTextVal(event: React.MouseEvent<HTMLButtonElement>) {
event.preventDefault()
const copyText = inputRef?.current;

const copiedText: string = copyText?.value as string
Expand Down
31 changes: 27 additions & 4 deletions src/components/organization/DedicatedIllustrate.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,35 @@
import DedicatedIcon from '../../assets/dedicated.svg';



const DedicatedIllustrate = () => {

return (
<div className='mt-4 ml-4'>
<img src={DedicatedIcon} alt="dedicated" width={270} />
<div className='mt-4 flex flex-row flex-wrap'>
<div>
<img src={DedicatedIcon} alt="dedicated" width={270} />
</div>
<div className='ml-8 max-w-xs'>
<h3 className="mb-2 text-xl font-bold text-gray-900 dark:text-white">
Complete Control and Maximum Privacy
</h3>
<ul className="list-disc">
<li>
<p className='mb-1 text-base font-normal text-gray-900 dark:text-white'>
Our dedicated agent is exclusively managed by your organization, giving you full control. Customize and configure it to meet your specific needs with ease.
</p>
</li>
<li>
<p className='mb-1 text-base font-normal text-gray-900 dark:text-white'>
Rest assured, all data and operations stay within your organization's infrastructure, guaranteeing maximum privacy and autonomy.
</p>
</li>
<li>
<p className='mb-1 text-base font-normal text-gray-900 dark:text-white'>
Experience the power of complete control and privacy with our dedicated agent.
</p>
</li>
</ul>

</div>
</div>
)

Expand Down
4 changes: 2 additions & 2 deletions src/components/organization/OrgDropDown.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,10 +82,10 @@ const OrgDropDown = () => {
) : (
<CustomAvatar size="20" name={activeOrg?.name} round />
)}
<text className="ml-2 dark: text-white">{activeOrg?.name}</text>
<text className="ml-2 text-white dark:text-white">{activeOrg?.name}</text>
</>
:
<text className='dark:text-white'>
<text className='text-white dark:text-white'>
Select organization
</text>
}
Expand Down
172 changes: 103 additions & 69 deletions src/components/organization/OrganizationDetails.tsx
View file
Original file line number Diff line number Diff line change
@@ -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<boolean>(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 (
<div
className="mt-4 flex-col p-4 bg-white border border-gray-200 rounded-lg shadow-sm sm:flex dark:border-gray-700 sm:p-6 dark:bg-gray-800"
className="mt-4 w-full flex-wrap p-4 bg-white border border-gray-200 rounded-lg shadow-sm sm:flex dark:border-gray-700 sm:p-6 dark:bg-gray-800"
>
<h3 className="mb-1 mt-1 text-xl font-bold text-gray-900 dark:text-white">
Wallet Details
</h3>
<div
className="items-center sm:flex xl:block 2xl:flex sm:space-x-4 xl:space-x-0 2xl:space-x-4"
>
<div>
<ul className="divide-y divide-gray-200 dark:divide-gray-700">

<li className="py-4">
<div className="flex items-center space-x-4">

<div className="inline-flex min-w-0">
<p
className="text-base font-normal text-gray-500 truncate dark:text-gray-400"
>
Wallet Name:
</p>
<p
className="ml-4 text-base font-semibold text-gray-900 truncate dark:text-white"
>
{agentData?.walletName}
</p>

<div className='w-1/2'>
<h3 className="mb-1 mt-1 text-xl font-bold text-gray-900 dark:text-white">
Wallet Details
</h3>
<div
className="items-center sm:flex xl:block 2xl:flex sm:space-x-4 xl:space-x-0 2xl:space-x-4"
>
<div>
<ul className="divide-y divide-gray-200 dark:divide-gray-700">

<li className="py-4">
<div className="flex items-center space-x-4">

<div className="inline-flex min-w-0">
<p
className="text-base font-normal text-gray-500 truncate dark:text-gray-400"
>
Wallet Name:
</p>
<p
className="ml-4 text-base font-semibold text-gray-900 truncate dark:text-white"
>
{agentData?.walletName}
</p>

</div>
</div>
</div>
</li>
<li className="py-4">
<div className="flex items-center space-x-4">

<div className="inline-flex min-w-0">
<p
className="text-base font-normal text-gray-500 truncate dark:text-gray-400"
>
Org DID:
</p>
<p
className="ml-4 text-base font-semibold text-gray-900 truncate dark:text-white"
>
{agentData?.orgDid}
</p>

</li>
<li className="py-4">
<div className="flex items-center space-x-4">

<div className="inline-flex min-w-0">
<p
className="text-base font-normal text-gray-500 truncate dark:text-gray-400"
>
Org DID:
</p>
<p
className="ml-4 text-base font-semibold text-gray-900 truncate dark:text-white"
>
{agentData?.orgDid}
</p>

</div>
</div>
</div>
</li>
<li className="py-4">
<div className="flex items-center space-x-4">

<div className="inline-flex min-w-0">
<p
className="text-base font-normal text-gray-500 truncate dark:text-gray-400"
>
Created On:
</p>
<p
className="ml-4 text-base font-semibold text-gray-900 truncate dark:text-white"
>
{agentData?.agents_type.createDateTime.split("T")[0]}
</p>

</li>
<li className="py-4">
<div className="flex items-center space-x-4">

<div className="inline-flex min-w-0">
<p
className="text-base font-normal text-gray-500 truncate dark:text-gray-400"
>
Created On:
</p>
<p
className="ml-4 text-base font-semibold text-gray-900 truncate dark:text-white"
>
{agentData?.agents_type.createDateTime.split("T")[0]}
</p>

</div>
</div>
</div>
</li>
</ul>
</li>
</ul>

</div>
</div>

</div>
<div className='w-1/2 flex items-center'>
{
loading
? (
<Spinner
color="info"
/>
)
: <div></div>

}
</div>

</div>
Expand Down
28 changes: 26 additions & 2 deletions src/components/organization/SharedIllustrate.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,35 @@
import SharedIcon from '../../assets/shared.svg';


const SharedIllustrate = () => {

return (
<div className='mt-4 ml-4'>
<div className='mt-4 flex flex-row flex-wrap'>
<div>
<img src={SharedIcon} alt="dedicated" width={270} />
</div>
<div className='ml-8 max-w-xs'>
<h3 className="mb-2 text-xl font-bold text-gray-900 dark:text-white">
Your Hassle-Free Multi-Tenant Solution
</h3>
<ul className="list-disc">
<li>
<p className='mb-1 text-base font-normal text-gray-900 dark:text-white'>
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.
</p>
</li>
<li>
<p className='mb-1 text-base font-normal text-gray-900 dark:text-white'>
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.
</p>
</li>
<li>
<p className='mb-1 text-base font-normal text-gray-900 dark:text-white'>
Experience a seamless and hassle-free future with the Shared Agent. Let CREDEBL take care of everything, while you concentrate on achieving your goals.
</p>
</li>
</ul>

</div>
</div>
)

Expand Down
Loading

0 comments on commit cd150f7

Please sign in to comment.