Sync changes from DEV to QA

.github/workflows/deploy-qa.yml

@@ -52,23 +52,23 @@ jobs:
 
          echo "PUBLIC_POLYGON_TESTNET_URL=https://rpc-amoy.polygon.technology" >> .env
 
-         echo "PUBLIC_ECOSYSTEM_FRONT_END_URL=https://qa-ecosystem.credebl.id" >> .env
+         echo "PUBLIC_ECOSYSTEM_FRONT_END_URL=https://qa-ecosystem.sovio.id" >> .env
 
-         echo "PUBLIC_CREDEBL_FRONT_END_URL=https://qa.credebl.id" >> .env
+         echo "PUBLIC_CREDEBL_FRONT_END_URL=https://qa.sovio.id" >> .env
 
          echo "PUBLIC_ECOSYSTEM_BASE_URL=${{ secrets.QA_PUBLIC_ECOSYSTEM_BASE_URL }}" >> .env
 
          echo "PUBLIC_PLATFORM_DISCORD_URL=https://discord.gg/w4hnQT7NJG" >> .env
 
-         echo "PUBLIC_REDIRECTION_TARGET_URL=https://social-share.credebl.id" >> .env
+         echo "PUBLIC_REDIRECTION_TARGET_URL=https://social-share.sovio.id" >> .env
 
          echo "PUBLIC_CRYPTO_PRIVATE_KEY=${{ secrets.QA_PUBLIC_CRYPTO_PRIVATE_KEY }}" >> .env
 
          echo "PUBLIC_KEYCLOAK_MANAGEMENT_CLIENT_ID=${{ secrets.QA_PUBLIC_KEYCLOAK_MANAGEMENT_CLIENT_ID }}" >> .env
 
          echo "PUBLIC_KEYCLOAK_MANAGEMENT_CLIENT_SECRET=${{ secrets.QA_PUBLIC_KEYCLOAK_MANAGEMENT_CLIENT_SECRET }}" >> .env
 
-         echo "PUBLIC_REDIRECT_FROM_URL=https://qa.credebl.id" >> .env
+         echo "PUBLIC_REDIRECT_FROM_URL=https://qa.sovio.id" >> .env
 
       - name: Build step
         run: npm install && npm run build # 📝 Update the build command(s)

src/commonComponents/datatable/SortDataTable.tsx

@@ -8,6 +8,7 @@ import { EmptyListMessage } from '../../components/EmptyListComponent';
 
 const SortDataTable: React.FC<IDataTable> = ({
 	header,
+	searchValue,
 	displaySelect,
 	data,
 	loading,
@@ -91,7 +92,7 @@ const SortDataTable: React.FC<IDataTable> = ({
 												</svg>
 											</div>
 											{isSearch && (
-												<SearchInput onInputChange={onInputChange} />
+												<SearchInput onInputChange={onInputChange} value={searchValue}/>
 											)}
 										</div>
 									</form>

src/commonComponents/datatable/interface.ts

@@ -20,6 +20,7 @@ export interface Data {
 
 export interface IDataTable {
 	header: TableHeader[];
+	searchValue?: string;
 	data: ITableData[];
 	loading: boolean;
 	onInputChange: (e: ChangeEvent<HTMLInputElement>) => void;

src/components/ConnectionsList/index.tsx

@@ -37,6 +37,7 @@ const ConnectionList = () => {
 		nextPage: '',
 		lastPage: '',
 	});
+	const [searchText, setSearchText] = useState("");
 
 	const getConnections = async (apiParameter: IConnectionListAPIParameter) => {
 		const orgId = await getFromLocalStorage(storageKeys.ORG_ID);
@@ -105,6 +106,7 @@ const ConnectionList = () => {
 
 	//onChange of Search input text
 	const searchInputChange = (e: ChangeEvent<HTMLInputElement>) => {
+		setSearchText(e.target.value)
 		setListAPIParameter({
 			...listAPIParameter,
 			search: e.target.value,
@@ -150,6 +152,7 @@ const ConnectionList = () => {
 			)}
 			<SortDataTable
 				onInputChange={searchInputChange}
+				searchValue={searchText}
 				refresh={refreshPage}
 				header={header}
 				data={connectionList}

src/components/Issuance/ConnectionList.tsx

@@ -40,7 +40,7 @@ const ConnectionList = (props: {
 	const [tableData, setTableData] = useState<ITableData[]>([]);
 	const [connectionList, setConnectionList] = useState([]);
 	const [localOrgs, setLocalOrgs] = useState<LocalOrgs[]>([]);
-
+	const [searchText, setSearchText] = useState("");
 	const [loading, setLoading] = useState<boolean>(false);
 	const [totalItem, setTotalItem] = useState(0);
 	const [error, setError] = useState<string | null>(null);
@@ -188,6 +188,7 @@ const ConnectionList = (props: {
 
 	//onChange of Search input text
 	const searchInputChange = (e: ChangeEvent<HTMLInputElement>) => {
+		setSearchText(e.target.value)
 		setListAPIParameter({
 			...listAPIParameter,
 			search: e.target.value,
@@ -278,6 +279,7 @@ const ConnectionList = (props: {
 			/>
 			<NewDataTable
 				isHeader={true}
+				searchValue={searchText}
 				isSearch={true}
 				isRefresh={true}
 				isSort={true}

src/components/Issuance/IssuedCrdentials.tsx

@@ -46,7 +46,7 @@ const CredentialList = () => {
 		lastPage: '',
 	});
 	const [w3cSchema, setW3CSchema]= useState<boolean>(false);
-
+    const [searchText, setSearchText] = useState("");
 
 	const getIssuedCredDefs = async (
 		listAPIParameter: IConnectionListAPIParameter,
@@ -204,6 +204,7 @@ const CredentialList = () => {
 
 	//onChange of Search input text
 	const searchInputChange = (e: ChangeEvent<HTMLInputElement>) => {
+		setSearchText(e.target.value)
 		setListAPIParameter({
 			...listAPIParameter,
 			search: e.target.value,
@@ -301,6 +302,7 @@ const CredentialList = () => {
 								>
 									<SortDataTable
 										onInputChange={searchInputChange}
+										searchValue={searchText}
 										refresh={refreshPage}
 										header={header}
 										data={issuedCredList}

src/components/Resources/Schema/SchemasList.tsx

@@ -123,7 +123,7 @@ const SchemaList = (props: {
 	): Promise<void> => {
 		event.preventDefault();
 		const inputValue = event.target.value;
-        setSearchValue(inputValue);
+        setSearchValue(inputValue.toLowerCase());
 
 		getSchemaList(
 			{

src/components/Verification/ConnectionList.tsx

@@ -36,7 +36,7 @@ const ConnectionList = (props: {
 	const [connectionList, setConnectionList] = useState<ITableData[]>([]);
 	const [connectionsTableData, setConnectionsTableData] = useState<ITableData[]>([]);
 	const [localOrgs, setLocalOrgs] = useState<LocalOrgs[]>([]);
-
+	const [searchText, setSearchText] = useState("");
 	const [selectedConnectionList, setSelectedConnectionList] = useState<
 	ITableData[]
 	>([]);
@@ -66,6 +66,7 @@ const ConnectionList = (props: {
 	}, [listAPIParameter]);
 
 	const searchInputChange = (e: ChangeEvent<HTMLInputElement>) => {
+		setSearchText(e.target.value)
 		setListAPIParameter({
 			...listAPIParameter,
 			search: e.target.value,
@@ -299,6 +300,7 @@ const extractConnectionFields = (item: IConnectionList) => {
 			/>
 			<SortDataTable
 				onInputChange={searchInputChange}
+				searchValue={searchText}
 				refresh={refreshPage}
 				header={verification_header}
 				data={connectionsTableData}

src/components/Verification/VerificationCredentialList.tsx

@@ -58,6 +58,7 @@ const VerificationCredentialList = () => {
 		nextPage: '',
 		lastPage: '',
 	});
+    const [searchText, setSearchText] = useState("");
 
 	const getProofPresentationData = async (proofId: string) => {
 		try {
@@ -85,6 +86,7 @@ const VerificationCredentialList = () => {
 	};
 
 	const searchInputChange = (e: ChangeEvent<HTMLInputElement>) => {
+		setSearchText(e.target.value)
 		setListAPIParameter({
 			...listAPIParameter,
 			search: e.target.value,
@@ -410,6 +412,7 @@ const VerificationCredentialList = () => {
 								>
 									<SortDataTable
 										pageInfo={pageInfo}
+										searchValue={searchText}
 										searchSortByValue={searchSortByValue}
 										isHeader={true}
 										isSearch={true}

src/components/organization/OrganizationsList.tsx

@@ -127,12 +127,18 @@ const OrganizationsList = () => {
 		await setToLocalStorage(storageKeys.ORG_ROLES, roles.toString());
 		window.location.href = pathRoutes.organizations.dashboard;
 	};
+
+	const filteredOrganizations = organizationsList?.filter((org) =>
+		org.name.toLowerCase().includes(searchText.toLowerCase())
+	);
+
 	let content: React.JSX.Element = <></>;
-	if (organizationsList && organizationsList?.length > 0) {
+
+	if (filteredOrganizations && filteredOrganizations.length > 0) {
 		content = (
 			<div>
 				<div className="mt-1 grid w-full grid-cols-1 gap-4 mt-0 mb-4 xl:grid-cols-2 2xl:grid-cols-3">
-					{organizationsList.map((org) => (
+					{filteredOrganizations.map((org) => (
 						<Card
 							key={org.id}
 							onClick={() => redirectOrgDashboard(org)}
@@ -142,23 +148,26 @@ const OrganizationsList = () => {
 								maxWidth: '100%',
 								overflow: 'auto',
 							}}
-						 >
+						>
 							<div className="flex items-center min-[401px]:flex-nowrap flex-wrap">
-
 								{org.logoUrl ? (
 									<CustomAvatar
-									textSizeRatio={2.5}
+										textSizeRatio={2.5}
 										className="min-w-[80px] text-violet11 leading-1 flex h-full w-full items-center justify-center bg-white text-[15px] font-medium "
 										size="80px"
 										src={org?.logoUrl}
 										round
-
-									/>	
+									/>
 								) : (
-									<CustomAvatar textSizeRatio={2.5} className='text-violet11 leading-1 flex h-full w-full items-center justify-center bg-white text-[15px] font-medium ' size="80px" name={org.name} round/>
+									<CustomAvatar
+										textSizeRatio={2.5}
+										className="text-violet11 leading-1 flex h-full w-full items-center justify-center bg-white text-[15px] font-medium "
+										size="80px"
+										name={org.name}
+										round
+									/>
 								)}
-
-								<div className="ml-4 w-100/6rem line-clamp-4 ">
+								<div className="ml-4 w-100/6rem line-clamp-4">
 									<h5 className="text-xl font-bold tracking-tight text-gray-900 dark:text-white">
 										{org?.name}
 									</h5>
@@ -194,25 +203,33 @@ const OrganizationsList = () => {
 						</Card>
 					))}
 				</div>
-				<div>
-					{currentPage.total > 1 && (
-						<div className="flex items-center justify-end mb-4">
-							<Pagination
-								currentPage={currentPage.pageNumber}
-								onPageChange={onPageChange}
-								totalPages={currentPage.total}
-							/>
-						</div>
-					)}
-				</div>
+				{currentPage.total > 1 && (
+					<div className="flex items-center justify-end mb-4">
+						<Pagination
+							currentPage={currentPage.pageNumber}
+							onPageChange={onPageChange}
+							totalPages={currentPage.total}
+						/>
+					</div>
+				)}
 			</div>
 		);
-	} else {
+	} else if (searchText && filteredOrganizations?.length === 0) {
 		content = (
 			<EmptyListMessage
-				message={'No Organization'}
-				description={'Get started by creating a new Organization'}
-				buttonContent={'Create Organization'}
+				message="No organizations found"
+				description="Get started by creating a new Organization"
+				buttonContent="Create Organization"
+				onClick={createOrganizationModel}
+				feature={Features.CRETAE_ORG}
+			/>
+		);
+	} else if (!searchText && (!organizationsList || organizationsList.length === 0)) {
+		content = (
+			<EmptyListMessage
+				message="No Organization"
+				description="Get started by creating a new Organization"
+				buttonContent="Create Organization"
 				onClick={createOrganizationModel}
 				feature={Features.CRETAE_ORG}
 				svgComponent={
@@ -233,6 +250,7 @@ const OrganizationsList = () => {
 			/>
 		);
 	}
+
 
 	return (
 		<div className="px-4 pt-2">
@@ -245,7 +263,7 @@ const OrganizationsList = () => {
 					Organizations
 				</h1>
 				<div className="ml-auto">
-					<SearchInput onInputChange={searchInputChange} />
+					<SearchInput onInputChange={searchInputChange} value={searchText}/>
 				</div>
 				<RoleViewButton
 					disabled={currentPage.totalCount >= 10}
@@ -278,15 +296,6 @@ const OrganizationsList = () => {
 						setOpenModal={props.setOpenModal}
 						isorgModal={true}
 					/>
-					{ organizationsList && <AlertComponent
-						message={message || error}
-						type={message ? 'success' : 'failure'}
-						onAlertClose={() => {
-							setMessage(null);
-							setError(null);
-						}}
-					/>
-					}
 
 					{loading ? (
 						<div className="flex items-center justify-center mb-4 ">

src/components/organization/invitations/Invitations.tsx

@@ -122,6 +122,7 @@ const Invitations = () => {
                 <div className="flex items-end justify-end mb-4 gap-4">
                     <SearchInput
                         onInputChange={searchInputChange}
+                        value={searchText}
                     />
                     <RoleViewButton
                         buttonTitle='Invite'

src/components/organization/users/Members.tsx

@@ -108,7 +108,7 @@ const Members = () => {
 		<div>
 			<div className="p-4 bg-white border border-gray-200 rounded-lg shadow-sm 2xl:col-span-2 dark:border-gray-700 sm:p-6 dark:bg-gray-800">
 				<div className="flex items-end justify-end mb-4 ">
-					<SearchInput onInputChange={searchInputChange} />
+					<SearchInput onInputChange={searchInputChange} value={searchText} />
 				</div>
 
 				<EditUserRoleModal

src/pages/index.astro

@@ -788,9 +788,7 @@ const env = import.meta.env || process.env;
 												class="h-10 w-10 rounded-full bg-gray-100 text-gray-600 dark:bg-gray-600 dark:text-gray-300 sm:h-12 sm:w-12 lg:h-16 lg:w-16"
 											/></a
 										>
-									</div>              class="dark:text:white hover:opacity-50"
-1149
-
+									</div>            
 
 									<div
 										data-testid="flowbite-tooltip"
@@ -1013,9 +1011,7 @@ const env = import.meta.env || process.env;
 										</div>
 									</div>
 
-								</div>              class="dark:text:white hover:opacity-50"
-1149
-
+								</div> 
 
 							</div>
 							<div