Merge pull request #593 from credebl/develop

merge DEV to the QA branch
credebl · Feb 23, 2024 · 1d42778 · 1d42778
2 parents 63eb9eb + fab3f2c
commit 1d42778
Show file tree

Hide file tree

Showing 23 changed files with 1,131 additions and 809 deletions.
diff --git a/src/common/global.css b/src/common/global.css
@@ -135,7 +135,7 @@ ul.timelinestatic {
 	@apply dark:!text-white !text-primary-700 w-fit;
 }
 
-.email-bulk-issuance .select__single-value{
+.email-bulk-issuance .select__single-value {
 	width: calc(100% - 15px) !important;
 }
 
@@ -169,17 +169,20 @@ ul.timelinestatic {
 	@apply dark:bg-gray-900;
 }
 
- .search-dropdown .select__control .select__value-container .select__input-container {
-  width: 1px;
- }
-
- .custom-card:hover {
-  background-color: #1d4ed8;
+.search-dropdown
+	.select__control
+	.select__value-container
+	.select__input-container {
+	width: 1px;
+}
+
+.custom-card:hover {
+	background-color: #1d4ed8;
 }
 
 .custom-card:hover h5,
 .custom-card:hover p {
-  color: white;
+	color: white;
 }
 .search-dropdown
 	.select__control
@@ -188,6 +191,22 @@ ul.timelinestatic {
 	width: 1px;
 }
 
-.email-bulk-issuance .select__single-value{
-	width: calc(100% - 15px) !important;
+.w-view-cred-def-id {
+	width: calc(100% - 1.5rem);
 }
+
+.w-view-schema-id {
+    width: calc(100% - 5.1rem);
+}
+
+.issuance .w-cred-id {
+    width: calc(100% - 10.5rem);
+}
+
+.w-schema-id {
+    width: calc(100% - 5.8rem);
+}
+
+.w-issuer-id {
+    width: calc(100% - 5.6rem);
+}
diff --git a/src/commonComponents/CopyDid.tsx b/src/commonComponents/CopyDid.tsx
@@ -8,8 +8,8 @@ interface IProps {
 const CopyDid = ({ value, className }: IProps) => {
     const [copied, setCopied] = useState(false)
     function copyTextVal(e: React.MouseEvent<HTMLButtonElement>) {
-
         e.preventDefault()
+        e.stopPropagation();
 
         setCopied(true);
 
@@ -24,16 +24,16 @@ const CopyDid = ({ value, className }: IProps) => {
     }
     return (
         <>
-            <div className={className}>
+            <span title={value} className={className}>
                 {value}
-            </div>
+            </span>
             <button
                 className="shrink-0"
                 onClick={e => !copied && copyTextVal(e)}
             >
                 {copied
                     ? <svg className="h-6 w-6 text-white ml-3 text-base" width="25" height="25" viewBox="0 0 24 24" strokeWidth={2} stroke="green" fill="none" strokeLinecap="round" strokeLinejoin="round">  <path stroke="none" d="M0 0h24v24H0z" />  <path d="M5 12l5 5l10 -10" /></svg>
-                    : <svg className="h-6 w-6 text-black dark:text-white ml-3 text-base" width="25" height="25" viewBox="0 0 24 24" strokeWidth={2} stroke="currentColor" fill="none" strokeLinecap="round" strokeLinejoin="round">  <path stroke="none" d="M0 0h24v24H0z" />  <rect x="8" y="8" width="12" height="12" rx="2" />  <path d="M16 8v-2a2 2 0 0 0 -2 -2h-8a2 2 0 0 0 -2 2v8a2 2 0 0 0 2 2h2" /></svg>
+                    : <svg className="h-6 w-6 text-black dark:text-white ml-2 text-base" width="25" height="25" viewBox="0 0 24 24" strokeWidth={2} stroke="currentColor" fill="none" strokeLinecap="round" strokeLinejoin="round">  <path stroke="none" d="M0 0h24v24H0z" />  <rect x="8" y="8" width="12" height="12" rx="2" />  <path d="M16 8v-2a2 2 0 0 0 -2 -2h-8a2 2 0 0 0 -2 2v8a2 2 0 0 0 2 2h2" /></svg>
                 }
             </button>
         </>

diff --git a/src/commonComponents/CredentialDefinitionCard.tsx b/src/commonComponents/CredentialDefinitionCard.tsx
@@ -1,6 +1,7 @@
 import { Button, Card } from 'flowbite-react';
 
 import { Roles } from '../utils/enums/roles';
+import CopyDid from './CopyDid';
 
 interface IProps {
   credDeffName: string,
@@ -23,64 +24,66 @@ const CredDeffCard = (props: IProps) => {
   }
 
   return (
-    <Card onClick={redirectToIssuance} className='cursor-pointer overflow-hidden overflow-ellipsis h-full' style={{ maxHeight: '100%', maxWidth: '100%', overflow: 'auto' }}>
+    <Card className='overflow-hidden overflow-ellipsis h-full' style={{ maxHeight: '100%', maxWidth: '100%', overflow: 'auto' }}>
       <div className="mb-1 flex items-center justify-between flex-wrap">
         <div className="min-w-[6rem] max-w-100/8rem"> {/* This will take up 2/3 of the available width on larger screens */}
           <h5 className="text-xl font-bold leading-none text-gray-900 dark:text-white break-words truncate line-clamp-2 max-h-[40px] whitespace-normal" style={{ display: "-webkit-box" }}>
             {props.credDeffName}
           </h5>
         </div>
-        {
-          props.userRoles
-          && (props.userRoles.includes(Roles.OWNER)
-            || props.userRoles.includes(Roles.ADMIN)
-            || props.userRoles.includes(Roles.ISSUER)
-          )
-          && <div className="p-2">
-            <Button
-              type="submit"
-              color='bg-primary-800'
-              title='Initiate Credential Issuance'
-              className='bg-secondary-700 ring-primary-700 bg-white-700 hover:bg-secondary-700 
+        <div className="p-2">
+          <Button
+            onClick={redirectToIssuance}
+            type="submit"
+            color='bg-primary-800'
+            title='Initiate Credential Issuance'
+            className='bg-secondary-700 ring-primary-700 bg-white-700 hover:bg-secondary-700 
 						ring-2 text-black font-medium rounded-lg text-sm mr-2 ml-auto dark:text-white dark:hover:text-black 
 						dark:hover:bg-primary-50'
-              style={{ height: '1.5rem', width: '100%', minWidth: '2rem' }}
-            >
-              <div className='mr-2'>
-                <svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="none" viewBox="0 0 23 23">  <path fill="#1F4EAD" fill-rule="evenodd" d="M21 21H2V2h9.5V0H2.556A2.563 2.563 0 0 0 0 2.556v17.888A2.563 2.563 0 0 0 2.556 23h17.888A2.563 2.563 0 0 0 23 20.444V11.5h-2V21ZM14.056 0v2H19.5l-13 13 1 1.5L21 3v5.944h2V0h-8.944Z" clip-rule="evenodd" />
-                </svg>
-              </div>
+            style={{ height: '1.5rem', width: '100%', minWidth: '2rem' }}
+            disabled={!(props.userRoles
+              && (props.userRoles.includes(Roles.OWNER)
+                || props.userRoles.includes(Roles.ADMIN)
+                || props.userRoles.includes(Roles.ISSUER)))}
+          >
+            <div className='mr-2'>
+              <svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="none" viewBox="0 0 23 23">  <path fill="#1F4EAD" fill-rule="evenodd" d="M21 21H2V2h9.5V0H2.556A2.563 2.563 0 0 0 0 2.556v17.888A2.563 2.563 0 0 0 2.556 23h17.888A2.563 2.563 0 0 0 23 20.444V11.5h-2V21ZM14.056 0v2H19.5l-13 13 1 1.5L21 3v5.944h2V0h-8.944Z" clip-rule="evenodd" />
+              </svg>
+            </div>
+
+            Issue
+          </Button>
+        </div>
 
-              Issue
-            </Button>
-          </div>
-        }
 
       </div>
       <div className="min-w-0 flex-1 flex flex-col">
-        <p className="truncate text-sm font-medium text-gray-900 dark:text-white">
-          ID : {props.credentialDefinitionId}
+        <p className="truncate text-sm font-medium text-gray-900 dark:text-white flex">
+          <span className='font-semibold mr-2'>
+            ID:
+          </span>
+          <span className='flex w-view-cred-def-id'>
+            <CopyDid value={props?.credentialDefinitionId || ""} className='truncate font-courier' />
+          </span>
         </p>
-        <p className="truncate text-sm font-medium text-gray-900 dark:text-white pt-2 pb-1">
-          Schema ID:{props.schemaId}
+        <p className="truncate text-sm font-medium text-gray-900 dark:text-white flex pt-2 pb-1">
+          <span className='font-semibold mr-2'>
+            Schema ID:
+          </span>
+          <div className='flex w-view-schema-id'>
+            <CopyDid value={props?.schemaId || ""} className='truncate font-courier' />
+          </div>
         </p>
         <div className="mt-auto inline-flex items-center text-base font-semibold text-gray-900 dark:text-white overflow-hidden overflow-ellipsis">
           Revocable:
-          <>
-            <span
-              key={''}
-              className="m-1 bg-blue-100 text-blue-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
-            >
-              {props.revocable ? 'Yes' : 'No'}
-            </span>
-
-          </>
-
+          <span
+            key={''}
+            className="m-1 bg-blue-100 text-blue-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300"
+          >
+            {props?.revocable ? 'Yes' : 'No'}
+          </span>
         </div>
-
       </div>
-
-
     </Card>
   )
 }

diff --git a/src/commonComponents/PasseyAddDevicePopup.tsx b/src/commonComponents/PasseyAddDevicePopup.tsx
@@ -37,11 +37,13 @@ const PasskeyAddDevice = (props: {
 					const { data } = passkeyUserDetailsResp as AxiosResponse
 					if (data?.statusCode === apiStatusCodes.API_STATUS_SUCCESS) {
 						setNextFlag(true)
-					} else {
-						setFidoUserError(passkeyUserDetailsResp as string)
-					}
+					} else if (passkeyUserDetailsResp.toString().includes('401')) {
+						setFidoUserError('Invalid Credentials');
+				} else {
+						setFidoUserError(passkeyUserDetailsResp as string);
+				}
 		} catch (error) {
-			console.error('An unexpected error occurred:', error.message);
+			console.error('An unexpected error occurred:', error);
 			setFidoUserError('An unexpected error occurred')
 		}
 	};
@@ -65,11 +67,7 @@ const PasskeyAddDevice = (props: {
 								}
 								}
 							>
-								<span>
-									<p>
 										{success || fidoUserError}
-									</p>
-								</span>
 							</Alert>
 						</div>
 					}

diff --git a/src/commonComponents/SchemaCard.tsx b/src/commonComponents/SchemaCard.tsx
@@ -1,6 +1,7 @@
 import { Card } from 'flowbite-react';
 import { dateConversion } from '../utils/DateConversion';
 import DateTooltip from '../components/Tooltip';
+import CopyDid from './CopyDid';
 
 interface IProps {
   className?: string,
@@ -22,8 +23,8 @@ const SchemaCard = (props: IProps) => {
     <Card onClick={() => {
       props.onClickCallback(props.schemaId, props.attributes, props.issuerDid, props.created)
     }}
-    id="schema-cards" 
-    className={`transform transition duration-500 ${props.isClickable !== false ? "hover:scale-105" : "hover:!cursor-default"} hover:bg-gray-50 cursor-pointer h-full w-full overflow-hidden`}>
+      id="schema-cards"
+      className={`transform transition duration-500 ${props.isClickable !== false ? "hover:scale-105 hover:bg-gray-50 cursor-pointer" : "hover:!cursor-default"} h-full w-full overflow-hidden`}>
       <div className="flex justify-between items-baseline">
         <div className='min-w-[8rem] max-w-100/10rem'>
           <h5 className="text-xl font-bold leading-[1.1] text-gray-900 dark:text-white break-words truncate line-clamp-2 max-h-[43px] whitespace-normal" style={{ display: "-webkit-box" }}>
@@ -41,14 +42,20 @@ const SchemaCard = (props: IProps) => {
         </div>
       </div>
       <div className="min-w-0 flex-1">
-        <p className="truncate text-sm font-regular text-gray-900 dark:text-white pb-2">
-          <span className="font-semibold">Schema ID:</span> {props.schemaId}
+        <p className="truncate dark:text-white break-all flex">
+          <span className="font-semibold mr-2">Schema ID: </span>
+          <span className='flex w-schema-id'>
+            <CopyDid value={props?.schemaId || ""} className='truncate font-courier mt-[2px]' />
+          </span>
         </p>
-        <p className="truncate text-sm font-regular text-gray-900 dark:text-white pb-2">
-          <span className="font-semibold">Issuer DID:</span> {props.issuerDid}
+        <p className="truncate dark:text-white break-all flex">
+          <span className="font-semibold mr-2">Issuer DID: </span>
+          <span className='flex w-issuer-id'>
+           <CopyDid value={props.issuerDid || ""} className='truncate font-courier mt-[2px]' />
+          </span>
         </p>
-        <p className="truncate text-sm font-regular text-gray-900 dark:text-white">
-          <span className="font-semibold">Ledger:</span> {props.issuerDid.split(":")[2]}
+        <p className="truncate dark:text-white break-all flex">
+          <span className="font-semibold mr-2">Ledger:</span> {props?.issuerDid?.split(":")[2]}
         </p>
       </div>
 

diff --git a/src/commonComponents/SummaryCard.tsx b/src/commonComponents/SummaryCard.tsx
@@ -0,0 +1,57 @@
+import React from 'react';
+import { Card } from 'flowbite-react';
+import CopyDid from '../commonComponents/CopyDid';
+
+interface IProps {
+    schemaName: string;
+    version: string;
+    credDefId: string;
+    schemaId: string;
+    hideCredDefId: boolean;
+}
+
+const SummaryCard = ({ schemaName, version, credDefId, schemaId, hideCredDefId }: Readonly<IProps>) => {
+    return (
+        <div className='grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3'>
+            <Card>
+                <div className="flex justify-between items-start">
+                    <div>
+                        <h5 className="text-xl font-bold leading-none dark:text-white">
+                            {schemaName}
+                        </h5>
+                        <p className="dark:text-white">
+                            Version: {version}
+                        </p>
+                    </div>
+                </div>
+                <div className="min-w-0 flex-1 issuance">
+                    <p className="truncate dark:text-white break-all flex">
+                        <span className="font-semibold mr-2">Schema ID: </span>
+                        <span className='flex w-schema-id'>
+                            <CopyDid value={schemaId || ""} className='truncate font-courier mt-[2px]' />
+                        </span>
+                    </p>
+                    {
+                        hideCredDefId ?
+                            <p className="truncate dark:text-white break-all flex">
+                                <span className="font-semibold mr-2">Credential definition restriction: </span>
+                                <span className='flex'>
+                                    {credDefId ? ' Yes' : ' No'}
+                                </span>
+                            </p>
+                            :
+                            <p className="truncate dark:text-white break-all flex">
+                                <span className="font-semibold mr-2">Credential Definition: </span>
+                                <span className='flex w-cred-id'>
+                                    <CopyDid value={credDefId || ""} className='truncate font-courier mt-[2px]' />
+                                </span>
+                            </p>
+
+                    }
+                </div>
+            </Card>
+        </div>
+    )
+}
+
+export default SummaryCard
diff --git a/src/components/Authentication/SignInUserPassword.tsx b/src/components/Authentication/SignInUserPassword.tsx
@@ -109,7 +109,7 @@ const SignInUserPassword = (signInUserProps: SignInUser3Props) => {
 		} else {
 			setLoading(false);
 			if (loginRsp.toString().includes('401')) {
-				setFailure('Invalid Credntials');
+				 setFailure('Invalid Credentials');
 			} else {
 				setFailure(loginRsp as string);
 			}

diff --git a/src/components/Ecosystem/Endorsement/EndorsementPopup.tsx b/src/components/Ecosystem/Endorsement/EndorsementPopup.tsx
@@ -32,7 +32,7 @@ const EndorsementPopup = (props: {
 			setIsEcosystemData(data);
 		};
 		checkEcosystemData();
-	}, []);
+	}, [props?.openModal]);
 
 	useEffect(() => {
 		props.setMessage("");

diff --git a/src/components/Issuance/CredDefSelection.tsx b/src/components/Issuance/CredDefSelection.tsx
@@ -153,9 +153,9 @@ const CredDefSelection = () => {
 						<CustomSpinner />
 					</div>
 				) : (
-					<div className="m-1 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap4">
+					<div className="m-1 grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-4">
 						<SchemaCard
-							className="col-span-1 sm:col-span-2 md:col-span-1"
+							className="col-span-1 lg:col-span-2 xl:col-span-1"
 							schemaName={schemaState?.schemaName}
 							version={schemaState?.version}
 							schemaId={schemaDetailsState.schemaId}