From 757c5827170364f5205d8a8f4a780ffb629c406a Mon Sep 17 00:00:00 2001
From: "@nishad.shirsat" <nishad.shirsat@ayanworks.com>
Date: Tue, 29 Aug 2023 15:27:56 +0530
Subject: [PATCH 1/2] Alignment fix on wallet spinup and applied css on dark
 mode

Signed-off-by: @nishad.shirsat <nishad.shirsat@ayanworks.com>
---
 src/commonComponents/QRcode.tsx               |  2 +-
 .../organization/DedicatedIllustrate.tsx      |  4 ++--
 .../organization/SharedIllustrate.tsx         |  4 ++--
 src/components/organization/WalletSpinup.tsx  | 19 ++++++++++---------
 4 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/commonComponents/QRcode.tsx b/src/commonComponents/QRcode.tsx
index 507f9f2e7..cc2825ac2 100644
--- a/src/commonComponents/QRcode.tsx
+++ b/src/commonComponents/QRcode.tsx
@@ -49,7 +49,7 @@ const CustomQRCode = ({ value, size }: { value: string, size: number }) => {
 		</div>
 		{/* <p className="text-center mt-3">OR</p> */}
 		{/* <p className="text-center mt-3 ">Invitation URL</p> */}
-		<div className="flex items-center text-center mt-3">
+		<div className="flex items-center text-center mt-3 dark:text-white">
 			<p className="md center"></p>  
 			<button
 			onClick={drawHtmlToCanvas}
diff --git a/src/components/organization/DedicatedIllustrate.tsx b/src/components/organization/DedicatedIllustrate.tsx
index f1507de21..3686b3e4d 100644
--- a/src/components/organization/DedicatedIllustrate.tsx
+++ b/src/components/organization/DedicatedIllustrate.tsx
@@ -3,9 +3,9 @@ import DedicatedIcon from '../../assets/dedicated.svg';
 const DedicatedIllustrate = () => {
 
     return (
-        <div className='mt-4 flex flex-row flex-wrap'>
+        <div className='mt-4 flex flex-row justify-center flex-wrap'>
             <div>
-                <img src={DedicatedIcon} alt="dedicated" width={270} />
+                <img src={DedicatedIcon} alt="dedicated" width={220} />
             </div>
             <div className='ml-8 max-w-xs'>
                 <h3 className="mb-2 text-xl font-bold text-gray-900 dark:text-white">
diff --git a/src/components/organization/SharedIllustrate.tsx b/src/components/organization/SharedIllustrate.tsx
index 81d55c926..55881c3b5 100644
--- a/src/components/organization/SharedIllustrate.tsx
+++ b/src/components/organization/SharedIllustrate.tsx
@@ -3,9 +3,9 @@ import SharedIcon from '../../assets/shared.svg';
 const SharedIllustrate = () => {
 
     return (
-         <div className='mt-4 flex flex-row flex-wrap'>
+         <div className='mt-4 flex flex-row justify-center flex-wrap'>
             <div>
-            <img src={SharedIcon} alt="dedicated" width={270} />
+            <img src={SharedIcon} alt="dedicated" width={220} />
             </div>
             <div className='ml-8 max-w-xs'>
                 <h3 className="mb-2 text-xl font-bold text-gray-900 dark:text-white">
diff --git a/src/components/organization/WalletSpinup.tsx b/src/components/organization/WalletSpinup.tsx
index 5410397d5..33758b7cb 100644
--- a/src/components/organization/WalletSpinup.tsx
+++ b/src/components/organization/WalletSpinup.tsx
@@ -275,7 +275,7 @@ const WalletSpinup = (props: {
 				label: '',
 			}}
 			validationSchema={yup.object().shape({
-				label: yup.string().required('Wallet label is required').trim().test('no-spaces', 'Spaces are not allowed Wallet label', value => !value || !value.includes(' ')),
+				label: yup.string().required('Wallet label is required').trim().test('no-spaces', 'Spaces are not allowed', value => !value || !value.includes(' ')),
 			})}
 			validateOnBlur
 			validateOnChange
@@ -359,8 +359,8 @@ const WalletSpinup = (props: {
 				</div>
 			</div>
 
-			<div className="grid w-full grid-cols-1 md:grid-cols-2 gap-4 mt-0 mb-4 xl:grid-cols-2 2xl:grid-cols-2">
-				<div>
+			<div className="grid w-full grid-cols-1 md:grid-cols-2 gap-4 mt-0 mb-4 xl:grid-cols-3 2xl:grid-cols-3">
+				<div className='col-span-1'>
 					{!agentSpinupCall && !loading && (
 						<div className="mt-4 flex max-w-lg flex-col gap-4">
 							<ul className="items-center w-full text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-lg sm:flex dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@@ -408,18 +408,19 @@ const WalletSpinup = (props: {
 							<DedicatedAgentForm />
 						)
 					) : (
-						// : agentType === AgentType.DEDICATED
 						<WalletSteps
 							steps={walletSpinStep}
 							agentSpinupCall={agentSpinupCall}
 						/>
 					)}
 				</div>
-				{agentType === AgentType.DEDICATED ? (
-					<DedicatedIllustrate />
-				) : (
-					<SharedIllustrate />
-				)}
+				<div className='col-span-2'>
+					{agentType === AgentType.DEDICATED ? (
+						<DedicatedIllustrate />
+					) : (
+						<SharedIllustrate />
+					)}
+				</div>
 			</div>
 		</div>
 	);

From d8c96936f790b0b0d84a8151ca531fb43ee98ff8 Mon Sep 17 00:00:00 2001
From: "@nishad.shirsat" <nishad.shirsat@ayanworks.com>
Date: Tue, 29 Aug 2023 15:57:52 +0530
Subject: [PATCH 2/2] Fixed side nav css & disable dedicated agent

Signed-off-by: @nishad.shirsat <nishad.shirsat@ayanworks.com>
---
 src/app/SideBar.astro                        | 24 ++++++++++++--------
 src/components/Issuance/IssuedCrdentials.tsx |  2 +-
 src/components/organization/WalletSpinup.tsx | 13 ++++++++---
 3 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/src/app/SideBar.astro b/src/app/SideBar.astro
index 2d2e73aa3..d0677afda 100644
--- a/src/app/SideBar.astro
+++ b/src/app/SideBar.astro
@@ -60,14 +60,15 @@ import { pathRoutes } from "../config/pathRoutes";
 					<li>
 						<a
 							href={pathRoutes.users.dashboard}
-							class="flex items-center p-2 text-base text-gray-900 rounded-lg hover:bg-gray-100 group dark:text-gray-200 dark:hover:bg-gray-700"
+						class="flex items-center p-2 text-base text-gray-900 transition duration-75 rounded-lg hover:bg-gray-100 group dark:text-gray-200 dark:hover:bg-gray-700"
 						>
 						<svg 
 						xmlns="http://www.w3.org/2000/svg" 
+						class="flex-shrink-0 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white"
 						width="17" height="17" 
 						fill="none" 
 						viewBox="0 0 25 25">  
-						<path fill="#6B7280" 
+						<path fill="currentColor" 
 						d="M16.28 25c1.566 0 2.91-.082 4.033-.332 1.138-.253 2.124-.693 2.893-1.462.769-.77 1.21-1.755 1.462-2.893.25-1.123.332-2.467.332-4.033V12.5a2.5 2.5 0 0 0-2.5-2.5h-10a2.5 2.5 0 0 0-2.5 2.5v10a2.5 2.5 0 0 0 2.5 2.5h3.78ZM0 16.28c0 1.566.082 2.91.332 4.033.253 1.138.693 2.124 1.462 2.893.77.769 1.755 1.21 2.892 1.462.11.024.219.047.329.068 1.355.262 2.485-.885 2.485-2.266V12.5A2.5 2.5 0 0 0 5 10H2.5A2.5 2.5 0 0 0 0 12.5v3.78ZM8.72 0C7.153 0 5.81.082 4.686.332c-1.137.253-2.123.693-2.892 1.462-.77.77-1.21 1.755-1.462 2.892l-.06.281C.006 6.341 1.174 7.5 2.573 7.5H22.47c1.38 0 2.528-1.13 2.266-2.485a11.98 11.98 0 0 0-.068-.329c-.253-1.137-.694-2.123-1.463-2.892-.769-.769-1.755-1.21-2.892-1.462C19.19.082 17.846 0 16.279 0H8.72Z"
 						/></svg>
 							<span class="ml-3" sidebar-toggle-item>Dashboard</span>
@@ -81,11 +82,12 @@ import { pathRoutes } from "../config/pathRoutes";
 							class="flex items-center p-2 text-base text-gray-900 rounded-lg hover:bg-gray-100 group dark:text-gray-200 dark:hover:bg-gray-700"
 						>
 							<svg xmlns="http://www.w3.org/2000/svg" 
+							class="flex-shrink-0 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white"
 							width="17" 
 							height="17" 
 							fill="none" 
 							viewBox="0 0 25 25">  
-							<path fill="#6B7280" 
+							<path fill="currentColor" 
 							d="M19.898 14.073h3.54c.854 0 1.562.707 1.562 1.561v7.805c0 .854-.708 1.561-1.563 1.561h-7.812a1.572 1.572 0 0 1-1.563-1.561v-7.805c0-.854.708-1.56 1.563-1.56h2.759v-.928H6.59v.927h2.784c.855 0 1.563.707 1.563 1.561v7.805c0 .854-.708 1.561-1.563 1.561H1.562A1.572 1.572 0 0 1 0 23.439v-7.805c0-.854.708-1.56 1.563-1.56h3.515V12.61c0-.537.684-.805 1.294-.805h5.371v-.878h-3.37a1.572 1.572 0 0 1-1.562-1.561V1.56A1.572 1.572 0 0 1 8.373 0h7.813c.855 0 1.562.707 1.562 1.561v7.805a1.57 1.57 0 0 1-1.562 1.56h-2.881v.903c2.026 0 3.272-.024 5.297-.024.61 0 1.294.244 1.294.805v1.463h.002Z"
 							/></svg>
 							<span class="ml-3" sidebar-toggle-item>Organizations</span>
@@ -98,21 +100,22 @@ import { pathRoutes } from "../config/pathRoutes";
 							class="flex items-center p-2 text-base text-gray-900 rounded-lg hover:bg-gray-100 group dark:text-gray-200 dark:hover:bg-gray-700"
 						>
 						<svg xmlns="http://www.w3.org/2000/svg" 
+						class="flex-shrink-0 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white"
 						width="18" 
 						height="17" 
 						fill="none" 
 						viewBox="0 0 28 28">  
-						<path fill="#6B7280" 
+						<path fill="currentColor" 
 						fill-rule="evenodd" 
 						d="M4.4 6.8a6.8 6.8 0 1 1 14.399 0 6.8 6.8 0 0 1-14.4 0Z" 
 						clip-rule="evenodd"/>  
-						<path fill="#6B7280" 
+						<path fill="currentColor" 
 						d="M18.78 11.303a.316.316 0 0 0 .084.402 5.6 5.6 0 1 0 0-9.008.316.316 0 0 0-.083.403 8.76 8.76 0 0 1 1.012 4.102 8.76 8.76 0 0 1-1.012 4.1Z"/>  
-						<path fill="#6B7280" 
+						<path fill="currentColor" 
 						fill-rule="evenodd" 
 						d="M4.216 17.119C6.187 16.263 8.775 16 11.99 16c3.218 0 5.807.264 7.78 1.121 2.148.934 3.454 2.526 4.138 4.773A1.631 1.631 0 0 1 22.348 24H1.635a1.633 1.633 0 0 1-1.563-2.11c.686-2.247 1.994-3.838 4.144-4.771Z" 
 						clip-rule="evenodd"/>  
-						<path fill="#6B7280"
+						<path fill="currentColor"
 						 d="M20.5 15.458c-.662.041-.7.93-.092 1.196 1.668.725 2.924 1.793 3.825 3.155.738 1.118 1.886 1.99 3.226 1.99h2.85c1.13 0 1.957-1.124 1.558-2.222a7.076 7.076 0 0 0-.07-.188c-.549-1.384-1.488-2.402-2.878-3.051-1.306-.61-2.94-.861-4.865-.937l-.032-.001h-.031c-1.134 0-2.319-.015-3.49.058Z"
 						 /></svg>
 							<span class="ml-3" sidebar-toggle-item>Users</span>
@@ -193,11 +196,12 @@ import { pathRoutes } from "../config/pathRoutes";
 							>
 							<svg 
 								xmlns="http://www.w3.org/2000/svg" 
+								class="flex-shrink-0 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white"
 								width="18" 
 								height="17" 
 								fill="none" 
 								viewBox="0 0 25 25">  
-								<path fill="#6B7280" 
+								<path fill="currentColor" 
 								d="M23 9.487h-5.27V8.184a.997.997 0 0 0-.999-.999h-1.895v-.818c.872-.685 1.376-1.665 1.376-2.708C16.212 1.64 14.326 0 12.005 0 9.683 0 7.798 1.64 7.798 3.659c0 1.043.504 2.023 1.376 2.708v.818H7.278a.998.998 0 0 0-.999 1v1.302H1a.998.998 0 0 0-.999 1V23A.996.996 0 0 0 1 24h22c.554 0 1-.446 1-1V10.487a1 1 0 0 0-1-.999ZM10.669 4.971c-.549-.318-.877-.808-.877-1.312 0-.901 1.009-1.66 2.209-1.66 1.195 0 2.209.759 2.209 1.66 0 .504-.328.999-.877 1.312a1 1 0 0 0-.5.867V7.18h-1.665V5.838c0-.357-.19-.685-.5-.867ZM8.273 9.184h7.46v2.566h-7.46V9.184Zm13.729 12.818H1.998h14.733L19.5 22l2.497.002h.005Z"
 								/></svg>
 							<span
@@ -206,8 +210,8 @@ import { pathRoutes } from "../config/pathRoutes";
 							>			
 							<svg
 								sidebar-toggle-item
-								class="w-6 h-6"
-								fill="#6B7280"
+								class="w-6 h-6 flex-shrink-0 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white"
+								fill="currentColor"
 								viewBox="0 0 20 20"
 								xmlns="http://www.w3.org/2000/svg"
 								><path
diff --git a/src/components/Issuance/IssuedCrdentials.tsx b/src/components/Issuance/IssuedCrdentials.tsx
index 67f9a5cde..14c03258e 100644
--- a/src/components/Issuance/IssuedCrdentials.tsx
+++ b/src/components/Issuance/IssuedCrdentials.tsx
@@ -101,7 +101,7 @@ const CredentialList = () => {
 			<div className="mb-4 col-span-full xl:mb-2">
 				<BreadCrumbs />
 				<h1 className="ml-1 text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">
-					Issued Credentials
+					 Credential Issued
 				</h1>
 			</div>
 			<div>
diff --git a/src/components/organization/WalletSpinup.tsx b/src/components/organization/WalletSpinup.tsx
index 33758b7cb..bc6a17f69 100644
--- a/src/components/organization/WalletSpinup.tsx
+++ b/src/components/organization/WalletSpinup.tsx
@@ -259,7 +259,7 @@ const WalletSpinup = (props: {
 					<Button
 						isProcessing={loading}
 						type="submit"
-						className='float-right text-base font-medium text-center text-white bg-primary-700 rounded-lg hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 sm:w-auto dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800"'
+						className='float-right text-base font-medium text-center text-white bg-primary-700 hover:bg-primary-800 rounded-lg focus:ring-4 focus:ring-primary-300 sm:w-auto dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800"'
 					>
 						Setup Agent
 					</Button>
@@ -275,7 +275,14 @@ const WalletSpinup = (props: {
 				label: '',
 			}}
 			validationSchema={yup.object().shape({
-				label: yup.string().required('Wallet label is required').trim().test('no-spaces', 'Spaces are not allowed', value => !value || !value.includes(' ')),
+				label: yup.string()
+				.required('Wallet label is required')
+				.trim()
+				.test('no-spaces', 'Spaces are not allowed', value => !value || !value.includes(' '))
+				.matches(
+						/^[A-Za-z0-9-][^ !"#$%&'()*+,-./:;<=>?@[\]^_`{|}~]*$/,
+						'Wallet label must be alphanumeric only',
+				),
 			})}
 			validateOnBlur
 			validateOnChange
@@ -392,7 +399,7 @@ const WalletSpinup = (props: {
 											disabled
 											className="cursor-pointer w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-700 dark:focus:ring-offset-gray-700 focus:ring-2 dark:bg-gray-600 dark:border-gray-500"
 										/>
-										<label className="w-full py-3 ml-2 text-sm font-medium text-gray-900 dark:text-gray-300">
+										<label className="w-full py-3 ml-2 text-sm font-medium text-gray-400 dark:text-gray-300">
 											Dedicated{' '}
 										</label>
 									</div>