diff --git a/src/app/SideBar.astro b/src/app/SideBar.astro
index 62e3d9e49..1ca03c146 100644
--- a/src/app/SideBar.astro
+++ b/src/app/SideBar.astro
@@ -163,6 +163,30 @@ import { pathRoutes } from '../config/pathRoutes';
 						</a>
 					</li>
 
+					<li>
+						<a
+							href={pathRoutes.users.connectionList}
+							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 w-6 h-6 pt-1 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white"
+								fill="none"
+								viewBox="0 0 22 22"
+							>
+								<path
+									fill="currentColor"
+									d="M7.042.03a3.545 3.545 0 0 0-1.15.425c-.636.395-1.064.89-1.38 1.608a3.47 3.47 0 0 0-.302 1.363c-.042.988.257 1.855.88 2.569.319.368.59.586.99.792.277.143.885.338 1.059.338h.083v1.337l-.545.432c-.702.552-.633.515-.733.387-.66-.856-1.407-1.307-2.328-1.4C1.17 7.635-.651 10.234.222 12.72c.378 1.075 1.327 1.95 2.397 2.209.382.09 1.07.079 1.459-.027 1.195-.326 2.112-1.307 2.429-2.595.08-.323.11-1.111.059-1.45a6.061 6.061 0 0 0-.146-.593c-.056-.184-.09-.35-.077-.364.063-.06 1.098-.868 1.136-.883.028-.011 1.095.796 1.196.902.003.007-.039.161-.094.345-.153.492-.188.785-.167 1.326.031.781.226 1.382.65 1.99.854 1.221 2.32 1.717 3.665 1.24.507-.18.84-.402 1.244-.819.535-.552.851-1.194.98-1.99.212-1.3-.3-2.656-1.303-3.46a4.054 4.054 0 0 0-1.098-.578c-.48-.139-1.195-.139-1.689 0-.656.18-1.323.654-1.754 1.243l-.14.192-.593-.473-.598-.47V7.14l.26-.048c1.15-.207 2.13-1.078 2.55-2.258.16-.446.223-.882.202-1.408A3.41 3.41 0 0 0 10.457 2C9.814.606 8.477-.168 7.042.03Zm.927.617c1.143.218 2.043 1.194 2.245 2.437.086.537-.007 1.213-.237 1.743l-.083.195-.267-.304c-.397-.454-.82-.74-1.352-.905-.226-.071-.354-.086-.775-.086-.6 0-.875.07-1.372.349-.254.143-.382.248-.67.56l-.359.382-.083-.195c-.326-.8-.344-1.626-.055-2.388C5.31 1.522 6.107.823 7.003.65c.362-.072.601-.072.966-.004Zm-3.978 7.91c1.623.431 2.516 2.444 1.807 4.078l-.1.233-.341-.364c-.445-.477-.782-.688-1.37-.86-.312-.09-1.073-.09-1.386.003a2.944 2.944 0 0 0-.879.425c-.236.161-.618.544-.73.724-.055.087-.058.087-.103.023-.087-.128-.24-.6-.292-.905a3.468 3.468 0 0 1 .045-1.24c.125-.518.497-1.164.858-1.487.72-.653 1.588-.871 2.491-.63Zm8.269-.034c.104.018.306.086.445.146 1.452.623 2.136 2.434 1.494 3.947-.094.226-.167.32-.167.222 0-.015-.094-.143-.212-.278a3.054 3.054 0 0 0-1.421-.913c-.313-.094-1.073-.094-1.386-.004-.587.173-.924.383-1.37.86l-.34.365-.104-.233c-.184-.432-.25-.807-.233-1.34.014-.399.035-.52.122-.797.466-1.453 1.762-2.26 3.172-1.975Z"
+								></path>
+								<path
+									fill="currentColor"
+									d="M7.184.983a1.311 1.311 0 0 0-.802.736c-.118.255-.129.736-.028 1.025.097.282.337.567.604.718.195.109.24.116.542.116.296 0 .351-.011.532-.109.264-.143.518-.44.615-.725.063-.172.073-.274.063-.533-.018-.368-.09-.57-.31-.841-.278-.342-.813-.511-1.216-.387ZM3.053 8.835a1.248 1.248 0 0 0-.858.728c-.087.188-.097.256-.097.571 0 .285.017.39.076.533.104.248.365.537.598.658.17.093.236.105.524.105.285 0 .358-.015.525-.098a1.3 1.3 0 0 0 .597-.665c.24-.556.077-1.24-.385-1.603a1.143 1.143 0 0 0-.98-.23Zm8.434-.015c-.5.093-.904.533-1 1.1-.095.56.2 1.16.69 1.408.17.087.244.102.529.102.288 0 .354-.012.524-.105.233-.12.493-.41.598-.658.062-.142.076-.248.076-.533 0-.315-.01-.383-.097-.57a1.265 1.265 0 0 0-.91-.74 2.748 2.748 0 0 0-.223-.038 4.78 4.78 0 0 1-.187.034Z"
+								></path>
+							</svg>
+							<span class="ml-1.5" sidebar-toggle-item>Connections</span>
+						</a>
+					</li>
+
 					<!-- <li>
 						<a
 							href={pathRoutes.users.invitations}
diff --git a/src/components/ConnectionsList/index.tsx b/src/components/ConnectionsList/index.tsx
new file mode 100644
index 000000000..2ec479ef2
--- /dev/null
+++ b/src/components/ConnectionsList/index.tsx
@@ -0,0 +1,111 @@
+'use client';
+
+import type { AxiosResponse } from 'axios';
+import { useEffect, useState } from 'react';
+import { getConnectionsByOrg } from '../../api/connection';
+import DataTable from '../../commonComponents/datatable';
+import type { TableData } from '../../commonComponents/datatable/interface';
+import { apiStatusCodes } from '../../config/CommonConstant';
+import { AlertComponent } from '../AlertComponent';
+import { dateConversion } from '../../utils/DateConversion';
+import DateTooltip from '../Tooltip';
+import BreadCrumbs from '../BreadCrumbs';
+import CustomSpinner from '../CustomSpinner';
+import { EmptyListMessage } from '../EmptyListComponent';
+
+const ConnectionList = () => {
+	const [connectionList, setConnectionList] = useState<TableData[]>([]);
+	const [loading, setLoading] = useState<boolean>(true);
+	const [error, setError] = useState<string | null>(null);
+
+	useEffect(() => {
+		getConnections();
+	}, []);
+
+	const getConnections = async () => {
+		setLoading(true);
+		const response = await getConnectionsByOrg();
+		const { data } = response as AxiosResponse;
+
+		if (data?.statusCode === apiStatusCodes.API_STATUS_SUCCESS) {
+			const connections = data?.data?.map(
+				(ele: { theirLabel: string; id: string; createdAt: string }) => {
+					const userName = ele?.theirLabel ? ele.theirLabel : 'Not available';
+					const connectionId = ele.id ? ele.id : 'Not available';
+					const createdOn = ele?.createdAt ? ele?.createdAt : 'Not available';
+					return {
+						data: [
+							{ data: userName },
+							{ data: connectionId },
+							{
+								data: (
+									<DateTooltip date={createdOn} id="issuance_connection_list">
+										{' '}
+										{dateConversion(createdOn)}{' '}
+									</DateTooltip>
+								),
+							},
+						],
+					};
+				},
+			);
+			setConnectionList(connections);
+		} else {
+			setError(response as string);
+		}
+		setLoading(false);
+	};
+
+	const header = [
+		{ columnName: 'User' },
+		{ columnName: 'Connection ID' },
+		{ columnName: 'Created on' },
+	];
+
+	return (
+		<div className="p-4" id="connection_list">
+			<BreadCrumbs />
+			<div
+				className="flex items-center justify-between mb-4"
+				id="connection-list"
+			>
+				<h1 className="ml-1 text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">
+					Connections
+				</h1>
+			</div>
+			<AlertComponent
+				message={error}
+				type={'failure'}
+				onAlertClose={() => {
+					setError(null);
+				}}
+			/>
+
+			{loading ? (
+				<div className="flex items-center justify-center mt-36 mb-4">
+					<CustomSpinner />
+				</div>
+			) : connectionList && connectionList?.length > 0 ? (
+				<div
+					id="issuance_datatable"
+					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"
+				>
+					<DataTable
+						header={header}
+						data={connectionList}
+						loading={loading}
+					></DataTable>
+				</div>
+			) : (
+				<div className="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">
+					<EmptyListMessage
+						message={'No Connections'}
+						description={"You don't have any connection"}
+					/>
+				</div>
+			)}
+		</div>
+	);
+};
+
+export default ConnectionList;
diff --git a/src/config/pathRoutes.ts b/src/config/pathRoutes.ts
index 0472b3f1b..f155a103a 100644
--- a/src/config/pathRoutes.ts
+++ b/src/config/pathRoutes.ts
@@ -9,6 +9,7 @@ export const pathRoutes = {
         profile: '/profile',
         invitations: '/invitations',
         fetchUsers: '/users',
+				connectionList: '/connections'
     },
     organizations: {
         root: '/organizations',
diff --git a/src/pages/connections.astro b/src/pages/connections.astro
new file mode 100644
index 000000000..327db42e0
--- /dev/null
+++ b/src/pages/connections.astro
@@ -0,0 +1,8 @@
+---
+import LayoutSidebar from "../app/LayoutSidebar.astro";
+import ConnectionsList from "../components/ConnectionsList";
+---
+
+<LayoutSidebar>
+	<ConnectionsList client:load />
+</LayoutSidebar>