From f1fe904fc79b55668b114c3aa9294afd0c6ef654 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C5=A1per=20Grom?= <gasper.grom@gmail.com>
Date: Fri, 5 Jan 2024 13:34:34 +0100
Subject: [PATCH 1/9] Change layout for merge suggestions (#2011)

---
 .../pages/member-merge-suggestions-page.vue   | 111 +++++++++---------
 .../organization-merge-suggestions-page.vue   | 110 ++++++++---------
 2 files changed, 110 insertions(+), 111 deletions(-)

diff --git a/frontend/src/modules/member/pages/member-merge-suggestions-page.vue b/frontend/src/modules/member/pages/member-merge-suggestions-page.vue
index 0f4aa8c8c1..9db1912980 100644
--- a/frontend/src/modules/member/pages/member-merge-suggestions-page.vue
+++ b/frontend/src/modules/member/pages/member-merge-suggestions-page.vue
@@ -14,27 +14,40 @@
       Here you can check all the merging suggestions.
     </div>
 
-    <div v-if="loading || count > 0" class="panel">
+    <div v-if="loading || count > 0" class="panel !p-0">
       <!-- Header -->
-      <header class="flex items-center justify-between pb-4">
-        <button
-          type="button"
-          class="btn btn--transparent btn--md"
-          :disabled="loading || offset <= 0"
-          @click="fetch(offset - 1)"
-        >
-          <span class="ri-arrow-left-s-line text-lg mr-2" />
-          <span>Previous</span>
-        </button>
-        <app-loading v-if="loading" height="16px" width="131px" radius="3px" />
-        <div
-          v-else
-          class="text-sm leading-5 text-gray-500 flex flex-wrap justify-center"
-        >
-          <div>{{ offset + 1 }} of {{ Math.ceil(count) }} suggestions</div>
+      <header class="flex items-center justify-between px-6 py-5 border-b">
+        <div class="flex items-center">
+          <button
+            type="button"
+            class="btn btn--transparent btn--md"
+            :disabled="loading || offset <= 0"
+            @click="fetch(offset - 1)"
+          >
+            <span class="ri-arrow-left-s-line text-lg mr-2" />
+            <span>Previous</span>
+          </button>
+          <app-loading v-if="loading" height="16px" width="131px" radius="3px" />
           <div
-            v-if="membersToMerge.similarity"
-            class="w-full flex items-center justify-center pt-2"
+            v-else
+            class="text-sm leading-5 text-gray-500 flex flex-wrap justify-center px-4"
+          >
+            <div>{{ offset + 1 }} of {{ Math.ceil(count) }} suggestions</div>
+          </div>
+          <button
+            type="button"
+            class="btn btn--transparent btn--md"
+            :disabled="loading || offset >= count - 1"
+            @click="fetch(offset + 1)"
+          >
+            <span>Next</span>
+            <span class="ri-arrow-right-s-line text-lg ml-2" />
+          </button>
+        </div>
+        <div class="flex items-center">
+          <div
+            v-if="!loading && membersToMerge.similarity"
+            class="w-full flex items-center justify-center pr-2"
           >
             <div
               class="flex text-sm"
@@ -46,40 +59,47 @@
               {{ Math.round(membersToMerge.similarity * 100) }}% confidence
             </div>
           </div>
+          <el-button
+            :disabled="loading || isEditLockedForSampleData"
+            class="btn btn--bordered btn--md"
+            :loading="sendingIgnore"
+            @click="ignoreSuggestion()"
+          >
+            Ignore suggestion
+          </el-button>
+          <el-button
+            :disabled="loading || isEditLockedForSampleData"
+            class="btn btn--primary btn--md !ml-4"
+            :loading="sendingMerge"
+            @click="mergeSuggestion()"
+          >
+            Merge contacts
+          </el-button>
         </div>
-        <button
-          type="button"
-          class="btn btn--transparent btn--md"
-          :disabled="loading || offset >= count - 1"
-          @click="fetch(offset + 1)"
-        >
-          <span>Next</span>
-          <span class="ri-arrow-right-s-line text-lg ml-2" />
-        </button>
       </header>
 
       <!-- Comparison -->
       <!-- Loading -->
-      <div v-if="loading" class="flex -mx-3">
-        <div class="w-1/2 px-3">
+      <div v-if="loading" class="flex p-5">
+        <div class="w-1/2 border rounded-l-lg">
           <app-member-merge-suggestions-details
             :member="null"
             :loading="true"
             :is-primary="true"
           />
         </div>
-        <div class="w-1/2 px-3">
+        <div class="w-1/2 -ml-px border rounded-r-lg">
           <app-member-merge-suggestions-details
             :member="null"
             :loading="true"
           />
         </div>
       </div>
-      <div v-else class="flex -mx-3">
+      <div v-else class="flex p-5">
         <div
           v-for="(member, mi) of membersToMerge.members"
           :key="member.id"
-          class="w-1/2 px-3"
+          class="w-1/2"
         >
           <app-member-merge-suggestions-details
             :member="member"
@@ -88,35 +108,14 @@
             "
             :is-primary="mi === primary"
             :extend-bio="bioHeight"
+            class="border"
+            :class="mi > 0 ? 'rounded-r-lg -ml-px' : 'rounded-l-lg'"
             @make-primary="primary = mi"
             @bio-height="$event > bioHeight ? (bioHeight = $event) : null"
           />
         </div>
       </div>
-
       <!-- Actions -->
-      <div class="flex -mx-3 pt-8">
-        <div class="w-1/2 px-3">
-          <el-button
-            :disabled="loading || isEditLockedForSampleData"
-            class="btn btn--bordered btn--lg w-full"
-            :loading="sendingIgnore"
-            @click="ignoreSuggestion()"
-          >
-            Ignore suggestion
-          </el-button>
-        </div>
-        <div class="w-1/2 px-3">
-          <el-button
-            :disabled="loading || isEditLockedForSampleData"
-            class="btn btn--primary btn--lg w-full"
-            :loading="sendingMerge"
-            @click="mergeSuggestion()"
-          >
-            Merge contacts
-          </el-button>
-        </div>
-      </div>
     </div>
     <!-- Empty state -->
     <div v-else class="pt-20 flex flex-col items-center">
diff --git a/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue b/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue
index 1a60af2444..92d0deb431 100644
--- a/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue
+++ b/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue
@@ -14,27 +14,40 @@
       Here you can check all the merging suggestions.
     </div>
 
-    <div v-if="loading || count > 0" class="panel">
+    <div v-if="loading || count > 0" class="panel !p-0">
       <!-- Header -->
-      <header class="flex items-center justify-between pb-4">
-        <button
-          type="button"
-          class="btn btn--transparent btn--md"
-          :disabled="loading || offset <= 0"
-          @click="fetch(offset - 1)"
-        >
-          <span class="ri-arrow-left-s-line text-lg mr-2" />
-          <span>Previous</span>
-        </button>
-        <app-loading v-if="loading" height="16px" width="131px" radius="3px" />
-        <div
-          v-else
-          class="text-sm leading-5 text-gray-500 flex flex-wrap justify-center"
-        >
-          <div>{{ offset + 1 }} of {{ Math.ceil(count) }} suggestions</div>
+      <header class="flex items-center justify-between px-6 py-5 border-b">
+        <div class="flex items-center">
+          <button
+            type="button"
+            class="btn btn--transparent btn--md"
+            :disabled="loading || offset <= 0"
+            @click="fetch(offset - 1)"
+          >
+            <span class="ri-arrow-left-s-line text-lg mr-2" />
+            <span>Previous</span>
+          </button>
+          <app-loading v-if="loading" height="16px" width="131px" radius="3px" />
           <div
-            v-if="organizationsToMerge.similarity"
-            class="w-full flex items-center justify-center pt-2"
+            v-else
+            class="text-sm leading-5 text-gray-500 flex flex-wrap justify-center px-4"
+          >
+            <div>{{ offset + 1 }} of {{ Math.ceil(count) }} suggestions</div>
+          </div>
+          <button
+            type="button"
+            class="btn btn--transparent btn--md"
+            :disabled="loading || offset >= count - 1"
+            @click="fetch(offset + 1)"
+          >
+            <span>Next</span>
+            <span class="ri-arrow-right-s-line text-lg ml-2" />
+          </button>
+        </div>
+        <div class="flex items-center">
+          <div
+            v-if="!loading && organizationsToMerge.similarity"
+            class="w-full flex items-center justify-center pr-2"
           >
             <div
               class="flex text-sm"
@@ -46,40 +59,47 @@
               {{ Math.round(organizationsToMerge.similarity * 100) }}% confidence
             </div>
           </div>
+          <el-button
+            :disabled="loading || isEditLockedForSampleData"
+            class="btn btn--bordered btn--md"
+            :loading="sendingIgnore"
+            @click="ignoreSuggestion()"
+          >
+            Ignore suggestion
+          </el-button>
+          <el-button
+            :disabled="loading || isEditLockedForSampleData"
+            class="btn btn--primary btn--md !ml-4"
+            :loading="sendingMerge"
+            @click="mergeSuggestion()"
+          >
+            Merge organizations
+          </el-button>
         </div>
-        <button
-          type="button"
-          class="btn btn--transparent btn--md"
-          :disabled="loading || offset >= count - 1"
-          @click="fetch(offset + 1)"
-        >
-          <span>Next</span>
-          <span class="ri-arrow-right-s-line text-lg ml-2" />
-        </button>
       </header>
 
       <!-- Comparison -->
       <!-- Loading -->
-      <div v-if="loading" class="flex -mx-3">
-        <div class="w-1/2 px-3">
+      <div v-if="loading" class="flex p-5">
+        <div class="w-1/2 border rounded-l-lg">
           <app-organization-merge-suggestions-details
             :organization="null"
             :loading="true"
             :is-primary="true"
           />
         </div>
-        <div class="w-1/2 px-3">
+        <div class="w-1/2 -ml-px border rounded-r-lg">
           <app-organization-merge-suggestions-details
             :organization="null"
             :loading="true"
           />
         </div>
       </div>
-      <div v-else class="flex -mx-3">
+      <div v-else class="flex p-5">
         <div
           v-for="(organization, mi) of organizationsToMerge.organizations"
           :key="organization.id"
-          class="w-1/2 px-3"
+          class="w-1/2"
         >
           <app-organization-merge-suggestions-details
             :organization="organization"
@@ -88,6 +108,8 @@
             "
             :is-primary="mi === primary"
             :extend-bio="bioHeight"
+            class="border"
+            :class="mi > 0 ? 'rounded-r-lg -ml-px' : 'rounded-l-lg'"
             @make-primary="primary = mi"
             @bio-height="$event > bioHeight ? (bioHeight = $event) : null"
           />
@@ -95,28 +117,6 @@
       </div>
 
       <!-- Actions -->
-      <div class="flex -mx-3 pt-8">
-        <div class="w-1/2 px-3">
-          <el-button
-            :disabled="loading || isEditLockedForSampleData"
-            class="btn btn--bordered btn--lg w-full"
-            :loading="sendingIgnore"
-            @click="ignoreSuggestion()"
-          >
-            Ignore suggestion
-          </el-button>
-        </div>
-        <div class="w-1/2 px-3">
-          <el-button
-            :disabled="loading || isEditLockedForSampleData"
-            class="btn btn--primary btn--lg w-full"
-            :loading="sendingMerge"
-            @click="mergeSuggestion()"
-          >
-            Merge organizations
-          </el-button>
-        </div>
-      </div>
     </div>
     <!-- Empty state -->
     <div v-else class="pt-20 flex flex-col items-center">

From 5440bb2611ca68c9af459a1256fd1ecf652696d4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lo=C3=AFc=20Saint-Roch?=
 <loicsaintroch@users.noreply.github.com>
Date: Fri, 5 Jan 2024 13:42:32 +0100
Subject: [PATCH 2/9] Do not override organization name on enrichment (#2027)

---
 .../src/activities/normalizeEnrichedMember.ts                    | 1 -
 1 file changed, 1 deletion(-)

diff --git a/services/apps/premium/members_enrichment_worker/src/activities/normalizeEnrichedMember.ts b/services/apps/premium/members_enrichment_worker/src/activities/normalizeEnrichedMember.ts
index 207325957f..6fbcacb90c 100644
--- a/services/apps/premium/members_enrichment_worker/src/activities/normalizeEnrichedMember.ts
+++ b/services/apps/premium/members_enrichment_worker/src/activities/normalizeEnrichedMember.ts
@@ -154,7 +154,6 @@ export async function updateOrganizations(input: EnrichingMember): Promise<strin
               ON CONFLICT (website, "tenantId")
                 WHERE website IS NOT NULL
                 DO UPDATE SET
-                  "displayName" = EXCLUDED."displayName",
                   linkedin = EXCLUDED.linkedin,
                   location = EXCLUDED.location,
                   "updatedAt" = NOW()

From 6905f5c8ac222a01aa2320c79d186f6c9e785adf Mon Sep 17 00:00:00 2001
From: joanagmaia <joana@crowd.dev>
Date: Fri, 5 Jan 2024 13:12:28 +0000
Subject: [PATCH 3/9] Refactor identities display (#2023)

---
 frontend/package-lock.json                    |  13 ++
 frontend/package.json                         |   3 +-
 frontend/src/assets/scss/buttons.scss         |  53 ------
 .../form/member-form-identities.vue           |  26 +--
 .../components/list/member-list-table.vue     |   9 +-
 .../member/components/member-display-name.vue |   2 +-
 .../member/components/member-identities.vue   |  66 -------
 .../member-merge-suggestions-details.vue      |  80 +--------
 .../view/_aside/_aside-enriched.vue           |  12 +-
 .../view/_aside/_aside-identities-extra.vue   | 100 +++++++++++
 .../view/_aside/_aside-identities.vue         | 116 +++---------
 .../view/_aside/_aside-organizations.vue      |   2 +-
 .../components/view/member-view-aside.vue     |  36 ++--
 .../form/organization-form-identities.vue     |  43 ++---
 .../list/organization-list-table.vue          |  12 +-
 .../components/organization-identities.vue    | 106 -----------
 ...organization-merge-suggestions-details.vue |  77 +-------
 .../view/_aside/_aside-identities-extra.vue   | 155 ++++++++++++++++
 .../view/_aside/_aside-identities.vue         |  63 +++++++
 .../view/organization-view-aside.vue          | 139 +--------------
 .../view/organization-view-members.vue        |  22 +--
 .../organization/types/Organization.ts        |   6 +-
 .../widget-active-leaderboard-members.vue     |   2 +-
 .../shared/widget-members-table-row.vue       |  79 +++++++++
 .../shared/widget-members-table.vue           |  72 +-------
 .../identities-horizontal-list-members.vue    |  32 ++++
 ...entities-horizontal-list-organizations.vue |  32 ++++
 .../components/identities-horizontal-list.vue | 112 ++++++++++++
 .../identities-vertical-list-members.vue      |  39 ++++
 ...identities-vertical-list-organizations.vue |  41 +++++
 .../components/identities-vertical-list.vue   | 116 ++++++++++++
 .../config/identitiesOrder/member/index.ts    |   9 +
 .../config/identitiesOrder/member/list.ts     |  18 ++
 .../config/identitiesOrder/member/profile.ts  |  18 ++
 .../identitiesOrder/member/suggestions.ts     |  18 ++
 .../identitiesOrder/organization/index.ts     |   9 +
 .../identitiesOrder/organization/list.ts      |  10 ++
 .../identitiesOrder/organization/profile.ts   |  10 ++
 .../organization/suggestions.ts               |  10 ++
 .../identities/config/useMemberIdentities.ts  | 136 ++++++++++++++
 .../config/useOrganizationIdentities.ts       | 132 ++++++++++++++
 .../platform/components/platform-icon.vue     |  38 ++++
 .../platform/components/platform-img.vue      |  33 ++++
 .../platform/components/platform-svg.vue      |  31 ++++
 .../modules/platform/components/platform.vue  |  87 +++++++++
 .../shared/modules/platform/types/Platform.ts |  20 +++
 .../src/shared/platform/platform-list.vue     |  87 ---------
 .../src/shared/platform/platform-popover.vue  |  82 ---------
 .../src/shared/platform/platform-svg-icon.vue |  87 ---------
 frontend/src/shared/platform/platform.vue     | 167 ------------------
 frontend/src/shared/shared-module.js          |   2 -
 51 files changed, 1496 insertions(+), 1174 deletions(-)
 delete mode 100644 frontend/src/modules/member/components/member-identities.vue
 create mode 100644 frontend/src/modules/member/components/view/_aside/_aside-identities-extra.vue
 delete mode 100644 frontend/src/modules/organization/components/organization-identities.vue
 create mode 100644 frontend/src/modules/organization/components/view/_aside/_aside-identities-extra.vue
 create mode 100644 frontend/src/modules/organization/components/view/_aside/_aside-identities.vue
 create mode 100644 frontend/src/modules/widget/components/shared/widget-members-table-row.vue
 create mode 100644 frontend/src/shared/modules/identities/components/identities-horizontal-list-members.vue
 create mode 100644 frontend/src/shared/modules/identities/components/identities-horizontal-list-organizations.vue
 create mode 100644 frontend/src/shared/modules/identities/components/identities-horizontal-list.vue
 create mode 100644 frontend/src/shared/modules/identities/components/identities-vertical-list-members.vue
 create mode 100644 frontend/src/shared/modules/identities/components/identities-vertical-list-organizations.vue
 create mode 100644 frontend/src/shared/modules/identities/components/identities-vertical-list.vue
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/member/index.ts
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/member/list.ts
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/member/profile.ts
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/member/suggestions.ts
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/organization/index.ts
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/organization/list.ts
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/organization/profile.ts
 create mode 100644 frontend/src/shared/modules/identities/config/identitiesOrder/organization/suggestions.ts
 create mode 100644 frontend/src/shared/modules/identities/config/useMemberIdentities.ts
 create mode 100644 frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts
 create mode 100644 frontend/src/shared/modules/platform/components/platform-icon.vue
 create mode 100644 frontend/src/shared/modules/platform/components/platform-img.vue
 create mode 100644 frontend/src/shared/modules/platform/components/platform-svg.vue
 create mode 100644 frontend/src/shared/modules/platform/components/platform.vue
 create mode 100644 frontend/src/shared/modules/platform/types/Platform.ts
 delete mode 100644 frontend/src/shared/platform/platform-list.vue
 delete mode 100644 frontend/src/shared/platform/platform-popover.vue
 delete mode 100644 frontend/src/shared/platform/platform-svg-icon.vue
 delete mode 100644 frontend/src/shared/platform/platform.vue

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index f9297e73ac..088700e33d 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -63,6 +63,7 @@
       },
       "devDependencies": {
         "@tailwindcss/line-clamp": "^0.4.2",
+        "@types/pluralize": "^0.0.33",
         "@typescript-eslint/eslint-plugin": "^5.4.0",
         "@typescript-eslint/parser": "^5.4.0",
         "@vue/compiler-sfc": "^3.2.29",
@@ -2191,6 +2192,12 @@
       "resolved": "https://registry.npmjs.org/@types/object.pick/-/object.pick-1.3.2.tgz",
       "integrity": "sha512-sn7L+qQ6RLPdXRoiaE7bZ/Ek+o4uICma/lBFPyJEKDTPTBP1W8u0c4baj3EiS4DiqLs+Hk+KUGvMVJtAw3ePJg=="
     },
+    "node_modules/@types/pluralize": {
+      "version": "0.0.33",
+      "resolved": "https://registry.npmjs.org/@types/pluralize/-/pluralize-0.0.33.tgz",
+      "integrity": "sha512-JOqsl+ZoCpP4e8TDke9W79FDcSgPAR0l6pixx2JHkhnRjvShyYiAYw2LVsnA7K08Y6DeOnaU6ujmENO4os/cYg==",
+      "dev": true
+    },
     "node_modules/@types/semver": {
       "version": "7.5.0",
       "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.0.tgz",
@@ -13609,6 +13616,12 @@
       "resolved": "https://registry.npmjs.org/@types/object.pick/-/object.pick-1.3.2.tgz",
       "integrity": "sha512-sn7L+qQ6RLPdXRoiaE7bZ/Ek+o4uICma/lBFPyJEKDTPTBP1W8u0c4baj3EiS4DiqLs+Hk+KUGvMVJtAw3ePJg=="
     },
+    "@types/pluralize": {
+      "version": "0.0.33",
+      "resolved": "https://registry.npmjs.org/@types/pluralize/-/pluralize-0.0.33.tgz",
+      "integrity": "sha512-JOqsl+ZoCpP4e8TDke9W79FDcSgPAR0l6pixx2JHkhnRjvShyYiAYw2LVsnA7K08Y6DeOnaU6ujmENO4os/cYg==",
+      "dev": true
+    },
     "@types/semver": {
       "version": "7.5.0",
       "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 37579dc950..bfc354c4eb 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -27,9 +27,9 @@
     "@octokit/core": "^3.6.0",
     "@tiptap/extension-link": "^2.1.12",
     "@tiptap/extension-placeholder": "^2.1.12",
+    "@tiptap/pm": "^2.1.12",
     "@tiptap/starter-kit": "^2.1.12",
     "@tiptap/vue-3": "^2.1.12",
-    "@tiptap/pm": "^2.1.12",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vue/eslint-config-airbnb": "^7.0.0",
     "@vuelidate/core": "^2.0.1",
@@ -74,6 +74,7 @@
   },
   "devDependencies": {
     "@tailwindcss/line-clamp": "^0.4.2",
+    "@types/pluralize": "^0.0.33",
     "@typescript-eslint/eslint-plugin": "^5.4.0",
     "@typescript-eslint/parser": "^5.4.0",
     "@vue/compiler-sfc": "^3.2.29",
diff --git a/frontend/src/assets/scss/buttons.scss b/frontend/src/assets/scss/buttons.scss
index 48dcf7205d..2aa77d2d7f 100644
--- a/frontend/src/assets/scss/buttons.scss
+++ b/frontend/src/assets/scss/buttons.scss
@@ -310,59 +310,6 @@
   @apply -mr-0.5;
 }
 
-// Identities
-.btn {
-  &--twitter,
-  &--twitter:hover {
-    @apply bg-white border border-gray-200;
-  }
-
-  &--discord,
-  &--discord:hover {
-    background-color: rgba(88, 101, 242, 0.15);
-  }
-
-  &--crunchbase,
-  &--crunchbase:hover {
-    background: rgba(20, 106, 255, 0.15);
-  }
-
-  &--hackernews,
-  &--hackernews:hover {
-    background-color: rgba(255, 102, 0, 0.15);
-    color: #ff6600;
-  }
-
-  &--email,
-  &--email:hover,
-  &--phone,
-  &--phone:hover,
-  &--custom-platform,
-  &--custom-platform:hover,
-  &--facebook,
-  &--facebook:hover {
-    @apply leading-none cursor-pointer bg-white text-gray-600 border border-gray-200;
-  }
-
-  &--github,
-  &--github:hover,
-  &--devto,
-  &--devto:hover {
-    @apply bg-gray-100 border border-gray-200;
-  }
-
-  &--slack,
-  &--slack:hover,
-  &--linkedin,
-  &--linkedin:hover,
-  &--stackoverflow,
-  &--stackoverflow:hover,
-  &--git,
-  &--git:hover {
-    @apply bg-white border border-gray-200;
-  }
-}
-
 .el-button {
   --el-button-outline-color: transparent !important;
 }
diff --git a/frontend/src/modules/member/components/form/member-form-identities.vue b/frontend/src/modules/member/components/form/member-form-identities.vue
index c3a80ac1da..b1b858949a 100644
--- a/frontend/src/modules/member/components/form/member-form-identities.vue
+++ b/frontend/src/modules/member/components/form/member-form-identities.vue
@@ -22,7 +22,7 @@
       >
         <div v-if="findPlatform(key)">
           <el-form-item class="h-14 !flex items-center">
-            <div :class="value.imgContainerClass">
+            <div class="h-8 w-8 flex items-center justify-center text-base">
               <img
                 :src="findPlatform(key).image"
                 :alt="findPlatform(key).name"
@@ -89,7 +89,10 @@
       </div>
       <div class="flex items-start justify-between mt-24">
         <div class="flex items-center flex-1">
-          <app-platform platform="email" />
+          <app-platform-icon
+            platform="emails"
+            size="small"
+          />
           <div class="font-medium text-sm ml-3">
             Email address
           </div>
@@ -114,6 +117,7 @@ import {
 } from 'vue';
 import { CrowdIntegrations } from '@/integrations/integrations-config';
 import cloneDeep from 'lodash/cloneDeep';
+import AppPlatformIcon from '@/shared/modules/platform/components/platform-icon.vue';
 
 const emit = defineEmits(['update:modelValue']);
 const props = defineProps({
@@ -176,72 +180,54 @@ const identitiesForm = reactive({
       props.modelValue.username?.devto !== undefined
       || false,
     urlPrefix: 'dev.to/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base bg-gray-100 border border-gray-200',
   },
   discord: {
     enabled:
       props.modelValue.username?.discord !== undefined
       || false,
     urlPrefix: 'discord.com/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--discord cursor-auto hover:cursor-auto',
   },
   github: {
     enabled:
       props.modelValue.username?.github !== undefined
       || false,
     urlPrefix: 'github.com/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base bg-gray-100 border border-gray-200',
   },
   slack: {
     enabled:
       props.modelValue.username?.slack !== undefined
       || false,
     urlPrefix: 'slack.com/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--slack cursor-auto hover:cursor-auto bg-white border border-gray-200',
   },
   twitter: {
     enabled:
       props.modelValue.username?.twitter !== undefined
       || false,
     urlPrefix: 'twitter.com/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--twitter',
   },
   linkedin: {
     enabled:
       props.modelValue.username?.linkedin !== undefined
       || false,
     urlPrefix: 'linkedin.com/in/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--linkedin',
   },
   reddit: {
     enabled:
       props.modelValue.username?.reddit !== undefined
       || false,
     urlPrefix: 'reddit.com/user/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--reddit',
   },
   hackernews: {
     enabled:
       props.modelValue.username?.hackernews !== undefined
       || false,
     urlPrefix: 'news.ycombinator.com/user?id=',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--hackernews',
   },
   stackoverflow: {
     enabled:
       props.modelValue.username?.stackoverflow
         !== undefined || false,
     urlPrefix: 'stackoverflow.com/users/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--stackoverflow',
   },
 });
 
diff --git a/frontend/src/modules/member/components/list/member-list-table.vue b/frontend/src/modules/member/components/list/member-list-table.vue
index b4b9344c4d..89408f3e4a 100644
--- a/frontend/src/modules/member/components/list/member-list-table.vue
+++ b/frontend/src/modules/member/components/list/member-list-table.vue
@@ -161,7 +161,7 @@
               </el-table-column>
 
               <!-- Identities -->
-              <el-table-column label="Identities" width="260">
+              <el-table-column label="Identities" width="280">
                 <template #header>
                   <span>Identities</span>
                   <el-tooltip placement="top">
@@ -180,7 +180,10 @@
                     }"
                     class="block"
                   >
-                    <app-member-identities :username="scope.row.username" :member="scope.row" />
+                    <app-identities-horizontal-list-members
+                      :member="scope.row"
+                      :limit="5"
+                    />
                   </router-link>
                 </template>
               </el-table-column>
@@ -755,9 +758,9 @@ import AppSvg from '@/shared/svg/svg.vue';
 import CrEnrichmentSneakPeakContent from '@/shared/modules/enrichment/components/enrichment-sneak-peak-content.vue';
 import { mapGetters } from '@/shared/vuex/vuex.helpers';
 import Plans from '@/security/plans';
+import AppIdentitiesHorizontalListMembers from '@/shared/modules/identities/components/identities-horizontal-list-members.vue';
 import AppMemberBadge from '../member-badge.vue';
 import AppMemberDropdownContent from '../member-dropdown-content.vue';
-import AppMemberIdentities from '../member-identities.vue';
 import AppMemberReach from '../member-reach.vue';
 import AppMemberEngagementLevel from '../member-engagement-level.vue';
 import AppMemberLastActivity from '../member-last-activity.vue';
diff --git a/frontend/src/modules/member/components/member-display-name.vue b/frontend/src/modules/member/components/member-display-name.vue
index c13caa6df8..0c385bf645 100644
--- a/frontend/src/modules/member/components/member-display-name.vue
+++ b/frontend/src/modules/member/components/member-display-name.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex">
+  <div class="flex flex-wrap">
     <component
       :is="customComponent"
       :class="`member-display-name ${customClass}`"
diff --git a/frontend/src/modules/member/components/member-identities.vue b/frontend/src/modules/member/components/member-identities.vue
deleted file mode 100644
index cabd88b93d..0000000000
--- a/frontend/src/modules/member/components/member-identities.vue
+++ /dev/null
@@ -1,66 +0,0 @@
-<template>
-  <div
-    v-if="hasSocialIdentities"
-    class="flex items-center gap-3"
-  >
-    <div class="flex gap-2 items-center">
-      <div
-        v-for="platform in Object.keys(username)"
-        :key="platform"
-      >
-        <app-platform
-          v-if="username[platform].length"
-          :platform="platform"
-          :username-handles="username[platform]"
-          :track-event-name="platformContent(platform).trackEventName"
-          :track-event-channel="platformContent(platform).trackEventChannel"
-          :tooltip-label="platformContent(platform).tooltipLabel"
-          :as-link="platformContent(platform).asLink"
-          :show-handles-badge="true"
-          :backup-url="member.attributes.url?.[platform]"
-          :attributes="member.attributes"
-        />
-      </div>
-    </div>
-  </div>
-  <div v-else class="text-gray-500">
-    -
-  </div>
-</template>
-
-<script setup>
-import { defineProps, computed } from 'vue';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
-
-const props = defineProps({
-  username: {
-    type: Object,
-    default: () => {},
-  },
-  member: {
-    type: Object,
-    default: () => {},
-  },
-});
-
-const platformContent = (platform) => {
-  const config = CrowdIntegrations.getConfig(platform) || {};
-
-  return {
-    trackEventName: 'Click Contact Contact',
-    trackEventChannel: config.name || platform,
-    tooltipLabel: `${config.name || platform} profile`,
-    asLink: config.showProfileLink,
-  };
-};
-
-const hasSocialIdentities = computed(
-  () => Object.values(props.username).some((k) => k.length > 0),
-);
-</script>
-
-<script>
-export default {
-  name: 'AppMemberIdentities',
-};
-</script>
diff --git a/frontend/src/modules/member/components/suggestions/member-merge-suggestions-details.vue b/frontend/src/modules/member/components/suggestions/member-merge-suggestions-details.vue
index 4c3171ae9c..12190832ae 100644
--- a/frontend/src/modules/member/components/suggestions/member-merge-suggestions-details.vue
+++ b/frontend/src/modules/member/components/suggestions/member-merge-suggestions-details.vue
@@ -149,69 +149,11 @@
         </article>
       </div>
       <div class="pt-5">
-        <div
-          v-for="(usernameHandles, platform) in member.username"
-          :key="platform"
-        >
-          <a
-            v-for="handle in usernameHandles"
-            :key="handle"
-            :href="identityUrl(platform, handle, member.attributes)"
-            class="pb-2 pt-3 flex items-center text-gray-900 hover:text-gray-900"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <img
-              v-if="platformDetails(platform)"
-              :src="platformDetails(platform).image"
-              class="h-5 w-5 mr-4"
-              :alt="platform"
-            >
-            <el-tooltip v-else :content="platform" placement="top">
-              <i class="ri-user-3-fill text-gray-500 text-lg mr-4" />
-            </el-tooltip>
-            <div
-              v-if="
-                platform === 'linkedin'
-                  && handle.includes(
-                    'private-',
-                  )
-              "
-              class="text-gray-900 text-xs"
-            >
-              *********
-              <el-tooltip
-                placement="top"
-                content="Private profile"
-              >
-                <i
-                  class="ri-lock-line text-gray-400 ml-2"
-                />
-              </el-tooltip>
-            </div>
-            <span
-              v-else
-              class="text-xs leading-5"
-              :class="{ 'underline hover:text-brand-500': identityUrl(platform, handle, member.attributes) }"
-              v-html="$sanitize(handle)"
-            />
-          </a>
-        </div>
-        <a
-          v-for="email of member.emails?.filter((e) => e && e.length)"
-          :key="email"
-          :href="`mailto:${email}`"
-          class="pb-2 pt-3 flex items-center text-gray-900"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <span
-            class="ri-mail-line text-lg text-gray-600 mr-4 h-5 flex items-center"
-          />
-          <span class="text-xs leading-5 underline hover:text-brand-500">{{
-            email
-          }}</span>
-        </a>
+        <app-identities-vertical-list-members
+          :member="member"
+          :order="memberOrder.suggestions"
+          :include-emails="true"
+        />
       </div>
     </div>
   </section>
@@ -227,9 +169,10 @@ import AppAvatar from '@/shared/avatar/avatar.vue';
 import AppCommunityEngagementLevel from '@/modules/member/components/member-engagement-level.vue';
 import AppTags from '@/modules/tag/components/tag-list.vue';
 import AppLoading from '@/shared/loading/loading-placeholder.vue';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
 import { MemberPermissions } from '@/modules/member/member-permissions';
 import { mapGetters } from '@/shared/vuex/vuex.helpers';
+import memberOrder from '@/shared/modules/identities/config/identitiesOrder/member';
+import AppIdentitiesVerticalListMembers from '@/shared/modules/identities/components/identities-vertical-list-members.vue';
 
 const props = defineProps({
   member: {
@@ -271,15 +214,6 @@ const bio = ref(null);
 const displayShowMore = ref(null);
 const more = ref(null);
 
-const platformDetails = (platform) => CrowdIntegrations.getConfig(platform);
-const identityUrl = (platform, username, attributes) => {
-  if (platform === 'discord' || platform === 'slack') {
-    return null;
-  }
-
-  return CrowdIntegrations.getConfig(platform)?.url({ username, attributes });
-};
-
 onMounted(() => {
   setTimeout(() => {
     if (!bio.value) {
diff --git a/frontend/src/modules/member/components/view/_aside/_aside-enriched.vue b/frontend/src/modules/member/components/view/_aside/_aside-enriched.vue
index 5c902406a8..dc85c40888 100644
--- a/frontend/src/modules/member/components/view/_aside/_aside-enriched.vue
+++ b/frontend/src/modules/member/components/view/_aside/_aside-enriched.vue
@@ -1,7 +1,9 @@
 <template>
   <div>
+    <el-divider v-if="member.attributes.education" class="!my-8 border-gray-200" />
+
     <!-- Education -->
-    <div v-if="member.attributes.education" class="flex items-center mb-4 mt-10">
+    <div v-if="member.attributes.education" class="flex items-center mb-4">
       <div
         class="font-medium text-black mr-2"
       >
@@ -36,8 +38,10 @@
       </template>
     </app-member-custom-attributes-array-renderer>
 
+    <el-divider v-if="member.attributes.certifications" class="!my-8 border-gray-200" />
+
     <!-- Certifications -->
-    <div v-if="member.attributes.certifications" class="flex items-center mb-4 mt-10">
+    <div v-if="member.attributes.certifications" class="flex items-center mb-4">
       <div
         class="font-medium text-black mr-2"
       >
@@ -73,9 +77,11 @@
     </app-member-custom-attributes-array-renderer>
 
     <!-- Awards -->
+    <el-divider v-if="member.attributes.awards" class="!my-8 border-gray-200" />
+
     <div v-if="member.attributes.awards">
       <div
-        class="flex items-center mb-4 mt-10"
+        class="flex items-center mb-4"
       >
         <div
           class="font-medium text-black mr-2"
diff --git a/frontend/src/modules/member/components/view/_aside/_aside-identities-extra.vue b/frontend/src/modules/member/components/view/_aside/_aside-identities-extra.vue
new file mode 100644
index 0000000000..0cf90a05f4
--- /dev/null
+++ b/frontend/src/modules/member/components/view/_aside/_aside-identities-extra.vue
@@ -0,0 +1,100 @@
+<template>
+  <el-divider v-if="emails.length" class="!my-8 border-gray-200" />
+
+  <div v-if="emails.length" class="flex flex-col px-6">
+    <div class="flex items-center justify-between">
+      <div class="font-medium text-black">
+        Email(s)
+      </div>
+      <el-button
+        class="btn btn-link btn-link--primary"
+        :disabled="isEditLockedForSampleData"
+        @click="emit('openDrawer')"
+      >
+        <i class="ri-pencil-line" /><span>Edit</span>
+      </el-button>
+    </div>
+
+    <div class="flex flex-col gap-2 mt-6">
+      <div
+        v-for="(emailIdentity, index) in emails"
+        :key="emailIdentity.handle"
+      >
+        <el-tooltip
+          placement="top"
+          :content="emailIdentity.handle"
+          :disabled="!showTooltip[index]"
+        >
+          <div
+            class="flex overflow-hidden"
+            @mouseover="handleOnMouseOver(index)"
+            @mouseleave="handleOnMouseLeave(index)"
+          >
+            <a
+              ref="emailRef"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="text-xs text-gray-900 hover:text-brand-500 border border-gray-200 rounded-md py-0.5 px-2 truncate"
+              :href="emailIdentity.link"
+            >
+              {{ emailIdentity.handle }}
+            </a>
+          </div>
+        </el-tooltip>
+      </div>
+
+      <div
+        v-if="Object.keys(emails).length > 5"
+        class="underline cursor-pointer text-gray-500 hover:text-brand-500 text-xs underline-offset-4 mt-5"
+        @click="displayMore = !displayMore"
+      >
+        Show {{ displayMore ? 'less' : 'more' }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  computed, defineProps, ref,
+} from 'vue';
+import { MemberPermissions } from '@/modules/member/member-permissions';
+import { mapGetters } from '@/shared/vuex/vuex.helpers';
+
+const emit = defineEmits(['openDrawer']);
+const props = defineProps<{
+  emails: {
+    handle: string;
+    link: string;
+  }[],
+}>();
+
+const { currentTenant, currentUser } = mapGetters('auth');
+
+const displayMore = ref(false);
+const emailRef = ref<Element[]>([]);
+const showTooltip = ref<boolean[]>([]);
+
+const handleOnMouseOver = (index: number) => {
+  if (!emailRef.value[index]) {
+    showTooltip.value[index] = false;
+  }
+  showTooltip.value[index] = emailRef.value[index].scrollWidth > emailRef.value[index].clientWidth;
+};
+const handleOnMouseLeave = (index: number) => {
+  showTooltip.value[index] = false;
+};
+
+const emails = computed(() => {
+  if (!displayMore.value) {
+    return props.emails.slice(0, 5);
+  }
+
+  return props.emails;
+});
+
+const isEditLockedForSampleData = computed(() => new MemberPermissions(
+  currentTenant.value,
+  currentUser.value,
+).editLockedForSampleData);
+</script>
diff --git a/frontend/src/modules/member/components/view/_aside/_aside-identities.vue b/frontend/src/modules/member/components/view/_aside/_aside-identities.vue
index 82beec5ea4..c3f5f6bae5 100644
--- a/frontend/src/modules/member/components/view/_aside/_aside-identities.vue
+++ b/frontend/src/modules/member/components/view/_aside/_aside-identities.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="px-6">
     <div class="flex items-center justify-between">
       <div class="flex items-center gap-1">
         <div class="font-medium text-black">
@@ -24,113 +24,49 @@
       </el-button>
     </div>
     <div class="-mx-6 mt-6">
-      <div
-        v-for="platform of Object.keys(socialIdentities)"
-        :key="platform"
-        class="px-2"
+      <app-identities-vertical-list-members
+        :member="member"
+        :order="memberOrder.profile"
+        :x-padding="6"
+        :display-show-more="true"
       >
-        <app-platform-list
-          :username-handles="socialIdentities[platform]"
-          :platform="platform"
-          :url="member.attributes?.url?.[platform]"
-          :attributes="member.attributes"
-        />
-      </div>
-    </div>
-    <div
-      v-if="
-        Object.keys(socialIdentities).length
-          && emails.length
-      "
-      class="mt-2"
-    >
-      <el-divider class="border-t-gray-200" />
-      <div class="mt-4">
-        <a
-          v-for="(email, index) of emails"
-          :key="email"
-          class="py-2 px-6 -mx-6 flex justify-between items-center relative hover:bg-gray-50 transition-colors cursor-pointer"
-          :href="`mailto:${email}`"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <el-tooltip
-            placement="top"
-            :content="email"
-            :disabled="!showTooltip[index]"
-          >
-
-            <div
-              class="flex gap-3 items-center overflow-hidden mr-2"
-              @mouseover="handleOnMouseOver(index)"
-              @mouseleave="handleOnMouseLeave(index)"
-            >
-              <app-platform platform="email" />
-              <span ref="emailRef" class="text-gray-900 text-xs truncate">
-                {{ email }}</span>
-            </div>
-          </el-tooltip>
-          <i
-            class="ri-external-link-line text-gray-300"
+        <template #default="{ identities }">
+          <app-aside-identities-extra
+            :emails="identities.getEmails()"
+            @open-drawer="identitiesDrawer = true"
           />
-        </a>
-      </div>
+        </template>
+      </app-identities-vertical-list-members>
     </div>
-    <app-member-manage-identities-drawer
-      v-if="identitiesDrawer"
-      v-model="identitiesDrawer"
-      :member="member"
-    />
   </div>
+
+  <app-member-manage-identities-drawer
+    v-if="identitiesDrawer"
+    v-model="identitiesDrawer"
+    :member="member"
+  />
 </template>
 
-<script setup>
+<script setup lang="ts">
 import {
   computed, defineProps, ref,
 } from 'vue';
 import { MemberPermissions } from '@/modules/member/member-permissions';
 import { mapGetters } from '@/shared/vuex/vuex.helpers';
-import AppPlatformList from '@/shared/platform/platform-list.vue';
+import AppIdentitiesVerticalListMembers from '@/shared/modules/identities/components/identities-vertical-list-members.vue';
+import memberOrder from '@/shared/modules/identities/config/identitiesOrder/member';
+import { Member } from '@/modules/member/types/Member';
 import AppMemberManageIdentitiesDrawer from '../../member-manage-identities-drawer.vue';
+import AppAsideIdentitiesExtra from './_aside-identities-extra.vue';
 
-const props = defineProps({
-  member: {
-    type: Object,
-    default: () => {},
-  },
-});
+defineProps<{
+  member: Member
+}>();
 
 const { currentTenant, currentUser } = mapGetters('auth');
 
 const identitiesDrawer = ref(false);
 
-const emailRef = ref([]);
-const showTooltip = ref([]);
-
-const handleOnMouseOver = (index) => {
-  if (!emailRef.value[index]) {
-    showTooltip.value[index] = false;
-  }
-
-  showTooltip.value[index] = emailRef.value[index].scrollWidth > emailRef.value[index].clientWidth;
-};
-
-const handleOnMouseLeave = (index) => {
-  showTooltip.value[index] = false;
-};
-
-const emails = computed(() => (props.member.emails
-  // Filters out any falsy values (like `null`, `undefined)
-  ? props.member.emails.filter(Boolean)
-  : []));
-
-const socialIdentities = computed(() => {
-  const identities = { ...props.member.username };
-  delete identities.emails;
-
-  return identities;
-});
-
 const isEditLockedForSampleData = computed(() => new MemberPermissions(
   currentTenant.value,
   currentUser.value,
diff --git a/frontend/src/modules/member/components/view/_aside/_aside-organizations.vue b/frontend/src/modules/member/components/view/_aside/_aside-organizations.vue
index 56b118a2a8..a22da44d33 100644
--- a/frontend/src/modules/member/components/view/_aside/_aside-organizations.vue
+++ b/frontend/src/modules/member/components/view/_aside/_aside-organizations.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="mt-10">
+  <div>
     <div class="flex items-center justify-between">
       <div class="flex items-center">
         <div class="font-medium text-black mr-2">
diff --git a/frontend/src/modules/member/components/view/member-view-aside.vue b/frontend/src/modules/member/components/view/member-view-aside.vue
index 94bae2b226..a82d00e635 100644
--- a/frontend/src/modules/member/components/view/member-view-aside.vue
+++ b/frontend/src/modules/member/components/view/member-view-aside.vue
@@ -6,19 +6,31 @@
       :member="member"
     />
 
-    <div class="member-view-aside panel">
+    <div class="member-view-aside panel !px-0">
       <app-member-aside-identities :member="member" />
-      <app-lf-member-aside-organizations
-        class="mt-10"
-        :member="member"
-      />
-      <app-member-aside-custom-attributes
-        :member="member"
-        class="mt-10"
-      />
-      <app-member-aside-enriched
-        :member="member"
-      />
+
+      <el-divider class="!my-8 border-gray-200" />
+
+      <div class="px-6">
+        <app-lf-member-aside-organizations
+          class="mt-10"
+          :member="member"
+        />
+      </div>
+
+      <el-divider class="!my-8 border-gray-200" />
+
+      <div class="px-6">
+        <app-member-aside-custom-attributes
+          :member="member"
+        />
+      </div>
+
+      <div class="px-6">
+        <app-member-aside-enriched
+          :member="member"
+        />
+      </div>
     </div>
   </div>
 </template>
diff --git a/frontend/src/modules/organization/components/form/organization-form-identities.vue b/frontend/src/modules/organization/components/form/organization-form-identities.vue
index 44cd408546..9ebaa48153 100644
--- a/frontend/src/modules/organization/components/form/organization-form-identities.vue
+++ b/frontend/src/modules/organization/components/form/organization-form-identities.vue
@@ -11,7 +11,7 @@
       >
         <div v-if="findPlatform(key)">
           <el-form-item class="h-14 !flex items-center w-full mb-0">
-            <div :class="value.imgContainerClass">
+            <div class="h-8 w-8 flex items-center justify-center text-base">
               <img
                 :src="findPlatform(key).image"
                 :alt="findPlatform(key).name"
@@ -68,7 +68,10 @@
       </div>
       <div class="flex items-start justify-between mt-16">
         <div class="flex items-center">
-          <app-platform platform="email" />
+          <app-platform-icon
+            platform="emails"
+            size="small"
+          />
           <div class="font-medium text-sm ml-3">
             Email address
           </div>
@@ -81,7 +84,10 @@
       </div>
       <div class="flex items-start justify-between mt-16">
         <div class="flex items-center">
-          <app-platform platform="phone" />
+          <app-platform-icon
+            platform="phoneNumbers"
+            size="small"
+          />
           <div class="font-medium text-sm ml-3">
             Phone number
           </div>
@@ -101,6 +107,7 @@ import {
   computed, defineEmits, defineProps, reactive,
 } from 'vue';
 import { CrowdIntegrations } from '@/integrations/integrations-config';
+import AppPlatformIcon from '@/shared/modules/platform/components/platform-icon.vue';
 
 const emit = defineEmits(['update:modelValue']);
 const props = defineProps({
@@ -133,8 +140,6 @@ const identitiesForm = reactive({
       props.modelValue.identities?.some((el) => el.platform === 'github')
       || false,
     urlPrefix: 'github.com/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base bg-gray-100 border border-gray-200',
   },
   linkedin: {
     label: 'LinkedIn',
@@ -142,8 +147,6 @@ const identitiesForm = reactive({
       props.modelValue.identities?.some((el) => el.platform === 'linkedin')
       || false,
     urlPrefix: 'linkedin.com/company/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--linkedin',
   },
   twitter: {
     label: 'X/Twitter',
@@ -151,8 +154,6 @@ const identitiesForm = reactive({
       props.modelValue.identities?.some((el) => el.platform === 'twitter')
       || false,
     urlPrefix: 'twitter.com/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base btn--twitter',
   },
   crunchbase: {
     label: 'Crunchbase',
@@ -160,8 +161,6 @@ const identitiesForm = reactive({
       props.modelValue.identities?.some((el) => el.platform === 'crunchbase')
       || false,
     urlPrefix: 'crunchbase.com/organization/',
-    imgContainerClass:
-      'h-8 w-8 rounded flex items-center justify-center text-base platform-logo--crunchbase',
   },
 });
 
@@ -215,28 +214,6 @@ const removeUsername = (index) => {
 .organization-identities-form {
   .platform {
     @apply flex items-center justify-between w-full mb-3 text-sm flex-wrap gap-2;
-    &-logo {
-      @apply h-8 w-8 rounded flex items-center justify-center text-base;
-      &--github {
-        @apply bg-gray-100 border border-gray-200;
-      }
-
-      &--twitter {
-        background: rgba(29, 155, 240, 0.15);
-      }
-
-      &--crunchbase {
-        background: rgba(20, 106, 255, 0.15);
-      }
-
-      &--linkedin {
-        @apply bg-white border border-gray-200;
-      }
-
-      &--email {
-        @apply leading-none cursor-pointer bg-white text-gray-600 border border-gray-200;
-      }
-    }
   }
 }
 </style>
diff --git a/frontend/src/modules/organization/components/list/organization-list-table.vue b/frontend/src/modules/organization/components/list/organization-list-table.vue
index 456567477b..8618c9a86b 100644
--- a/frontend/src/modules/organization/components/list/organization-list-table.vue
+++ b/frontend/src/modules/organization/components/list/organization-list-table.vue
@@ -195,7 +195,7 @@
                 <!-- Identities -->
                 <el-table-column
                   label="Identities"
-                  width="240"
+                  width="280"
                 >
                   <template #header>
                     <span>Identities</span>
@@ -216,14 +216,10 @@
                       class="block"
                     >
                       <div class="h-full flex items-center">
-                        <app-organization-identities
-                          v-if="scope.row.identities.length > 0"
+                        <app-identities-horizontal-list-organizations
                           :organization="scope.row"
+                          :limit="5"
                         />
-                        <span
-                          v-else
-                          class="text-gray-900"
-                        >-</span>
                       </div>
                     </router-link>
                   </template>
@@ -798,7 +794,7 @@ import AppSvg from '@/shared/svg/svg.vue';
 import CrEnrichmentSneakPeakContent from '@/shared/modules/enrichment/components/enrichment-sneak-peak-content.vue';
 import { mapGetters } from '@/shared/vuex/vuex.helpers';
 import Plans from '@/security/plans';
-import AppOrganizationIdentities from '../organization-identities.vue';
+import AppIdentitiesHorizontalListOrganizations from '@/shared/modules/identities/components/identities-horizontal-list-organizations.vue';
 import AppOrganizationListToolbar from './organization-list-toolbar.vue';
 import AppOrganizationName from '../organization-name.vue';
 import AppOrganizationDropdownContent from '../organization-dropdown-content.vue';
diff --git a/frontend/src/modules/organization/components/organization-identities.vue b/frontend/src/modules/organization/components/organization-identities.vue
deleted file mode 100644
index f7ef378d44..0000000000
--- a/frontend/src/modules/organization/components/organization-identities.vue
+++ /dev/null
@@ -1,106 +0,0 @@
-<template>
-  <div class="flex items-center gap-3">
-    <div
-      v-if="organization.identities?.length > 0"
-      class="flex items-center gap-2"
-    >
-      <div
-        v-for="platform of platforms"
-        :key="platform"
-      >
-        <app-platform
-          :platform="platform"
-          :username-handles="getHandlesByPlatform(platform)"
-          :links="getUrlsByPlatform(platform)"
-          :href="getUrlsByPlatform(platform)[0]"
-          :track-event-name="getPlatformDetails(platform)?.trackEventName"
-          :track-event-channel="getPlatformDetails(platform)?.trackEventChannel"
-          :tooltip-label="getPlatformDetails(platform)?.tooltipLabel"
-          :show-handles-badge="true"
-          :as-link="getUrlsByPlatform(platform).length ? getUrlsByPlatform(platform)[0] : false"
-          custom-platform-icon-class="ri-community-fill"
-        />
-      </div>
-
-      <el-divider
-        v-if="showDivider"
-        direction="vertical"
-        class="border-gray-200 m-0 h-8"
-      />
-
-      <div
-        v-if="!!props.organization.phoneNumbers?.length"
-        class="flex items-center gap-2"
-      >
-        <!-- Phone numbers -->
-        <app-platform
-          v-if="!!organization.phoneNumbers?.length"
-          platform="phone"
-          track-event-name="Click Organization Contact"
-          track-event-channel="Phone"
-          :has-tooltip="true"
-          tooltip-label="Call"
-          :href="
-            organization.phoneNumbers?.length
-              ? `tel:${organization.phoneNumbers[0]}`
-              : null
-          "
-          :as-link="!!organization.phoneNumbers?.length"
-        />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { defineProps, computed } from 'vue';
-import { withHttp } from '@/utils/string';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
-
-const props = defineProps({
-  organization: {
-    type: Object,
-    required: true,
-  },
-});
-
-const platforms = computed(() => [...new Set(props.organization.identities.map((i) => i.platform))]);
-
-const getHandlesByPlatform = (platform) => props.organization.identities
-  .filter((i) => i.platform === platform)
-  .map((i) => (getPlatformDetails(i.platform)?.organization?.handle(i)
-    ?? getPlatformDetails(i.platform)?.name
-    ?? i.name));
-
-const getUrlsByPlatform = (platform) => props.organization.identities
-  .filter((i) => i.platform === platform)
-  .map((i) => getIdentityLink(i));
-
-const showDivider = computed(
-  () => !!props.organization.phoneNumbers?.length
-    && platforms.value,
-);
-
-const getPlatformDetails = (platform) => {
-  const config = CrowdIntegrations.getConfig(platform) || {};
-  return {
-    trackEventName: "Click Organization's Identity",
-    trackEventChannel: config.name || platform,
-    tooltipLabel: `${config.name || platform} profile`,
-    asLink: config.showProfileLink,
-  };
-};
-
-const getIdentityLink = (identity) => {
-  if (identity.url) {
-    return withHttp(identity.url);
-  }
-  return null;
-};
-</script>
-
-<script>
-export default {
-  name: 'AppOrganizationIdentities',
-};
-</script>
diff --git a/frontend/src/modules/organization/components/suggestions/organization-merge-suggestions-details.vue b/frontend/src/modules/organization/components/suggestions/organization-merge-suggestions-details.vue
index a59103262f..b23664e208 100644
--- a/frontend/src/modules/organization/components/suggestions/organization-merge-suggestions-details.vue
+++ b/frontend/src/modules/organization/components/suggestions/organization-merge-suggestions-details.vue
@@ -229,64 +229,12 @@
         </article>
       </div>
       <div class="pt-5">
-        <template v-if="props.organization.identities && props.organization.identities.length > 0">
-          <a
-            v-for="(identity, ii) of props.organization.identities"
-            :key="ii"
-            class="py-2 flex items-center relative text-gray-900 transition-colors"
-            :class="getIdentityLink(identity) ? 'hover:text-brand-500 cursor-pointer' : ''"
-            :href="getIdentityLink(identity)"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <div class="flex gap-3 items-center">
-              <app-platform :platform="identity.platform" />
-              <span class="text-xs">
-                {{ getPlatformDetails(identity.platform)?.organization.handle(identity)
-                  ?? identity.name
-                  ?? getPlatformDetails(identity.platform)?.name
-                  ?? identity.platform }}</span>
-            </div>
-            <i
-              v-if="identity.url"
-              class="ri-external-link-line text-gray-300 pl-2"
-            />
-          </a>
-        </template>
-        <a
-          v-for="email of props.organization.emails"
-          :key="email"
-          class="py-2 flex items-center relative hover:text-brand-500 transition-colors cursor-pointer text-gray-900"
-          :href="`mailto:${email}`"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <div class="flex gap-3 items-center">
-            <app-platform platform="email" />
-            <span class="text-xs">
-              {{ email }}</span>
-          </div>
-          <i
-            class="ri-external-link-line text-gray-300 pl-2"
-          />
-        </a>
-        <a
-          v-for="phone of props.organization.phoneNumbers"
-          :key="phone"
-          class="py-2 flex items-center relative hover:text-brand-500 transition-colors cursor-pointer text-gray-900"
-          :href="`tel:${phone}`"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <div class="flex gap-3 items-center">
-            <app-platform platform="phone" />
-            <span class="text-xs">
-              {{ phone }}</span>
-          </div>
-          <i
-            class="ri-external-link-line text-gray-300 pl-2"
-          />
-        </a>
+        <app-identities-vertical-list-organizations
+          :organization="organization"
+          :include-emails="true"
+          :include-phone-numbers="true"
+          :order="organizationOrder.suggestions"
+        />
       </div>
     </div>
   </section>
@@ -303,8 +251,8 @@ import { mapGetters } from '@/shared/vuex/vuex.helpers';
 import { withHttp } from '@/utils/string';
 import { formatDateToTimeAgo } from '@/utils/date';
 import revenueRange from '@/modules/organization/config/enrichment/revenueRange';
-import AppPlatform from '@/shared/platform/platform.vue';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
+import AppIdentitiesVerticalListOrganizations from '@/shared/modules/identities/components/identities-vertical-list-organizations.vue';
+import organizationOrder from '@/shared/modules/identities/config/identitiesOrder/organization';
 
 const props = defineProps({
   organization: {
@@ -346,15 +294,6 @@ const bio = ref(null);
 const displayShowMore = ref(null);
 const more = ref(null);
 
-const getPlatformDetails = (platform) => CrowdIntegrations.getConfig(platform);
-
-const getIdentityLink = (identity) => {
-  if (identity.url) {
-    return withHttp(identity.url);
-  }
-  return null;
-};
-
 onMounted(() => {
   setTimeout(() => {
     if (!bio.value) {
diff --git a/frontend/src/modules/organization/components/view/_aside/_aside-identities-extra.vue b/frontend/src/modules/organization/components/view/_aside/_aside-identities-extra.vue
new file mode 100644
index 0000000000..9bcd2350e5
--- /dev/null
+++ b/frontend/src/modules/organization/components/view/_aside/_aside-identities-extra.vue
@@ -0,0 +1,155 @@
+<template>
+  <el-divider v-if="emails.length" class="!my-8 border-gray-200" />
+
+  <div v-if="emails.length" class="flex flex-col px-6">
+    <div class="font-medium text-black">
+      Email(s)
+    </div>
+
+    <div class="flex flex-col gap-2 mt-6">
+      <div
+        v-for="(emailIdentity, index) in emails"
+        :key="emailIdentity.handle"
+      >
+        <el-tooltip
+          placement="top"
+          :content="emailIdentity.handle"
+          :disabled="!showEmailTooltip[index]"
+        >
+          <div
+            class="flex overflow-hidden"
+            @mouseover="handleEmailOnMouseOver(index)"
+            @mouseleave="handleEmailOnMouseLeave(index)"
+          >
+            <a
+              ref="emailRef"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="text-xs text-gray-900 border border-gray-200 rounded-md py-0.5 px-2 truncate"
+              :class="{
+                'hover:text-brand-500 cursor:pointer': emailIdentity.link,
+              }"
+              :href="emailIdentity.link"
+            >{{ emailIdentity.handle }}</a>
+          </div>
+        </el-tooltip>
+      </div>
+
+      <div
+        v-if="Object.keys(emails).length > 5"
+        class="underline cursor-pointer text-gray-500 hover:text-brand-500 text-xs underline-offset-4 mt-5"
+        @click="displayEmailsMore = !displayEmailsMore"
+      >
+        Show {{ displayEmailsMore ? 'less' : 'more' }}
+      </div>
+    </div>
+  </div>
+
+  <el-divider v-if="phoneNumbers.length" class="!my-8" />
+
+  <div v-if="phoneNumbers.length" class="flex flex-col px-6">
+    <div class="font-medium text-black">
+      Phone number(s)
+    </div>
+
+    <div class="flex flex-col gap-2 mt-6">
+      <div
+        v-for="(phoneNumberIdentity, index) in phoneNumbers"
+        :key="phoneNumberIdentity.handle"
+      >
+        <el-tooltip
+          placement="top"
+          :content="phoneNumberIdentity.handle"
+          :disabled="!showPhoneNumberTooltip[index]"
+        >
+          <div
+            class="flex overflow-hidden"
+            @mouseover="handlePhoneNumberOnMouseOver(index)"
+            @mouseleave="handlePhoneNumberOnMouseLeave(index)"
+          >
+            <a
+              ref="phoneNumberRef"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="text-xs text-gray-900 border border-gray-200 rounded-md py-0.5 px-2 truncate"
+              :class="{
+                'hover:text-brand-500 cursor:pointer': phoneNumberIdentity.link,
+              }"
+              :href="phoneNumberIdentity.link"
+            >{{ phoneNumberIdentity.handle }}</a>
+          </div>
+        </el-tooltip>
+      </div>
+
+      <div
+        v-if="Object.keys(phoneNumbers).length > 5"
+        class="underline cursor-pointer text-gray-500 hover:text-brand-500 text-xs underline-offset-4 mt-5"
+        @click="displayPhoneNumbersMore = !displayPhoneNumbersMore"
+      >
+        Show {{ displayPhoneNumbersMore ? 'less' : 'more' }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  computed, defineProps, ref,
+} from 'vue';
+
+const props = defineProps<{
+  emails: {
+    handle: string;
+    link: string;
+  }[],
+  phoneNumbers: {
+    handle: string;
+    link: string;
+  }[],
+}>();
+
+const displayEmailsMore = ref(false);
+const displayPhoneNumbersMore = ref(false);
+
+const emailRef = ref<Element[]>([]);
+const phoneNumberRef = ref<Element[]>([]);
+
+const showEmailTooltip = ref<boolean[]>([]);
+const showPhoneNumberTooltip = ref<boolean[]>([]);
+
+const handleEmailOnMouseOver = (index: number) => {
+  if (!emailRef.value[index]) {
+    showEmailTooltip.value[index] = false;
+  }
+  showEmailTooltip.value[index] = emailRef.value[index].scrollWidth > emailRef.value[index].clientWidth;
+};
+const handleEmailOnMouseLeave = (index: number) => {
+  showEmailTooltip.value[index] = false;
+};
+
+const handlePhoneNumberOnMouseOver = (index: number) => {
+  if (!phoneNumberRef.value[index]) {
+    showPhoneNumberTooltip.value[index] = false;
+  }
+  showPhoneNumberTooltip.value[index] = phoneNumberRef.value[index].scrollWidth > phoneNumberRef.value[index].clientWidth;
+};
+const handlePhoneNumberOnMouseLeave = (index: number) => {
+  showPhoneNumberTooltip.value[index] = false;
+};
+
+const emails = computed(() => {
+  if (!displayEmailsMore.value) {
+    return props.emails.slice(0, 5);
+  }
+
+  return props.emails;
+});
+
+const phoneNumbers = computed(() => {
+  if (!displayPhoneNumbersMore.value) {
+    return props.phoneNumbers.slice(0, 5);
+  }
+
+  return props.phoneNumbers;
+});
+</script>
diff --git a/frontend/src/modules/organization/components/view/_aside/_aside-identities.vue b/frontend/src/modules/organization/components/view/_aside/_aside-identities.vue
new file mode 100644
index 0000000000..1554c9adef
--- /dev/null
+++ b/frontend/src/modules/organization/components/view/_aside/_aside-identities.vue
@@ -0,0 +1,63 @@
+<template>
+  <div class="px-6">
+    <div class="flex items-center justify-between">
+      <div class="flex items-center gap-1">
+        <div class="font-medium text-black">
+          Identities
+        </div>
+        <el-tooltip placement="top">
+          <template #content>
+            Identities can be profiles on social platforms, emails,<br>
+            or unique identifiers from internal sources.
+          </template>
+          <span>
+            <i class="ri-information-line text-xs" />
+          </span>
+        </el-tooltip>
+      </div>
+    </div>
+    <div class="-mx-6 mt-6">
+      <app-identities-vertical-list-organizations
+        :organization="organization"
+        :order="organizationOrder.profile"
+        :x-padding="6"
+        :display-show-more="true"
+      >
+        <template #default="{ identities }">
+          <div
+            v-if="!Object.keys(identities.getIdentities())?.length"
+            class="text-sm text-gray-600 px-6 pt-6"
+          >
+            <router-link
+              :to="{
+                name: 'organizationEdit',
+                params: { id: organization.id },
+              }"
+            >
+              Add identities
+            </router-link>
+          </div>
+
+          <app-aside-identities-extra
+            :emails="identities.getEmails()"
+            :phone-numbers="identities.getPhoneNumbers()"
+          />
+        </template>
+      </app-identities-vertical-list-organizations>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  defineProps,
+} from 'vue';
+import AppIdentitiesVerticalListOrganizations from '@/shared/modules/identities/components/identities-vertical-list-organizations.vue';
+import organizationOrder from '@/shared/modules/identities/config/identitiesOrder/organization';
+import { Organization } from '@/modules/organization/types/Organization';
+import AppAsideIdentitiesExtra from './_aside-identities-extra.vue';
+
+defineProps<{
+  organization: Organization
+}>();
+</script>
diff --git a/frontend/src/modules/organization/components/view/organization-view-aside.vue b/frontend/src/modules/organization/components/view/organization-view-aside.vue
index de1135400c..7704853e4b 100644
--- a/frontend/src/modules/organization/components/view/organization-view-aside.vue
+++ b/frontend/src/modules/organization/components/view/organization-view-aside.vue
@@ -1,104 +1,14 @@
 <template>
-  <div class="member-view-aside panel">
+  <div class="member-view-aside panel !px-0">
     <div>
-      <div class="flex items-center justify-between">
-        <div class="flex items-center gap-1">
-          <div class="font-medium text-black">
-            Identities
-          </div>
-          <el-tooltip placement="top">
-            <template #content>
-              Identities can be profiles on social platforms, emails,<br>
-              or unique identifiers from internal sources.
-            </template>
-            <span>
-              <i class="ri-information-line text-xs" />
-            </span>
-          </el-tooltip>
-        </div>
-      </div>
-      <div class="-mx-6 mt-6">
-        <template v-if="props.organization.identities && props.organization.identities.length > 0">
-          <a
-            v-for="(identity, ii) of organization.identities"
-            :key="ii"
-            class="px-6 py-2 flex justify-between items-center relative transition-colors"
-            :class="getIdentityLink(identity) ? ' hover:bg-gray-50 cursor-pointer' : ''"
-            :href="getIdentityLink(identity)"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <div class="flex gap-3 items-center">
-              <app-platform :show-tooltip="true" :platform="identity.platform" custom-platform-icon-class="ri-community-fill" />
-              <span class="text-gray-900 text-xs">
-                {{ getPlatformDetails(identity.platform)?.organization.handle(identity)
-                  ?? identity.name
-                  ?? getPlatformDetails(identity.platform)?.name
-                  ?? identity.platform }}</span>
-            </div>
-            <i
-              v-if="identity.url"
-              class="ri-external-link-line text-gray-300"
-            />
-          </a>
-        </template>
-
-        <el-divider
-          v-if="showDivider"
-          class="border-t-gray-200"
-        />
-        <a
-          v-for="email of organization.emails"
-          :key="email"
-          class="px-6 py-2 flex justify-between items-center relative hover:bg-gray-50 transition-colors cursor-pointer"
-          :href="`mailto:${email}`"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <div class="flex gap-3 items-center">
-            <app-platform platform="email" />
-            <span class="text-gray-900 text-xs">
-              {{ email }}</span>
-          </div>
-          <i
-            class="ri-external-link-line text-gray-300"
-          />
-        </a>
-        <a
-          v-for="phone of organization.phoneNumbers"
-          :key="phone"
-          class="px-6 py-2 flex justify-between items-center relative hover:bg-gray-50 transition-colors cursor-pointer"
-          :href="`tel:${phone}`"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <div class="flex gap-3 items-center">
-            <app-platform platform="phone" />
-            <span class="text-gray-900 text-xs">
-              {{ phone }}</span>
-          </div>
-          <i
-            class="ri-external-link-line text-gray-300"
-          />
-        </a>
-
-        <div
-          v-if="noIdentities"
-          class="text-sm text-gray-600 px-6 pt-2"
-        >
-          <router-link
-            :to="{
-              name: 'organizationEdit',
-              params: { id: organization.id },
-            }"
-          >
-            Add identities
-          </router-link>
-        </div>
-      </div>
+      <app-organization-aside-identities
+        :organization="organization"
+      />
 
       <div v-if="shouldShowAttributes">
-        <div class="mt-10">
+        <el-divider class="!my-8" />
+
+        <div class="mt-10 px-6">
           <div class="font-medium text-black">
             Attributes
           </div>
@@ -115,13 +25,11 @@
 <script setup>
 import { computed } from 'vue';
 import enrichmentAttributes from '@/modules/organization/config/enrichment';
-import { withHttp } from '@/utils/string';
 import { AttributeType } from '@/modules/organization/types/Attributes';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
-import AppPlatform from '@/shared/platform/platform.vue';
 import { mapGetters } from '@/shared/vuex/vuex.helpers';
 import Plans from '@/security/plans';
 import AppOrganizationAsideEnriched from './_aside/_aside-enriched.vue';
+import AppOrganizationAsideIdentities from './_aside/_aside-identities.vue';
 
 const props = defineProps({
   organization: {
@@ -132,28 +40,6 @@ const props = defineProps({
 
 const { currentTenant } = mapGetters('auth');
 
-const showDivider = computed(
-  () => (!!props.organization.emails?.length
-      || !!props.organization.phoneNumbers?.length)
-    && (!!props.organization.github
-      || !!props.organization.linkedin
-      || !!props.organization.twitter
-      || !!props.organization.crunchbase
-      || !!props.organization.facebook),
-);
-
-const noIdentities = computed(() => (
-  !props.organization.github?.url
-    && !props.organization.linkedin?.url
-    && !props.organization.twitter?.url
-    && !props.organization.crunchbase?.url
-    && !props.organization.facebook?.url
-    && (!props.organization.emails
-      || props.organization.emails.length === 0)
-    && (!props.organization.phoneNumbers
-      || props.organization.phoneNumbers.length === 0)
-));
-
 const shouldShowAttributes = computed(() => {
   if (currentTenant.value.plan === Plans.values.essential) {
     return true;
@@ -166,15 +52,6 @@ const shouldShowAttributes = computed(() => {
     return !!props.organization[a.name];
   });
 });
-
-const getPlatformDetails = (platform) => CrowdIntegrations.getConfig(platform);
-
-const getIdentityLink = (identity) => {
-  if (identity.url) {
-    return withHttp(identity.url);
-  }
-  return null;
-};
 </script>
 
 <script>
diff --git a/frontend/src/modules/organization/components/view/organization-view-members.vue b/frontend/src/modules/organization/components/view/organization-view-members.vue
index d7e65ce8dc..2f88472fbd 100644
--- a/frontend/src/modules/organization/components/view/organization-view-members.vue
+++ b/frontend/src/modules/organization/components/view/organization-view-members.vue
@@ -27,9 +27,9 @@
         <div
           v-for="member in members"
           :key="member.id"
-          class="flex flex-wrap items-center justify-between py-5 border-b border-gray-200 last:border-none gap-2"
+          class="py-5 border-b border-gray-200 last:border-none grid grid-cols-7 gap-4"
         >
-          <div class="basis-2/6">
+          <div class="col-span-3">
             <router-link
               class="flex items-center gap-2"
               :to="{
@@ -45,16 +45,16 @@
             </router-link>
           </div>
           <div
-            class="flex items-center justify-between gap-6 basis-3/6 mr-2"
+            class="col-span-1 flex items-center"
           >
-            <div>
-              <app-member-engagement-level
-                :member="member"
-              />
-            </div>
-            <app-member-identities
-              :username="member.username"
+            <app-member-engagement-level
+              :member="member"
+            />
+          </div>
+          <div class="col-span-3 flex items-center justify-end">
+            <app-identities-horizontal-list-members
               :member="member"
+              :limit="5"
             />
           </div>
         </div>
@@ -96,7 +96,7 @@ import debounce from 'lodash/debounce';
 import authAxios from '@/shared/axios/auth-axios';
 import AppMemberEngagementLevel from '@/modules/member/components/member-engagement-level.vue';
 import AppMemberDisplayName from '@/modules/member/components/member-display-name.vue';
-import AppMemberIdentities from '@/modules/member/components/member-identities.vue';
+import AppIdentitiesHorizontalListMembers from '@/shared/modules/identities/components/identities-horizontal-list-members.vue';
 
 const SearchIcon = h(
   'i', // type
diff --git a/frontend/src/modules/organization/types/Organization.ts b/frontend/src/modules/organization/types/Organization.ts
index 4a19658d31..b636ef7bfb 100644
--- a/frontend/src/modules/organization/types/Organization.ts
+++ b/frontend/src/modules/organization/types/Organization.ts
@@ -23,7 +23,11 @@ export interface Organization{
   github: Record<string, string> | null;
   headline: string;
   id: string;
-  identities: string[];
+  identities: {
+    name: string;
+    platform: string;
+    url: string | null;
+  }[];
   importHash: string | null;
   industry: string;
   isTeamOrganization: boolean;
diff --git a/frontend/src/modules/widget/components/member/widget-active-leaderboard-members.vue b/frontend/src/modules/widget/components/member/widget-active-leaderboard-members.vue
index d805dd0c67..969a6be957 100644
--- a/frontend/src/modules/widget/components/member/widget-active-leaderboard-members.vue
+++ b/frontend/src/modules/widget/components/member/widget-active-leaderboard-members.vue
@@ -68,7 +68,7 @@
     :period="selectedPeriod"
     :show-active-days="true"
     :template="MEMBERS_REPORT.nameAsId"
-    size="480px"
+    size="620px"
     @on-export="onExport"
   >
     <template #content="contentProps">
diff --git a/frontend/src/modules/widget/components/shared/widget-members-table-row.vue b/frontend/src/modules/widget/components/shared/widget-members-table-row.vue
new file mode 100644
index 0000000000..1ef3686fc2
--- /dev/null
+++ b/frontend/src/modules/widget/components/shared/widget-members-table-row.vue
@@ -0,0 +1,79 @@
+<template>
+  <div
+    class="flex gap-3 items-center col-span-3"
+  >
+    <app-avatar :entity="member" size="sm" />
+    <div class="flex flex-col">
+      <span class="font-medium text-xs text-gray-900" v-html="$sanitize(member.displayName)" />
+      <span
+        v-if="isDetailedView && showActiveDays"
+        class="text-gray-500 text-2xs italic"
+      >{{
+        pluralize('day', member.activeDaysCount, true)
+      }}
+        active</span>
+      <span
+        v-else-if="
+          member.organizations?.length
+            && !isDetailedView
+        "
+        class="text-gray-500 text-2xs"
+      >{{ member.organizations?.[0]?.name }}</span>
+    </div>
+  </div>
+
+  <div
+    v-if="!isDetailedView"
+    class="text-xs text-gray-500 italic flex items-center col-span-2"
+  >
+    {{ member.activeDaysCount }} days active
+  </div>
+
+  <div
+    class="flex gap-3 items-center col-span-2"
+    :class="{
+      'col-span-3': isDetailedView,
+    }"
+  >
+    <app-identities-horizontal-list-members
+      :member="member"
+      :limit="4"
+      :as-svg="true"
+    />
+  </div>
+
+  <div
+    class="inline-flex items-center justify-end mr-4 invisible group-hover:visible font-medium text-2xs text-gray-600 gap-1 col-start-8"
+  >
+    <span v-if="!isDetailedView">Profile</span>
+    <i class="ri-arrow-right-s-line" />
+  </div>
+</template>
+
+<script setup>
+import { defineProps } from 'vue';
+import pluralize from 'pluralize';
+import AppIdentitiesHorizontalListMembers from '@/shared/modules/identities/components/identities-horizontal-list-members.vue';
+
+defineProps({
+  member: {
+    type: Object,
+    default: () => {},
+    required: true,
+  },
+  isDetailedView: {
+    type: Boolean,
+    default: false,
+  },
+  showActiveDays: {
+    type: Boolean,
+    default: false,
+  },
+});
+</script>
+
+<script>
+export default {
+  name: 'AppWidgetTable',
+};
+</script>
diff --git a/frontend/src/modules/widget/components/shared/widget-members-table.vue b/frontend/src/modules/widget/components/shared/widget-members-table.vue
index 71ee9c22aa..0206937344 100644
--- a/frontend/src/modules/widget/components/shared/widget-members-table.vue
+++ b/frontend/src/modules/widget/components/shared/widget-members-table.vue
@@ -27,72 +27,18 @@
       }"
       @click="onRowClick"
     >
-      <div
-        class="flex gap-3 items-center col-span-3"
-        :class="{
-          'col-span-4': isDetailedView,
-        }"
-      >
-        <app-avatar :entity="member" size="sm" />
-        <div class="flex flex-col">
-          <span class="font-medium text-xs text-gray-900" v-html="$sanitize(member.displayName)" />
-          <span
-            v-if="isDetailedView && showActiveDays"
-            class="text-gray-500 text-2xs italic"
-          >{{
-            pluralize('day', member.activeDaysCount, true)
-          }}
-            active</span>
-          <span
-            v-else-if="
-              member.organizations?.length
-                && !isDetailedView
-            "
-            class="text-gray-500 text-2xs"
-          >{{ member.organizations?.[0]?.name }}</span>
-        </div>
-      </div>
-
-      <div
-        v-if="!isDetailedView"
-        class="text-xs text-gray-500 italic flex items-center col-span-2"
-      >
-        {{ member.activeDaysCount }} days active
-      </div>
-
-      <div class="flex gap-3 items-center">
-        <div
-          v-for="platform in Object.keys(
-            member.username || {},
-          )"
-          :key="platform"
-        >
-          <app-platform-svg-icon
-            :platform="platform"
-            :tooltip-label="tooltipContent(platform)"
-            :as-link="true"
-            :username-handles="member.username[platform]"
-            :show-handles-badge="true"
-            :attributes="member.attributes"
-          />
-        </div>
-      </div>
-
-      <div
-        class="inline-flex items-center justify-end mr-4 invisible group-hover:visible font-medium text-2xs text-gray-600 gap-1 col-start-8"
-      >
-        <span v-if="!isDetailedView">Profile</span>
-        <i class="ri-arrow-right-s-line" />
-      </div>
+      <app-widget-table-row
+        :member="member"
+        :is-detailed-view="isDetailedView"
+        :show-active-days="showActiveDays"
+      />
     </router-link>
   </div>
 </template>
 
 <script setup>
 import { defineProps, defineEmits } from 'vue';
-import pluralize from 'pluralize';
-import AppPlatformSvgIcon from '@/shared/platform/platform-svg-icon.vue';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
+import AppWidgetTableRow from './widget-members-table-row.vue';
 
 const emit = defineEmits(['onRowClick', 'onExportClick']);
 defineProps({
@@ -110,12 +56,6 @@ defineProps({
   },
 });
 
-const tooltipContent = (platform) => {
-  const config = CrowdIntegrations.getConfig(platform) || {};
-
-  return `${config.name || platform} profile`;
-};
-
 const onRowClick = () => {
   emit('onRowClick');
 };
diff --git a/frontend/src/shared/modules/identities/components/identities-horizontal-list-members.vue b/frontend/src/shared/modules/identities/components/identities-horizontal-list-members.vue
new file mode 100644
index 0000000000..c27a8ee6f0
--- /dev/null
+++ b/frontend/src/shared/modules/identities/components/identities-horizontal-list-members.vue
@@ -0,0 +1,32 @@
+<template>
+  <app-identities-horizontal-list
+    :identities="identities.getIdentities()"
+    :limit="limit"
+    :as-svg="asSvg"
+  />
+</template>
+
+<script setup lang="ts">
+import { defineProps, computed } from 'vue';
+import useMemberIdentities from '@/shared/modules/identities/config/useMemberIdentities';
+import memberOrder from '@/shared/modules/identities/config/identitiesOrder/member';
+import { Member } from '@/modules/member/types/Member';
+import AppIdentitiesHorizontalList from '@/shared/modules/identities/components/identities-horizontal-list.vue';
+
+const props = defineProps<{
+  member: Member;
+  limit?: number;
+  asSvg?: boolean;
+}>();
+
+const identities = computed(() => useMemberIdentities({
+  member: props.member,
+  order: memberOrder.list,
+}));
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppIdentitiesHorizontalListMembers',
+};
+</script>
diff --git a/frontend/src/shared/modules/identities/components/identities-horizontal-list-organizations.vue b/frontend/src/shared/modules/identities/components/identities-horizontal-list-organizations.vue
new file mode 100644
index 0000000000..61684cd604
--- /dev/null
+++ b/frontend/src/shared/modules/identities/components/identities-horizontal-list-organizations.vue
@@ -0,0 +1,32 @@
+<template>
+  <app-identities-horizontal-list
+    :identities="identities.getIdentities()"
+    :limit="limit"
+    :as-svg="asSvg"
+  />
+</template>
+
+<script setup lang="ts">
+import { defineProps, computed } from 'vue';
+import useOrganizationIdentities from '@/shared/modules/identities/config/useOrganizationIdentities';
+import organizationOrder from '@/shared/modules/identities/config/identitiesOrder/organization';
+import AppIdentitiesHorizontalList from '@/shared/modules/identities/components/identities-horizontal-list.vue';
+import { Organization } from '@/modules/organization/types/Organization';
+
+const props = defineProps<{
+  organization: Organization;
+  limit?: number;
+  asSvg?: boolean;
+}>();
+
+const identities = computed(() => useOrganizationIdentities({
+  organization: props.organization,
+  order: organizationOrder.list,
+}));
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppIdentitiesHorizontalListOrganizations',
+};
+</script>
diff --git a/frontend/src/shared/modules/identities/components/identities-horizontal-list.vue b/frontend/src/shared/modules/identities/components/identities-horizontal-list.vue
new file mode 100644
index 0000000000..b94d1c6d3b
--- /dev/null
+++ b/frontend/src/shared/modules/identities/components/identities-horizontal-list.vue
@@ -0,0 +1,112 @@
+<template>
+  <el-popover
+    v-if="hasIdentities"
+    trigger="hover"
+    placement="top"
+    width="20rem"
+    popper-class="!px-0 !py-4 !shadow !rounded-lg"
+  >
+    <template #reference>
+      <div
+        class="flex gap-3 items-center bg-white border border-gray-200 hover:bg-gray-50 rounded-full h-8 px-3 relative cursor-auto group"
+      >
+        <div class="text-xs text-gray-500 font-medium">
+          {{ pluralize("identity", parsedIdentities.identitiesLength, true) }}
+        </div>
+        <div
+          v-for="[platform, value] of Object.entries(parsedIdentities.visible)"
+          :key="platform"
+        >
+          <app-platform
+            v-if="value.length"
+            :platform="platform"
+            :identities="value"
+            :as-svg="asSvg"
+          />
+        </div>
+        <div
+          v-if="
+            parsedIdentities.platformsLength
+              >= (limit || parsedIdentities.platformsLength)
+          "
+          class="absolute right-2.5 w-10 h-5 bg-gradient-to-r from-transparent to-white group-hover:to-gray-50"
+        />
+      </div>
+    </template>
+
+    <div class="overflow-y-auto overflow-x-hidden max-h-72">
+      <div class="text-xs text-gray-400 font-semibold mb-3 px-5">
+        Identities
+      </div>
+      <app-identities-vertical-list
+        :identities="identities"
+        :x-padding="5"
+      />
+    </div>
+  </el-popover>
+  <div v-else class="text-gray-500">
+    -
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineProps, computed } from 'vue';
+import AppPlatform from '@/shared/modules/platform/components/platform.vue';
+import AppIdentitiesVerticalList from '@/shared/modules/identities/components/identities-vertical-list.vue';
+import pluralize from 'pluralize';
+
+const props = defineProps<{
+  identities: {
+    [key: string]: {
+      handle: string;
+      link: string;
+    }[];
+  };
+  limit?: number;
+  asSvg?: boolean;
+}>();
+
+const parsedIdentities = computed(() => {
+  const platformKeys = Object.keys(props.identities);
+  const visibleKeys = Object.keys(props.identities).slice(
+    0,
+    props.limit ?? platformKeys.length,
+  );
+
+  const visible = visibleKeys.reduce(
+    (
+      acc: {
+        [key: string]: {
+          handle: string;
+          link: string;
+        }[];
+      },
+      k,
+    ) => {
+      acc[k] = props.identities[k];
+
+      return acc;
+    },
+    {},
+  );
+
+  return {
+    visible,
+    platformsLength: platformKeys.length,
+    identitiesLength: platformKeys.reduce(
+      (acc, p) => acc + props.identities[p].length,
+      0,
+    ),
+  };
+});
+
+const hasIdentities = computed(
+  () => Object.keys(props.identities).length,
+);
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppIdentitiesHorizontalList',
+};
+</script>
diff --git a/frontend/src/shared/modules/identities/components/identities-vertical-list-members.vue b/frontend/src/shared/modules/identities/components/identities-vertical-list-members.vue
new file mode 100644
index 0000000000..f9d401eea4
--- /dev/null
+++ b/frontend/src/shared/modules/identities/components/identities-vertical-list-members.vue
@@ -0,0 +1,39 @@
+<template>
+  <app-identities-vertical-list
+    :identities="{
+      ...identities.getIdentities(),
+      ...(includeEmails ? { emails: identities.getEmails() } : {}),
+    }"
+    :x-padding="xPadding"
+    :display-show-more="displayShowMore"
+  />
+
+  <slot :identities="identities" />
+</template>
+
+<script setup lang="ts">
+import { Member } from '@/modules/member/types/Member';
+import useMemberIdentities from '@/shared/modules/identities/config/useMemberIdentities';
+import AppIdentitiesVerticalList from '@/shared/modules/identities/components/identities-vertical-list.vue';
+import { computed } from 'vue';
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+const props = defineProps<{
+  member: Member;
+  xPadding?: number;
+  displayShowMore?: boolean;
+  includeEmails?: boolean;
+  order: Platform[]
+}>();
+
+const identities = computed(() => useMemberIdentities({
+  member: props.member,
+  order: props.order,
+}));
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppIdentitiesVerticalListMembers',
+};
+</script>
diff --git a/frontend/src/shared/modules/identities/components/identities-vertical-list-organizations.vue b/frontend/src/shared/modules/identities/components/identities-vertical-list-organizations.vue
new file mode 100644
index 0000000000..c8df99e6a4
--- /dev/null
+++ b/frontend/src/shared/modules/identities/components/identities-vertical-list-organizations.vue
@@ -0,0 +1,41 @@
+<template>
+  <app-identities-vertical-list
+    :identities="{
+      ...identities.getIdentities(),
+      ...(includeEmails ? { emails: identities.getEmails() } : {}),
+      ...(includePhoneNumbers ? { phoneNumbers: identities.getPhoneNumbers() } : {}),
+    }"
+    :x-padding="xPadding"
+    :display-show-more="displayShowMore"
+  />
+
+  <slot :identities="identities" />
+</template>
+
+<script setup lang="ts">
+import useOrganizationIdentities from '@/shared/modules/identities/config/useOrganizationIdentities';
+import AppIdentitiesVerticalList from '@/shared/modules/identities/components/identities-vertical-list.vue';
+import { computed } from 'vue';
+import { Platform } from '@/shared/modules/platform/types/Platform';
+import { Organization } from '@/modules/organization/types/Organization';
+
+const props = defineProps<{
+  organization: Organization;
+  order: Platform[]
+  xPadding?: number;
+  displayShowMore?: boolean;
+  includeEmails?: boolean;
+  includePhoneNumbers?: boolean;
+}>();
+
+const identities = computed(() => useOrganizationIdentities({
+  organization: props.organization,
+  order: props.order,
+}));
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppIdentitiesVerticalListOrganizations',
+};
+</script>
diff --git a/frontend/src/shared/modules/identities/components/identities-vertical-list.vue b/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
new file mode 100644
index 0000000000..714a756723
--- /dev/null
+++ b/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
@@ -0,0 +1,116 @@
+<template>
+  <div class="flex flex-col gap-5">
+    <div
+      v-for="[platform, value] of Object.entries(slicedIdentities)"
+      :key="platform"
+    >
+      <div>
+        <div
+          class="flex gap-3 items-start relative min-h-5"
+          :class="{
+            [`px-${xPadding}`]: !!xPadding,
+          }"
+        >
+          <app-platform
+            :platform="platform"
+            :as-link="false"
+            size="large"
+            :show-platform-tooltip="true"
+          />
+
+          <div class="flex flex-wrap items-center gap-2">
+            <div class="flex flex-wrap items-center">
+              <template v-for="({ handle, link }, vi) of value" :key="handle">
+                <div
+                  v-if="platform === 'linkedin' && handle.includes('private-')"
+                  class="text-gray-900 text-xs"
+                >
+                  <span>*********</span>
+                  <el-tooltip placement="top" content="Private profile">
+                    <i class="ri-lock-line text-gray-400" />
+                  </el-tooltip>
+                </div>
+
+                <span v-else class="flex items-center break-words">
+                  <component
+                    :is="link ? 'a' : 'span'"
+                    :href="link"
+                    class="text-gray-900 text-xs font-medium leading-5 h-5"
+                    :class="{
+                      'underline decoration-dashed decoration-gray-400 underline-offset-4 ':
+                        link,
+                      'hover:decoration-gray-900 hover:cursor-pointer hover:!text-gray-900':
+                        link,
+                    }"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                  >
+                    {{ handle }}
+                  </component>
+                </span>
+
+                <span
+                  v-if="vi !== value.length - 1"
+                  class="font-medium"
+                >・</span>
+              </template>
+            </div>
+            <span
+              v-if="isCustomPlatform(platform)"
+              class="text-xs text-gray-400"
+            >{{ platform }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div
+      v-if="displayShowMore && Object.keys(identities).length > 5"
+      class="underline cursor-pointer text-gray-500 hover:text-brand-500 text-xs underline-offset-4"
+      :class="{
+        [`px-${xPadding}`]: !!xPadding,
+      }"
+      @click="displayMore = !displayMore"
+    >
+      Show {{ displayMore ? "less" : "more" }}
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import AppPlatform from '@/shared/modules/platform/components/platform.vue';
+import { CrowdIntegrations } from '@/integrations/integrations-config';
+import { computed, ref } from 'vue';
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+const props = defineProps<{
+  identities: {
+    [key: string]: {
+      handle: string;
+      link: string;
+    }[];
+  };
+  xPadding?: number;
+  displayShowMore?: boolean;
+}>();
+
+const displayMore = ref(false);
+
+const slicedIdentities = computed(() => {
+  if (!displayMore.value && props.displayShowMore) {
+    return Object.fromEntries(Object.entries(props.identities).slice(0, 5));
+  }
+
+  return props.identities;
+});
+
+const isCustomPlatform = (platform: string) => platform !== Platform.EMAILS
+  && platform !== Platform.PHONE_NUMBERS
+  && !CrowdIntegrations.getConfig(platform)?.name;
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppIdentitiesVerticalList',
+};
+</script>
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/member/index.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/member/index.ts
new file mode 100644
index 0000000000..f02d97fd77
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/member/index.ts
@@ -0,0 +1,9 @@
+import list from './list';
+import profile from './profile';
+import suggestions from './suggestions';
+
+export default {
+  list,
+  profile,
+  suggestions,
+};
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/member/list.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/member/list.ts
new file mode 100644
index 0000000000..83795b6d91
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/member/list.ts
@@ -0,0 +1,18 @@
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default [
+  Platform.GITHUB,
+  Platform.DISCORD,
+  Platform.HACKER_NEWS,
+  Platform.LINKEDIN,
+  Platform.TWITTER,
+  Platform.SLACK,
+  Platform.DEVTO,
+  Platform.REDDIT,
+  Platform.STACK_OVERFLOW,
+  Platform.DISCOURSE,
+  Platform.HUBSPOT,
+  Platform.GIT,
+  Platform.GROUPS_IO,
+  Platform.CUSTOM,
+];
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/member/profile.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/member/profile.ts
new file mode 100644
index 0000000000..83795b6d91
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/member/profile.ts
@@ -0,0 +1,18 @@
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default [
+  Platform.GITHUB,
+  Platform.DISCORD,
+  Platform.HACKER_NEWS,
+  Platform.LINKEDIN,
+  Platform.TWITTER,
+  Platform.SLACK,
+  Platform.DEVTO,
+  Platform.REDDIT,
+  Platform.STACK_OVERFLOW,
+  Platform.DISCOURSE,
+  Platform.HUBSPOT,
+  Platform.GIT,
+  Platform.GROUPS_IO,
+  Platform.CUSTOM,
+];
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/member/suggestions.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/member/suggestions.ts
new file mode 100644
index 0000000000..83795b6d91
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/member/suggestions.ts
@@ -0,0 +1,18 @@
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default [
+  Platform.GITHUB,
+  Platform.DISCORD,
+  Platform.HACKER_NEWS,
+  Platform.LINKEDIN,
+  Platform.TWITTER,
+  Platform.SLACK,
+  Platform.DEVTO,
+  Platform.REDDIT,
+  Platform.STACK_OVERFLOW,
+  Platform.DISCOURSE,
+  Platform.HUBSPOT,
+  Platform.GIT,
+  Platform.GROUPS_IO,
+  Platform.CUSTOM,
+];
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/organization/index.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/index.ts
new file mode 100644
index 0000000000..f02d97fd77
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/index.ts
@@ -0,0 +1,9 @@
+import list from './list';
+import profile from './profile';
+import suggestions from './suggestions';
+
+export default {
+  list,
+  profile,
+  suggestions,
+};
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/organization/list.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/list.ts
new file mode 100644
index 0000000000..1aceb5547e
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/list.ts
@@ -0,0 +1,10 @@
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default [
+  Platform.GITHUB,
+  Platform.LINKEDIN,
+  Platform.TWITTER,
+  Platform.CRUNCHBASE,
+  Platform.HUBSPOT,
+  Platform.CUSTOM,
+];
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/organization/profile.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/profile.ts
new file mode 100644
index 0000000000..1aceb5547e
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/profile.ts
@@ -0,0 +1,10 @@
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default [
+  Platform.GITHUB,
+  Platform.LINKEDIN,
+  Platform.TWITTER,
+  Platform.CRUNCHBASE,
+  Platform.HUBSPOT,
+  Platform.CUSTOM,
+];
diff --git a/frontend/src/shared/modules/identities/config/identitiesOrder/organization/suggestions.ts b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/suggestions.ts
new file mode 100644
index 0000000000..1aceb5547e
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/identitiesOrder/organization/suggestions.ts
@@ -0,0 +1,10 @@
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default [
+  Platform.GITHUB,
+  Platform.LINKEDIN,
+  Platform.TWITTER,
+  Platform.CRUNCHBASE,
+  Platform.HUBSPOT,
+  Platform.CUSTOM,
+];
diff --git a/frontend/src/shared/modules/identities/config/useMemberIdentities.ts b/frontend/src/shared/modules/identities/config/useMemberIdentities.ts
new file mode 100644
index 0000000000..decadaee87
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/useMemberIdentities.ts
@@ -0,0 +1,136 @@
+import { CrowdIntegrations } from '@/integrations/integrations-config';
+import { Member } from '@/modules/member/types/Member';
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default ({
+  member,
+  order,
+}: {
+  member: Partial<Member>;
+  order: Platform[];
+}) => {
+  const { username = {}, attributes = {}, emails = [] } = member || {};
+
+  const getIdentityHandles = (platform: string) => {
+    if (platform === Platform.CUSTOM) {
+      const customPlatforms = Object.keys(username).filter(
+        (p) => (!order.includes(p) || p === Platform.CUSTOM)
+          && p !== Platform.EMAIL
+          && p !== Platform.EMAILS,
+      );
+
+      return customPlatforms.flatMap((p) => username[p].map((u) => ({
+        platform: p,
+        url: null,
+        name: u,
+      })));
+    }
+
+    return username[platform]
+      ? username[platform].map((u) => ({
+        platform,
+        url: null,
+        name: u,
+      }))
+      : [];
+  };
+
+  const getIdentityLink = (identity: {
+    platform: string;
+    url: string;
+    name: string;
+  }, platform: string) => {
+    if (!CrowdIntegrations.getConfig(platform)?.showProfileLink) {
+      return null;
+    }
+
+    return (
+      identity.url
+      ?? CrowdIntegrations.getConfig(platform)?.url({
+        username: identity.name,
+        attributes,
+      })
+      ?? attributes?.url?.[platform]
+    );
+  };
+
+  const getIdentities = (): {
+    [key: string]: {
+      handle: string;
+      link: string;
+    }[];
+  } => order.reduce((acc, platform) => {
+    const handles = getIdentityHandles(platform);
+
+    if (platform === Platform.CUSTOM && handles.length) {
+      const sortedCustomIdentities = handles.sort((a, b) => {
+        const platformComparison = a.platform.localeCompare(b.platform);
+
+        if (platformComparison === 0) {
+          // If platforms are equal, sort by name
+          return a.name.localeCompare(b.name);
+        }
+
+        return platformComparison; // Otherwise, sort by platform
+      });
+
+      sortedCustomIdentities.forEach((identity) => {
+        if (acc[identity.platform]?.length) {
+          acc[identity.platform].push({
+            handle: identity.name,
+            link: getIdentityLink(identity, platform),
+          });
+        } else {
+          acc[identity.platform] = [
+            {
+              handle: identity.name,
+              link: getIdentityLink(identity, platform),
+            },
+          ];
+        }
+      });
+    } else {
+      const platformHandlesValues = handles.map((identity) => ({
+        handle: identity.name,
+        link: getIdentityLink(identity, platform),
+      }));
+
+      if (platformHandlesValues.length) {
+        acc[platform] = platformHandlesValues;
+      }
+    }
+
+    return acc;
+  }, {});
+
+  const getEmails = (): {
+    handle: string;
+    link: string;
+  }[] => {
+    const rootEmails = (emails || []).map((e) => ({
+      link: `mailto:${e}`,
+      handle: e,
+    }));
+
+    const usernameEmail = username.email
+      ? username.email.map((u) => ({
+        link: null,
+        handle: u,
+      }))
+      : [];
+
+    const usernameEmails = username.emails
+      ? username.emails.map((u) => ({
+        link: `mailto:${e}`,
+        handle: u,
+      }))
+      : [];
+
+    return [...rootEmails, ...usernameEmail, ...usernameEmails];
+  };
+
+  return {
+    getIdentities,
+    getEmails,
+  };
+};
diff --git a/frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts b/frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts
new file mode 100644
index 0000000000..1f25cff373
--- /dev/null
+++ b/frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts
@@ -0,0 +1,132 @@
+import { CrowdIntegrations } from '@/integrations/integrations-config';
+import { withHttp } from '@/utils/string';
+import { Organization } from '@/modules/organization/types/Organization';
+import { Platform } from '@/shared/modules/platform/types/Platform';
+
+export default ({
+  organization,
+  order,
+}: {
+  organization: Partial<Organization>;
+  order: Platform[];
+}) => {
+  const {
+    identities = [],
+    emails = [],
+    phoneNumbers = [],
+  } = organization || {};
+
+  const getIdentityHandles = (platform: string) => {
+    const parsedIdentities = identities?.length ? identities : [];
+
+    if (platform === Platform.CUSTOM) {
+      const customPlatforms = parsedIdentities.filter(
+        (i) => (!order.includes(i.platform) || i.platform === Platform.CUSTOM)
+          && i.platform !== Platform.EMAIL
+          && i.platform !== Platform.EMAILS,
+      );
+
+      return customPlatforms;
+    }
+
+    return parsedIdentities.filter((i) => i.platform === platform) || [];
+  };
+
+  const getIdentities = (): {
+    [key: string]: {
+      handle: string;
+      link: string;
+    }[];
+  } => order.reduce((acc, p) => {
+    const handles = getIdentityHandles(p);
+
+    if (
+      (p === Platform.CUSTOM || p === Platform.PHONE_NUMBERS)
+        && handles.length
+    ) {
+      const sortedCustomIdentities = handles.sort((a, b) => {
+        const platformComparison = a.platform.localeCompare(b.platform);
+
+        if (platformComparison === 0) {
+          // If platforms are equal, sort by name
+          return a.name.localeCompare(b.name);
+        }
+
+        return platformComparison; // Otherwise, sort by platform
+      });
+
+      sortedCustomIdentities.forEach((i) => {
+        if (acc[i.platform]?.length) {
+          acc[i.platform].push({
+            handle: i.name,
+            link: i.url ? withHttp(i.url) : null,
+          });
+        } else {
+          acc[i.platform] = [
+            {
+              handle: i.name,
+              link: i.url ? withHttp(i.url) : null,
+            },
+          ];
+        }
+      });
+    } else {
+      const handlesValues = handles.map((i) => ({
+        handle:
+            CrowdIntegrations.getConfig(i.platform)?.organization?.handle(i)
+            ?? i.name
+            ?? CrowdIntegrations.getConfig(i.platform)?.name
+            ?? i.platform,
+        link: i.url ? withHttp(i.url) : null,
+      }));
+
+      if (handlesValues.length) {
+        acc[p] = handlesValues;
+      }
+    }
+
+    return acc;
+  }, {});
+
+  const getEmails = (): {
+    handle: string;
+    link: string;
+  }[] => {
+    const parsedIdentities = identities?.length ? identities : [];
+
+    const rootEmails = (emails || []).map((e) => ({
+      link: `mailto:${e}`,
+      handle: e,
+    }));
+
+    const identitiesEmails = parsedIdentities
+      .filter((i) => i.platform === 'emails')
+      .map((i) => ({
+        link: i.url ? `mailto:${i.url}` : null,
+        handle: i.name,
+      }));
+
+    const identitiesEmail = parsedIdentities
+      .filter((i) => i.platform === 'email')
+      .map((i) => ({
+        link: i.url ? `mailto:${i.url}` : null,
+        handle: i.name,
+      }));
+
+    return [...rootEmails, ...identitiesEmails, ...identitiesEmail];
+  };
+
+  const getPhoneNumbers = (): {
+    handle: string;
+    link: string;
+  }[] => (phoneNumbers || []).map((p) => ({
+    link: `tel:${p}`,
+    handle: p,
+  }));
+
+  return {
+    getIdentities,
+    getEmails,
+    getPhoneNumbers,
+  };
+};
diff --git a/frontend/src/shared/modules/platform/components/platform-icon.vue b/frontend/src/shared/modules/platform/components/platform-icon.vue
new file mode 100644
index 0000000000..d46d93ff03
--- /dev/null
+++ b/frontend/src/shared/modules/platform/components/platform-icon.vue
@@ -0,0 +1,38 @@
+<template>
+  <i
+    class="text-gray-900"
+    :class="{
+      [iconClass]: true,
+      [icons[platform]]: !!icons[platform],
+      'ri-fingerprint-line': !icons[platform],
+    }"
+  />
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue';
+
+const props = defineProps<{
+  platform: string;
+  size: string;
+}>();
+
+const icons: { [key: string]: string } = {
+  emails: 'ri-mail-line',
+  phoneNumbers: 'ri-phone-fill',
+};
+
+const iconClass = computed(() => {
+  if (props.size === 'large') {
+    return 'text-lg leading-5';
+  }
+
+  return 'text-base leading-4';
+});
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppPlatformIcon',
+};
+</script>
diff --git a/frontend/src/shared/modules/platform/components/platform-img.vue b/frontend/src/shared/modules/platform/components/platform-img.vue
new file mode 100644
index 0000000000..3da8906d77
--- /dev/null
+++ b/frontend/src/shared/modules/platform/components/platform-img.vue
@@ -0,0 +1,33 @@
+<template>
+  <img
+    :src="platformConfig.image"
+    :alt="platformConfig.name"
+    :class="imgClass"
+  />
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue';
+import { CrowdIntegrations } from '@/integrations/integrations-config';
+
+const props = defineProps<{
+    platform: string;
+    size: string;
+}>();
+
+const platformConfig = computed(() => CrowdIntegrations.getConfig(props.platform));
+
+const imgClass = computed(() => {
+  if (props.size === 'large') {
+    return 'max-h-[20px]';
+  }
+
+  return 'max-h-[16px]';
+});
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppPlatformImg',
+};
+</script>
diff --git a/frontend/src/shared/modules/platform/components/platform-svg.vue b/frontend/src/shared/modules/platform/components/platform-svg.vue
new file mode 100644
index 0000000000..cd57246bad
--- /dev/null
+++ b/frontend/src/shared/modules/platform/components/platform-svg.vue
@@ -0,0 +1,31 @@
+<template>
+  <app-svg
+    :class="svgClass"
+    color="#D1D5DB"
+    :name="platform"
+  />
+</template>
+
+<script setup lang="ts">
+import AppSvg from '@/shared/svg/svg.vue';
+import { computed } from 'vue';
+
+const props = defineProps<{
+    platform: string;
+    size: string;
+}>();
+
+const svgClass = computed(() => {
+  if (props.size === 'large') {
+    return 'max-w-[20px] h-5';
+  }
+
+  return 'max-w-[16px] h-4';
+});
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppPlatformSvg',
+};
+</script>
diff --git a/frontend/src/shared/modules/platform/components/platform.vue b/frontend/src/shared/modules/platform/components/platform.vue
new file mode 100644
index 0000000000..a656b69a9b
--- /dev/null
+++ b/frontend/src/shared/modules/platform/components/platform.vue
@@ -0,0 +1,87 @@
+<template>
+  <div class="relative flex items-center justify-center">
+    <el-tooltip
+      :content="platformName"
+      placement="top"
+      :disabled="!platformName || !showPlatformTooltip"
+    >
+      <component
+        :is="asLink ? 'a' : 'span'"
+        :href="asLink ? identities[0].link ?? null : null"
+        target="_blank"
+        rel="noopener noreferrer"
+        class="btn flex items-center justify-center"
+        :class="{
+          'hover:cursor-auto': !asLink,
+          'hover:cursor-pointer': asLink,
+          'min-h-4 min-w-[16px] h-4 w-4': size === 'small',
+          'min-h-5 min-w-[20px] h-5 w-5': size !== 'small',
+        }"
+        @click.stop
+      >
+        <app-platform-svg v-if="asSvg" :platform="platform" :size="size" />
+        <app-platform-img
+          v-else-if="defaultPlatformConfig"
+          :platform="platform"
+          :size="size"
+        />
+        <app-platform-icon v-else :platform="platform" :size="size" />
+      </component>
+    </el-tooltip>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineProps, computed } from 'vue';
+import { CrowdIntegrations } from '@/integrations/integrations-config';
+import AppPlatformIcon from '@/shared/modules/platform/components/platform-icon.vue';
+import AppPlatformSvg from '@/shared/modules/platform/components/platform-svg.vue';
+import AppPlatformImg from '@/shared/modules/platform/components/platform-img.vue';
+
+const props = withDefaults(
+  defineProps<{
+    platform: string;
+    size: string;
+    identities?: {
+      handle: string;
+      link: string;
+    }[];
+    asLink?: boolean;
+    asSvg?: boolean;
+    showPlatformTooltip?: boolean;
+  }>(),
+  {
+    identities: () => [],
+    asSvg: false,
+    size: 'small',
+    asLink: true,
+    showPlatformTooltip: false,
+  },
+);
+
+const defaultPlatformConfig = computed(() => CrowdIntegrations.getConfig(props.platform));
+
+const platformConfig = computed(
+  () => CrowdIntegrations.getConfig(props.platform) || {},
+);
+const platformName = computed(() => platformConfig.value.name || 'Custom');
+</script>
+
+<script lang="ts">
+export default {
+  name: 'AppPlatform',
+};
+</script>
+
+<style lang="scss">
+// Custom tooltip for external links
+.custom-identity-tooltip {
+  span:first-child {
+    @apply flex gap-1.5 items-center;
+  }
+}
+
+a[href]:hover {
+  opacity: 1;
+}
+</style>
diff --git a/frontend/src/shared/modules/platform/types/Platform.ts b/frontend/src/shared/modules/platform/types/Platform.ts
new file mode 100644
index 0000000000..e4469d4012
--- /dev/null
+++ b/frontend/src/shared/modules/platform/types/Platform.ts
@@ -0,0 +1,20 @@
+export enum Platform {
+    GITHUB = 'github',
+    DISCORD = 'discord',
+    HACKER_NEWS = 'hackernews',
+    LINKEDIN = 'linkedin',
+    TWITTER = 'twitter',
+    SLACK = 'slack',
+    DEVTO = 'devto',
+    REDDIT = 'reddit',
+    STACK_OVERFLOW = 'stackOverflow',
+    DISCOURSE = 'discourse',
+    HUBSPOT = 'hubspot',
+    GIT = 'git',
+    GROUPS_IO = 'groupsio',
+    CUSTOM = 'custom',
+    EMAIL = 'email',
+    EMAILS = 'emails',
+    PHONE_NUMBERS = 'phoneNumbers',
+    CRUNCHBASE = 'crunchbase',
+}
diff --git a/frontend/src/shared/platform/platform-list.vue b/frontend/src/shared/platform/platform-list.vue
deleted file mode 100644
index 7a60e0204b..0000000000
--- a/frontend/src/shared/platform/platform-list.vue
+++ /dev/null
@@ -1,87 +0,0 @@
-<template>
-  <component
-    :is="asLink ? 'a' : 'span'"
-    v-for="(username, ui) of usernameHandles"
-    :key="username"
-    class="px-4 py-2 flex justify-between items-center relative group"
-    :class="{
-      'hover:bg-gray-50 transition-colors cursor-pointer': asLink && getPlatformUrl({ platform, username, index: ui }),
-    }"
-    :href="getPlatformUrl({ platform, username, index: ui })"
-    target="_blank"
-    rel="noopener noreferrer"
-  >
-    <div class="flex gap-3 items-center">
-      <app-platform :platform="platform" :show-tooltip="true" :attributes="attributes" />
-      <div
-        v-if="
-          platform === 'linkedin'
-            && username.includes(
-              'private-',
-            )
-        "
-        class="text-gray-900 text-xs"
-      >
-        *********
-        <el-tooltip
-          placement="top"
-          content="Private profile"
-        >
-          <i
-            class="ri-lock-line text-gray-400 ml-2"
-          />
-        </el-tooltip>
-      </div>
-      <span v-else class="text-gray-900 text-xs">
-        {{ username }}</span>
-    </div>
-    <i
-      v-if="asLink && getPlatformUrl({ platform, username, index: ui })"
-      class="ri-external-link-line text-gray-300 invisible group-hover:visible"
-    />
-  </component>
-</template>
-
-<script setup>
-import { computed } from 'vue';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
-
-const props = defineProps({
-  usernameHandles: {
-    type: Array,
-    default: () => [],
-  },
-  links: {
-    type: Array,
-    default: () => [],
-  },
-  platform: {
-    type: String,
-    default: null,
-  },
-  url: {
-    type: String,
-    default: null,
-  },
-  attributes: {
-    type: Object,
-    default: null,
-  },
-});
-
-const asLink = computed(() => CrowdIntegrations.getConfig(props.platform)?.showProfileLink);
-const getPlatformUrl = ({ platform, username, index }) => {
-  if (props.links && props.links.length > 0 && index < props.links.length) {
-    return props.links[index];
-  }
-
-  const url = CrowdIntegrations.getConfig(platform)?.url({ username, attributes: props.attributes });
-  return url ?? props.url;
-};
-</script>
-
-<script>
-export default {
-  name: 'AppPlatformList',
-};
-</script>
diff --git a/frontend/src/shared/platform/platform-popover.vue b/frontend/src/shared/platform/platform-popover.vue
deleted file mode 100644
index 3948a90bc3..0000000000
--- a/frontend/src/shared/platform/platform-popover.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<template>
-  <el-popover
-    v-if="usernameHandles.length > 1"
-    placement="top"
-    popper-class="platform-popover"
-    :width="240"
-    trigger="hover"
-  >
-    <template #reference>
-      <div>
-        <slot name="platform" />
-      </div>
-    </template>
-    <div class="max-h-48 overflow-auto">
-      <app-platform-list
-        :username-handles="usernameHandles"
-        :platform="platform"
-        :links="links"
-        :attributes="attributes"
-      />
-    </div>
-  </el-popover>
-  <el-tooltip
-    v-else
-    :disabled="!tooltipLabel"
-    popper-class="custom-identity-tooltip"
-    placement="top"
-  >
-    <template #content>
-      <span>{{ tooltipLabel }}
-        <i
-          v-if="href"
-          class="ri-external-link-line text-gray-400"
-        /></span>
-    </template>
-
-    <slot name="platform" />
-  </el-tooltip>
-</template>
-
-<script setup>
-import AppPlatformList from './platform-list.vue';
-
-defineProps({
-  usernameHandles: {
-    type: Array,
-    default: () => [],
-  },
-  links: {
-    type: Array,
-    default: () => [],
-  },
-  platform: {
-    type: String,
-    default: () => null,
-  },
-  tooltipLabel: {
-    type: String,
-    default: () => null,
-  },
-  href: {
-    type: String,
-    default: () => null,
-  },
-  attributes: {
-    type: Object,
-    default: null,
-  },
-});
-</script>
-
-<script>
-export default {
-  name: 'AppPlatformPopover',
-};
-</script>
-
-<style lang="scss">
-.el-popover.el-popper.platform-popover {
-    @apply px-0 py-2 shadow rounded-lg;
-}
-</style>
diff --git a/frontend/src/shared/platform/platform-svg-icon.vue b/frontend/src/shared/platform/platform-svg-icon.vue
deleted file mode 100644
index d61d0e911d..0000000000
--- a/frontend/src/shared/platform/platform-svg-icon.vue
+++ /dev/null
@@ -1,87 +0,0 @@
-<template>
-  <app-platform-popover
-    :username-handles="usernameHandles"
-    :tooltip-label="tooltipLabel"
-    :platform="platform"
-    :attributes="attributes"
-    :href="asLink ? href : null"
-  >
-    <template #platform>
-      <div class="relative">
-        <div
-          v-if="showHandlesBadge && usernameHandles.length > 1"
-          class="w-3.5 h-3.5 rounded-full bg-gray-500 text-white flex justify-center
-          items-center outline outline-2 outline-white absolute top-[-7px] right-[-7px]"
-        >
-          <span class="text-3xs font-semibold">{{ usernameHandles.length }}</span>
-        </div>
-        <a
-          v-if="platformConfig"
-          :aria-label="platform"
-          :href="href"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="min-w-[32px]"
-          :class="{
-            'hover:cursor-pointer': usernameHandles.length === 1 && href,
-            'hover:cursor-auto': !href || usernameHandles.length > 1,
-          }"
-          @click.stop
-        >
-          <app-svg
-            class="max-w-[16px] h-4"
-            color="#D1D5DB"
-            :name="platform"
-            :hover-color="usernameHandles.length === 1 && href ? '#4B5563' : null"
-          />
-        </a>
-        <i v-else class="ri-user-3-fill text-gray-300" />
-      </div>
-    </template>
-  </app-platform-popover>
-</template>
-
-<script setup>
-import { computed } from 'vue';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
-import AppSvg from '@/shared/svg/svg.vue';
-import AppPlatformPopover from './platform-popover.vue';
-
-const props = defineProps({
-  platform: {
-    type: String,
-    required: true,
-  },
-  tooltipLabel: {
-    type: String,
-    default: () => null,
-  },
-  asLink: {
-    type: Boolean,
-    default: () => false,
-  },
-  usernameHandles: {
-    type: Array,
-    default: () => [],
-  },
-  showHandlesBadge: {
-    type: Boolean,
-    default: false,
-  },
-  attributes: {
-    type: Object,
-    default: null,
-  },
-});
-
-const platformConfig = computed(() => CrowdIntegrations.getConfig(props.platform));
-const href = computed(() => (props.usernameHandles.length === 1 || props.attributes?.url?.[props.platform]
-  ? CrowdIntegrations.getConfig(props.platform)?.url({ username: props.usernameHandles[0], attributes: props.attributes })
-  : null));
-</script>
-
-<script>
-export default {
-  name: 'AppPlatformSvgIcon',
-};
-</script>
diff --git a/frontend/src/shared/platform/platform.vue b/frontend/src/shared/platform/platform.vue
deleted file mode 100644
index 50d96391a4..0000000000
--- a/frontend/src/shared/platform/platform.vue
+++ /dev/null
@@ -1,167 +0,0 @@
-<template>
-  <app-platform-popover
-    :username-handles="usernameHandles"
-    :tooltip-label="tooltipLabel"
-    :platform="platform"
-    :attributes="attributes"
-    :href="asLink ? href : null"
-    :links="props.links"
-  >
-    <template #platform>
-      <div class="relative">
-        <div
-          v-if="showHandlesBadge && usernameHandles.length > 1"
-          class="w-3.5 h-3.5 rounded-full bg-gray-500 text-white flex justify-center
-        items-center outline outline-2 outline-white absolute top-[-7px] right-[-7px]"
-        >
-          <span class="text-3xs font-semibold">{{ usernameHandles.length }}</span>
-        </div>
-        <el-tooltip
-          :disabled="!showTooltip || imageProperties || platform === 'email' || platform === 'phone'"
-          :content="platform"
-          placement="top"
-        >
-          <component
-            :is="asLink ? 'a' : 'span'"
-            :href="href"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="btn min-h-8 min-w-[32px] h-8 w-8 text-base"
-            :class="`
-        ${
-              !asLink || !href
-                ? 'hover:cursor-auto'
-                : 'hover:cursor-pointer'
-            } ${getIconClass(platform)}`"
-            @click.stop="asLink ? trackClick : null"
-          >
-            <i
-              v-if="platform === 'email'"
-              class="ri-mail-line"
-            />
-            <i
-              v-else-if="platform === 'phone'"
-              class="ri-phone-fill"
-            />
-            <img
-              v-else-if="imageProperties"
-              :src="imageProperties.image"
-              :alt="imageProperties.name"
-              class="channels-icon"
-            />
-            <i v-else :class="props.customPlatformIconClass" />
-          </component>
-        </el-tooltip>
-      </div>
-    </template>
-  </app-platform-popover>
-</template>
-
-<script setup>
-import { defineProps, computed } from 'vue';
-import { CrowdIntegrations } from '@/integrations/integrations-config';
-import AppPlatformPopover from './platform-popover.vue';
-
-const props = defineProps({
-  platform: {
-    type: String,
-    required: true,
-  },
-  trackEventChannel: {
-    type: String,
-    default: () => null,
-  },
-  trackEventName: {
-    type: String,
-    default: () => null,
-  },
-  tooltipLabel: {
-    type: String,
-    default: () => null,
-  },
-  asLink: {
-    type: Boolean,
-    default: () => false,
-  },
-  usernameHandles: {
-    type: Array,
-    default: () => [],
-  },
-  links: {
-    type: Array,
-    default: () => [],
-  },
-  showHandlesBadge: {
-    type: Boolean,
-    default: false,
-  },
-  showTooltip: {
-    type: Boolean,
-    default: false,
-  },
-  href: {
-    type: String,
-    default: null,
-  },
-  backupUrl: {
-    type: String,
-    default: null,
-  },
-  attributes: {
-    type: Object,
-    default: null,
-  },
-  customPlatformIconClass: {
-    type: String,
-    default: 'ri-user-3-fill',
-  },
-});
-
-const imageProperties = computed(() => CrowdIntegrations.getConfig(props.platform));
-const href = computed(() => {
-  if (props.href) {
-    return props.href;
-  }
-
-  return (props.usernameHandles.length === 1 || props.attributes?.url?.[props.platform]
-    ? (CrowdIntegrations.getConfig(props.platform)?.url({ username: props.usernameHandles[0], attributes: props.attributes }) ?? props.backupUrl)
-    : null);
-});
-
-const trackClick = () => {
-  window.analytics.track(props.trackEventName, {
-    channel: props.trackEventChannel,
-  });
-};
-
-const getIconClass = (platform) => {
-  if (!CrowdIntegrations.getConfig(platform)) {
-    return 'btn--custom-platform';
-  }
-
-  return `btn--${platform}`;
-};
-</script>
-
-<script>
-export default {
-  name: 'AppPlatform',
-};
-</script>
-
-<style lang="scss">
-.channels-icon {
-  max-height: 1rem;
-}
-
-// Custom tooltip for external links
-.custom-identity-tooltip {
-  span:first-child {
-    @apply flex gap-1.5 items-center;
-  }
-}
-
-a[href]:hover {
-  opacity: 1;
-}
-</style>
diff --git a/frontend/src/shared/shared-module.js b/frontend/src/shared/shared-module.js
index efba4575dd..6e3ca84ff1 100644
--- a/frontend/src/shared/shared-module.js
+++ b/frontend/src/shared/shared-module.js
@@ -14,7 +14,6 @@ import InlineSelectInput from '@/shared/form/inline-select-input.vue';
 import Dialog from '@/shared/dialog/dialog.vue';
 import EmptyStateCta from '@/shared/empty-state/empty-state-cta.vue';
 import EmptyState from '@/shared/empty-state/empty-state.vue';
-import Platform from '@/shared/platform/platform.vue';
 import Drawer from '@/shared/drawer/drawer.vue';
 import AppLoader from '@/shared/loading/loader.vue';
 import AppPageWrapper from '@/shared/layout/page-wrapper.vue';
@@ -41,7 +40,6 @@ export default {
     'app-dialog': Dialog,
     'app-empty-state-cta': EmptyStateCta,
     'app-empty-state': EmptyState,
-    'app-platform': Platform,
     'app-drawer': Drawer,
     'app-loader': AppLoader,
     'app-page-wrapper': AppPageWrapper,

From d28b124a1807a95a8169ae590c15de3bc8a0f8d9 Mon Sep 17 00:00:00 2001
From: joanagmaia <joana@crowd.dev>
Date: Fri, 5 Jan 2024 13:36:02 +0000
Subject: [PATCH 4/9] Fix empty emails and phone numbers (#2028)

---
 .../components/list/member-list-table.vue     | 10 +++----
 .../components/identities-vertical-list.vue   |  2 +-
 .../identities/config/useMemberIdentities.ts  | 30 +++++++++++--------
 .../config/useOrganizationIdentities.ts       | 10 ++++---
 4 files changed, 30 insertions(+), 22 deletions(-)

diff --git a/frontend/src/modules/member/components/list/member-list-table.vue b/frontend/src/modules/member/components/list/member-list-table.vue
index 89408f3e4a..360639235e 100644
--- a/frontend/src/modules/member/components/list/member-list-table.vue
+++ b/frontend/src/modules/member/components/list/member-list-table.vue
@@ -199,11 +199,11 @@
                     class="block"
                   >
                     <div
-                      v-if="scope.row.emails?.length && scope.row.emails?.some((e) => !!e)"
+                      v-if="scope.row.emails.filter((e) => !!e)?.length && scope.row.emails.filter((e) => !!e)?.some((e) => !!e)"
                       class="text-sm cursor-auto flex flex-wrap gap-1"
                     >
                       <el-tooltip
-                        v-for="email of scope.row.emails.slice(0, 3)"
+                        v-for="email of scope.row.emails.filter((e) => !!e).slice(0, 3)"
                         :key="email"
                         :disabled="!email"
                         popper-class="custom-identity-tooltip"
@@ -227,7 +227,7 @@
                         </div>
                       </el-tooltip>
                       <el-popover
-                        v-if="scope.row.emails?.length > 3"
+                        v-if="scope.row.emails.filter((e) => !!e)?.length > 3"
                         placement="top"
                         :width="400"
                         trigger="hover"
@@ -236,11 +236,11 @@
                         <template #reference>
                           <span
                             class="badge--interactive hover:text-gray-900"
-                          >+{{ scope.row.emails.length - 3 }}</span>
+                          >+{{ scope.row.emails.filter((e) => !!e).length - 3 }}</span>
                         </template>
                         <div class="flex flex-wrap gap-3 my-1">
                           <el-tooltip
-                            v-for="email of scope.row.emails.slice(3)"
+                            v-for="email of scope.row.emails.filter((e) => !!e).slice(3)"
                             :key="email"
                             :disabled="!email"
                             popper-class="custom-identity-tooltip flex "
diff --git a/frontend/src/shared/modules/identities/components/identities-vertical-list.vue b/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
index 714a756723..32645a7220 100644
--- a/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
+++ b/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
@@ -4,7 +4,7 @@
       v-for="[platform, value] of Object.entries(slicedIdentities)"
       :key="platform"
     >
-      <div>
+      <div v-if="value.length">
         <div
           class="flex gap-3 items-start relative min-h-5"
           :class="{
diff --git a/frontend/src/shared/modules/identities/config/useMemberIdentities.ts b/frontend/src/shared/modules/identities/config/useMemberIdentities.ts
index decadaee87..120668ac99 100644
--- a/frontend/src/shared/modules/identities/config/useMemberIdentities.ts
+++ b/frontend/src/shared/modules/identities/config/useMemberIdentities.ts
@@ -107,23 +107,29 @@ export default ({
     handle: string;
     link: string;
   }[] => {
-    const rootEmails = (emails || []).map((e) => ({
-      link: `mailto:${e}`,
-      handle: e,
-    }));
+    const rootEmails = (emails || [])
+      .filter((e) => !!e)
+      .map((e) => ({
+        link: `mailto:${e}`,
+        handle: e,
+      }));
 
     const usernameEmail = username.email
-      ? username.email.map((u) => ({
-        link: null,
-        handle: u,
-      }))
+      ? username.email
+        .filter((e) => !!e)
+        .map((e) => ({
+          link: null,
+          handle: e,
+        }))
       : [];
 
     const usernameEmails = username.emails
-      ? username.emails.map((u) => ({
-        link: `mailto:${e}`,
-        handle: u,
-      }))
+      ? username.emails
+        .filter((e) => !!e)
+        .map((e) => ({
+          link: `mailto:${e}`,
+          handle: e,
+        }))
       : [];
 
     return [...rootEmails, ...usernameEmail, ...usernameEmails];
diff --git a/frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts b/frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts
index 1f25cff373..81a5749297 100644
--- a/frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts
+++ b/frontend/src/shared/modules/identities/config/useOrganizationIdentities.ts
@@ -94,10 +94,12 @@ export default ({
   }[] => {
     const parsedIdentities = identities?.length ? identities : [];
 
-    const rootEmails = (emails || []).map((e) => ({
-      link: `mailto:${e}`,
-      handle: e,
-    }));
+    const rootEmails = (emails || [])
+      .filter((e) => !!e)
+      .map((e) => ({
+        link: `mailto:${e}`,
+        handle: e,
+      }));
 
     const identitiesEmails = parsedIdentities
       .filter((i) => i.platform === 'emails')

From bda1bffd91c98123b1344abf88c5d0a2a72247dc Mon Sep 17 00:00:00 2001
From: joanagmaia <joana@crowd.dev>
Date: Fri, 5 Jan 2024 17:31:00 +0000
Subject: [PATCH 5/9] Fix identities overflow (#2032)

---
 .../components/identities-vertical-list.vue   | 35 +++++++++----------
 1 file changed, 17 insertions(+), 18 deletions(-)

diff --git a/frontend/src/shared/modules/identities/components/identities-vertical-list.vue b/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
index 32645a7220..ba3e791500 100644
--- a/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
+++ b/frontend/src/shared/modules/identities/components/identities-vertical-list.vue
@@ -19,7 +19,7 @@
           />
 
           <div class="flex flex-wrap items-center gap-2">
-            <div class="flex flex-wrap items-center">
+            <div class="inline-block overflow-wrap items-center">
               <template v-for="({ handle, link }, vi) of value" :key="handle">
                 <div
                   v-if="platform === 'linkedin' && handle.includes('private-')"
@@ -31,23 +31,22 @@
                   </el-tooltip>
                 </div>
 
-                <span v-else class="flex items-center break-words">
-                  <component
-                    :is="link ? 'a' : 'span'"
-                    :href="link"
-                    class="text-gray-900 text-xs font-medium leading-5 h-5"
-                    :class="{
-                      'underline decoration-dashed decoration-gray-400 underline-offset-4 ':
-                        link,
-                      'hover:decoration-gray-900 hover:cursor-pointer hover:!text-gray-900':
-                        link,
-                    }"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    {{ handle }}
-                  </component>
-                </span>
+                <component
+                  :is="link ? 'a' : 'span'"
+                  v-else
+                  :href="link"
+                  class="text-gray-900 text-xs font-medium leading-5 items-center w-auto break-words"
+                  :class="{
+                    'underline decoration-dashed decoration-gray-400 underline-offset-4 ':
+                      link,
+                    'hover:decoration-gray-900 hover:cursor-pointer hover:!text-gray-900':
+                      link,
+                  }"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  {{ handle }}
+                </component>
 
                 <span
                   v-if="vi !== value.length - 1"

From f909317ac833cf2247fcc367a5620afe77e90cd3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C5=A1per=20Grom?= <gasper.grom@gmail.com>
Date: Sun, 7 Jan 2024 14:13:25 +0100
Subject: [PATCH 6/9] Fix email verify flow (#2034)

---
 frontend/src/middleware/auth/auth-guard.js   | 13 +++++++------
 frontend/src/modules/auth/store/actions.js   |  2 +-
 frontend/src/modules/auth/store/mutations.js |  8 ++++++--
 3 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/frontend/src/middleware/auth/auth-guard.js b/frontend/src/middleware/auth/auth-guard.js
index db7653756c..4c9a810921 100644
--- a/frontend/src/middleware/auth/auth-guard.js
+++ b/frontend/src/middleware/auth/auth-guard.js
@@ -51,8 +51,14 @@ export default async function ({
     return;
   }
 
+  if (!currentUser.acceptedTermsAndPrivacy) {
+    router.push({ path: '/auth/terms-and-privacy' });
+    return;
+  }
+
   if (store.getters['auth/currentTenant'] && isTrialExpired(store.getters['auth/currentTenant'])) {
-    if (!window.location.href.includes('/onboard/plans') && !window.location.href.includes('/onboard/payment')) {
+    if (!window.location.href.includes('/onboard/plans')
+      && !window.location.href.includes('/onboard/payment')) {
       window.location.href = `${config.frontendUrl.protocol}://${config.frontendUrl.host}/onboard/plans`;
     }
     return;
@@ -70,11 +76,6 @@ export default async function ({
     return;
   }
 
-  if (!currentUser.acceptedTermsAndPrivacy) {
-    router.push({ path: '/auth/terms-and-privacy' });
-    return;
-  }
-
   if (
     ['multi', 'multi-with-subdomain'].includes(
       config.tenantMode,
diff --git a/frontend/src/modules/auth/store/actions.js b/frontend/src/modules/auth/store/actions.js
index d6923911e7..893bb25115 100644
--- a/frontend/src/modules/auth/store/actions.js
+++ b/frontend/src/modules/auth/store/actions.js
@@ -228,7 +228,7 @@ export default {
       })
       .then(() => {
         commit('EMAIL_VERIFY_SUCCESS');
-        router.push('/');
+        router.push('/onboard/plans');
       })
       .catch((error) => {
         Errors.handle(error);
diff --git a/frontend/src/modules/auth/store/mutations.js b/frontend/src/modules/auth/store/mutations.js
index 72f7782ee7..495f8ab7f6 100644
--- a/frontend/src/modules/auth/store/mutations.js
+++ b/frontend/src/modules/auth/store/mutations.js
@@ -21,7 +21,9 @@ export default {
       payload.currentUser,
     );
     if (state.currentTenant && isTrialExpired(state.currentTenant)) {
-      if (!window.location.href.includes('/onboard/plans') && !window.location.href.includes('/onboard/payment')) {
+      if (!window.location.href.includes('/onboard/plans')
+        && !window.location.href.includes('/onboard/payment')
+        && !window.location.href.includes('/auth/verify-email')) {
         window.location.href = `${config.frontendUrl.protocol}://${config.frontendUrl.host}/onboard/plans`;
       }
       return;
@@ -120,7 +122,9 @@ export default {
       payload.currentUser,
     );
     if (state.currentTenant && isTrialExpired(state.currentTenant)) {
-      if (!window.location.href.includes('/onboard/plans') && !window.location.href.includes('/onboard/payment')) {
+      if (!window.location.href.includes('/onboard/plans')
+        && !window.location.href.includes('/onboard/payment')
+        && !window.location.href.includes('/auth/verify-email')) {
         window.location.href = `${config.frontendUrl.protocol}://${config.frontendUrl.host}/onboard/plans`;
       }
       return;

From 08f5004c7b0e5054d630fd25213deb68fa3d9484 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lo=C3=AFc=20Saint-Roch?=
 <loicsaintroch@users.noreply.github.com>
Date: Mon, 8 Jan 2024 10:46:28 +0100
Subject: [PATCH 7/9] Select only tenants with active paid plan (#2037)

---
 .../src/activities/weekly-analytics/getNextEmails.ts         | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/services/apps/emails_worker/src/activities/weekly-analytics/getNextEmails.ts b/services/apps/emails_worker/src/activities/weekly-analytics/getNextEmails.ts
index 36603288ed..9f55db901b 100644
--- a/services/apps/emails_worker/src/activities/weekly-analytics/getNextEmails.ts
+++ b/services/apps/emails_worker/src/activities/weekly-analytics/getNextEmails.ts
@@ -35,7 +35,10 @@ export async function weeklyGetNextEmails(): Promise<InputAnalytics[]> {
   try {
     rows = await svc.postgres.reader.connection().query(`
       SELECT id as "tenantId", name as "tenantName"
-      FROM tenants WHERE "deletedAt" IS NULL;
+        FROM tenants
+        WHERE "deletedAt" IS NULL
+        AND plan IN ('Scale', 'Growth', 'Essential')
+        AND ("trialEndsAt" > NOW() OR "trialEndsAt" IS NULL);
     `)
   } catch (err) {
     throw new Error(err)

From 0d9a708181ff0d4622c2aa771e1bac827380e596 Mon Sep 17 00:00:00 2001
From: Mish Savelyev <1564970+sausage-todd@users.noreply.github.com>
Date: Mon, 8 Jan 2024 12:54:19 +0100
Subject: [PATCH 8/9] Fix missing members joined at data (#2019)

---
 .../U1704365919__fix-member-joined-at.sql     |  0
 .../V1704365919__fix-member-joined-at.sql     | 36 +++++++++++++++++++
 pnpm-lock.yaml                                |  6 ++++
 services/apps/data_sink_worker/package.json   |  2 ++
 .../src/service/member.service.ts             | 10 ++++++
 5 files changed, 54 insertions(+)
 create mode 100644 backend/src/database/migrations/U1704365919__fix-member-joined-at.sql
 create mode 100644 backend/src/database/migrations/V1704365919__fix-member-joined-at.sql

diff --git a/backend/src/database/migrations/U1704365919__fix-member-joined-at.sql b/backend/src/database/migrations/U1704365919__fix-member-joined-at.sql
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/backend/src/database/migrations/V1704365919__fix-member-joined-at.sql b/backend/src/database/migrations/V1704365919__fix-member-joined-at.sql
new file mode 100644
index 0000000000..ab41e713c2
--- /dev/null
+++ b/backend/src/database/migrations/V1704365919__fix-member-joined-at.sql
@@ -0,0 +1,36 @@
+DO $$
+DECLARE
+    _member_id UUID;
+    _first_acitivity TIMESTAMP;
+BEGIN
+    FOR _member_id IN
+        SELECT id
+        FROM members
+        WHERE EXTRACT(YEAR FROM "joinedAt") = 1970 -- those who have the wrong joinedAt
+          AND EXISTS ( -- yet have at least one activity with a non-1970 timestamp
+            SELECT 1
+            FROM activities a
+            WHERE a."memberId" = members.id
+              AND EXTRACT(YEAR FROM a.timestamp) != 1970
+        )
+    LOOP
+        RAISE NOTICE 'member_id: %', _member_id;
+
+        -- find the actual first non-1970 activity timestamp
+        SELECT MIN(a.timestamp) INTO _first_acitivity
+        FROM activities a
+        WHERE EXTRACT(YEAR FROM a.timestamp) != 1970
+          AND a."memberId" = _member_id;
+
+        IF _first_acitivity IS NULL THEN
+            CONTINUE;
+        END IF;
+
+        RAISE NOTICE 'first_acitivity: %', _first_acitivity;
+
+        UPDATE members
+        SET "joinedAt" = _first_acitivity
+        WHERE id = _member_id;
+    END LOOP;
+END;
+$$;
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ce10cdf4e0..6b296b28a4 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -541,6 +541,12 @@ importers:
       lodash.uniqby:
         specifier: ^4.7.0
         version: 4.7.0
+      moment:
+        specifier: 2.29.4
+        version: 2.29.4
+      moment-timezone:
+        specifier: ^0.5.34
+        version: 0.5.43
       ts-node:
         specifier: ^10.9.1
         version: 10.9.1(@types/node@18.18.14)(typescript@5.3.2)
diff --git a/services/apps/data_sink_worker/package.json b/services/apps/data_sink_worker/package.json
index 379881bd8c..1b057f2db2 100644
--- a/services/apps/data_sink_worker/package.json
+++ b/services/apps/data_sink_worker/package.json
@@ -43,6 +43,8 @@
     "lodash.isequal": "^4.5.0",
     "lodash.mergewith": "^4.6.2",
     "lodash.uniqby": "^4.7.0",
+    "moment": "2.29.4",
+    "moment-timezone": "^0.5.34",
     "ts-node": "^10.9.1",
     "tsconfig-paths": "^4.2.0",
     "typescript": "^5.0.4"
diff --git a/services/apps/data_sink_worker/src/service/member.service.ts b/services/apps/data_sink_worker/src/service/member.service.ts
index f1e781fd1f..28615e09bf 100644
--- a/services/apps/data_sink_worker/src/service/member.service.ts
+++ b/services/apps/data_sink_worker/src/service/member.service.ts
@@ -19,6 +19,7 @@ import {
 } from '@crowd/types'
 import mergeWith from 'lodash.mergewith'
 import isEqual from 'lodash.isequal'
+import moment from 'moment-timezone'
 import { IMemberCreateData, IMemberUpdateData } from './member.data'
 import MemberAttributeService from './memberAttribute.service'
 import IntegrationRepository from '../repo/integration.repo'
@@ -546,6 +547,15 @@ export default class MemberService extends LoggerBase {
     if (member.joinedAt) {
       const newDate = member.joinedAt
       const oldDate = new Date(dbMember.joinedAt)
+      // If either the new or the old date are earlier than 1970
+      // it means they come from an activity without timestamp
+      // and we want to keep the other one
+      if (moment(oldDate).subtract(5, 'days').unix() < 0) {
+        joinedAt = newDate.toISOString()
+      }
+      if (moment(newDate).unix() < 0) {
+        joinedAt = undefined
+      }
 
       if (oldDate <= newDate) {
         // we already have the oldest date in the db, so we don't need to update it

From c67928e0253511998c7a54dd958c12920f0f86d5 Mon Sep 17 00:00:00 2001
From: Yeganathan S <hilariousengineer@protonmail.com>
Date: Mon, 8 Jan 2024 12:59:15 +0000
Subject: [PATCH 9/9] Replace parent segment with leaf segments for member
 `lastActivity` (#2036)

---
 .../database/repositories/memberRepository.ts | 29 ++++++++++---------
 1 file changed, 16 insertions(+), 13 deletions(-)

diff --git a/backend/src/database/repositories/memberRepository.ts b/backend/src/database/repositories/memberRepository.ts
index 78eb891ed3..4f34f05f66 100644
--- a/backend/src/database/repositories/memberRepository.ts
+++ b/backend/src/database/repositories/memberRepository.ts
@@ -2222,26 +2222,29 @@ class MemberRepository {
     const memberIds = translatedRows.map((r) => r.id)
     if (memberIds.length > 0) {
       const seq = SequelizeRepository.getSequelize(options)
-      const segmentIds = segments
 
       const lastActivities = await seq.query(
         `
-            WITH
-                raw_data AS (
-                    SELECT *, ROW_NUMBER() OVER (PARTITION BY "memberId" ORDER BY timestamp DESC) AS rn
-                    FROM activities
-                    WHERE "tenantId" = :tenantId
-                      AND "memberId" IN (:memberIds)
-                      AND "segmentId" IN (:segmentIds)
-                )
-            SELECT *
-            FROM raw_data
-            WHERE rn = 1;
+          WITH
+            leaf_segment_ids AS (
+              select id
+              from segments
+              where "tenantId" = :tenantId and "parentSlug" is not null and "grandparentSlug" is not null
+            ),
+            raw_data AS (
+                SELECT *, ROW_NUMBER() OVER (PARTITION BY "memberId" ORDER BY timestamp DESC) AS rn
+                FROM activities
+                INNER JOIN leaf_segment_ids ON activities."segmentId" = leaf_segment_ids.id
+                WHERE "tenantId" = :tenantId
+                  AND "memberId" IN (:memberIds)
+            )
+          SELECT *
+          FROM raw_data
+          WHERE rn = 1;
         `,
         {
           replacements: {
             tenantId: tenant.id,
-            segmentIds,
             memberIds,
           },
           type: QueryTypes.SELECT,