diff --git a/frontend/src/modules/member/components/form/member-form-attributes.vue b/frontend/src/modules/member/components/form/member-form-attributes.vue
index 82d711dfdf..0d74ebf06b 100644
--- a/frontend/src/modules/member/components/form/member-form-attributes.vue
+++ b/frontend/src/modules/member/components/form/member-form-attributes.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="grid gap-x-12 grid-cols-3 mb-16">
+  <div class="grid gap-x-12 grid-cols-4 mb-16">
     <div v-if="showHeader">
       <h6>Custom attributes</h6>
       <p class="text-gray-500 text-2xs leading-normal mt-1">
@@ -12,7 +12,7 @@
         Manage global attributes
       </el-button>
     </div>
-    <div :class="showHeader ? 'col-span-2' : 'col-span-3'">
+    <div :class="showHeader ? 'col-span-3' : 'col-span-4'">
       <div class="flex gap-3 border-b h-8 items-center">
         <span
           class="uppercase text-gray-400 text-2xs font-semibold tracking-wide w-1/3"
diff --git a/frontend/src/modules/member/components/form/member-form-details.vue b/frontend/src/modules/member/components/form/member-form-details.vue
index 18ba517c79..e4a7bc1a43 100644
--- a/frontend/src/modules/member/components/form/member-form-details.vue
+++ b/frontend/src/modules/member/components/form/member-form-details.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="grid gap-x-12 grid-cols-3">
+  <div class="grid gap-x-12 grid-cols-4">
     <h6>Personal details</h6>
-    <div class="col-span-2 personal-details-form">
+    <div class="col-span-3 personal-details-form">
       <el-form-item :label="fieldsValue.displayName.label">
         <el-input
           v-model="model[fieldsValue.displayName.name]"
@@ -29,35 +29,6 @@
         <el-input v-model="model.jobTitle" />
       </el-form-item>
 
-      <el-form-item
-        class="grow"
-        :label="fieldsValue.organizations.label"
-      >
-        <app-autocomplete-many-input
-          v-model="model.organizations"
-          :fetch-fn="fetchOrganizationsFn"
-          :create-fn="createOrganizationFn"
-          placeholder="Type to search or create organizations"
-          input-class="w-full"
-          :create-if-not-found="true"
-          :in-memory-filter="false"
-        >
-          <template #option="{ item }">
-            <div class="flex items-center">
-              <app-avatar
-                :entity="{
-                  displayName: item.label,
-                  avatar: item.logo,
-                }"
-                size="xxs"
-                class="mr-2"
-              />
-              {{ item.label }}
-            </div>
-          </template>
-        </app-autocomplete-many-input>
-      </el-form-item>
-
       <el-form-item :label="fieldsValue.bio.label">
         <el-input
           v-model="model.bio"
@@ -88,8 +59,6 @@ import {
   defineEmits, defineProps, computed, h,
 } from 'vue';
 import AppTagAutocompleteInput from '@/modules/tag/components/tag-autocomplete-input.vue';
-import { OrganizationService } from '@/modules/organization/organization-service';
-import AppAvatar from '@/shared/avatar/avatar.vue';
 
 const CalendarIcon = h(
   'i', // type
@@ -120,17 +89,4 @@ const model = computed({
     emit('update:modelValue', newModel);
   },
 });
-
-const fetchOrganizationsFn = (query, limit) => OrganizationService.listAutocomplete(query, limit)
-  .then((options) => options.filter((m) => m.id !== props.id))
-  .catch(() => []);
-
-const createOrganizationFn = (value) => OrganizationService.create({
-  name: value,
-})
-  .then((newOrganization) => ({
-    id: newOrganization.id,
-    label: newOrganization.displayName,
-  }))
-  .catch(() => null);
 </script>
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 2baadb3505..39c1b57b14 100644
--- a/frontend/src/modules/member/components/form/member-form-identities.vue
+++ b/frontend/src/modules/member/components/form/member-form-identities.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="grid gap-x-12 grid-cols-3">
+  <div class="grid gap-x-12 grid-cols-4">
     <div v-if="showHeader">
       <h6>
         Identities <span class="text-brand-500">*</span>
@@ -11,7 +11,7 @@
     </div>
     <div
       class="identities-form"
-      :class="showHeader ? 'col-span-2' : 'col-span-3'"
+      :class="showHeader ? 'col-span-3' : 'col-span-4'"
     >
       <div
         v-for="[key, value] in Object.entries(
diff --git a/frontend/src/modules/member/components/form/member-form-organizations.vue b/frontend/src/modules/member/components/form/member-form-organizations.vue
new file mode 100644
index 0000000000..ebecc677c2
--- /dev/null
+++ b/frontend/src/modules/member/components/form/member-form-organizations.vue
@@ -0,0 +1,255 @@
+<template>
+  <div class="grid gap-x-12 grid-cols-4">
+    <div>
+      <h6>Organizations</h6>
+      <p class="text-gray-500 text-2xs leading-normal mt-1">
+        Associate organizations to members to enhance their profile
+      </p>
+    </div>
+    <div
+      class="col-span-3"
+    >
+      <div class="flex gap-3 border-b h-8 items-center">
+        <span
+          class="uppercase text-gray-400 text-2xs font-semibold tracking-wide w-2/5"
+        >Organization</span>
+        <span
+          class="uppercase text-gray-400 text-2xs font-semibold tracking-wide w-1/3"
+        >Job Title</span>
+        <span
+          class="uppercase text-gray-400 text-2xs font-semibold tracking-wide grow w-1/3"
+        >Period</span>
+        <span class="w-10" />
+      </div>
+
+      <div
+        v-if="!!organizations.length"
+        class="flex mt-4 mb-2 flex-col gap-3"
+      >
+        <div
+          v-for="(organization, index) in organizations"
+          :key="organization.id"
+          class="flex gap-3"
+        >
+          <div class="w-2/5">
+            <app-autocomplete-one-input
+              v-model="organizations[index]"
+              :fetch-fn="fetchOrganizationsFn"
+              :create-fn="createOrganizationFn"
+              placeholder="Select or create an organization"
+              input-class="organization-input"
+              store-key="memberOrganizations"
+              :create-if-not-found="true"
+              :in-memory-filter="false"
+              :clearable="false"
+            >
+              <template v-if="organization.displayName || organization.name" #prefix>
+                <div class="flex items-center">
+                  <app-avatar
+                    :entity="{
+                      displayName: organization.displayName || organization.name,
+                      avatar: organization.logo,
+                    }"
+                    size="xxs"
+                    class="mr-2"
+                  />
+                </div>
+              </template>
+              <template #option="{ item }">
+                <div class="flex items-center">
+                  <app-avatar
+                    :entity="{
+                      displayName: item.label,
+                      avatar: item.logo,
+                    }"
+                    size="xxs"
+                    class="mr-2"
+                  />
+                  {{ item.label }}
+                </div>
+              </template>
+            </app-autocomplete-one-input>
+          </div>
+
+          <div class="w-1/3">
+            <el-input
+              v-model="organizations[index].memberOrganizations.title"
+              clearable
+            />
+          </div>
+
+          <div class="w-1/3 flex">
+            <el-date-picker
+              v-model="dateRange[index][0]"
+              type="month"
+              format="MMMM YYYY"
+              placeholder="From"
+              class="custom-date-picker organization left"
+              popper-class="date-picker-popper"
+              :prefix-icon="DateRangePickerPrefix"
+              clearable
+              @change="(val: Date) => onDatePickerChange('dateStart', val, index)"
+            />
+            <el-divider direction="vertical" class="m-0 h-full" />
+            <el-date-picker
+              v-model="dateRange[index][1]"
+              type="month"
+              format="MMMM YYYY"
+              placeholder="To"
+              class="custom-date-picker organization right"
+              popper-class="date-picker-popper"
+              :prefix-icon="DateRangePickerPrefix"
+              clearable
+              @change="(val: Date) => onDatePickerChange('dateEnd', val, index)"
+            />
+          </div>
+
+          <button
+            type="button"
+            class="btn btn--md btn--transparent w-10 h-10"
+            @click="removeOrganization(index)"
+          >
+            <i
+              class="ri-delete-bin-line text-lg text-gray-600"
+            />
+          </button>
+        </div>
+      </div>
+      <div class="flex justify-start">
+        <el-button class="btn btn-link btn-link--primary mt-4" @click="addOrganization">
+          + Add organization
+        </el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  computed, h, reactive, watch,
+} from 'vue';
+import { OrganizationService } from '@/modules/organization/organization-service';
+import AppAvatar from '@/shared/avatar/avatar.vue';
+import { Member } from '@/modules/member/types/Member';
+import { Organization } from '@/modules/organization/types/Organization';
+import moment from 'moment';
+
+type SelectOrganization = Organization & { label: string };
+
+const emit = defineEmits<{(e: 'update:modelValue', value: Member): any}>();
+const props = defineProps<{
+  modelValue: Member,
+}>();
+
+const dateRange = reactive<string[][]>([]);
+
+const organizations = computed<Organization[]>({
+  get() {
+    return props.modelValue.organizations;
+  },
+  set(v) {
+    emit('update:modelValue', {
+      ...props.modelValue,
+      organizations: v,
+    });
+  },
+});
+
+const DateRangePickerPrefix = h(
+  'span',
+  [],
+);
+
+watch(() => props.modelValue.organizations, (updatedOrganizations) => {
+  dateRange.splice(0, dateRange.length, ...updatedOrganizations.map((o) => [o.memberOrganizations?.dateStart, o.memberOrganizations?.dateEnd]));
+}, {
+  deep: true,
+  immediate: true,
+});
+
+const fetchOrganizationsFn = (query: number, limit:number) => OrganizationService.listAutocomplete(query, limit)
+  .then((options: SelectOrganization[]) => options.filter((m) => m.id !== props.modelValue.id).map((o) => ({
+    ...o,
+    displayName: o.label,
+    name: o.label,
+    memberOrganizations: {
+      title: '',
+      dateStart: '',
+      dateEnd: '',
+    },
+  })))
+  .catch(() => []);
+
+const createOrganizationFn = (value: string) => OrganizationService.create({
+  name: value,
+})
+  .then((newOrganization) => ({
+    id: newOrganization.id,
+    label: newOrganization.displayName || newOrganization.name,
+    displayName: newOrganization.displayName || newOrganization.name,
+    name: newOrganization.displayName || newOrganization.name,
+    memberOrganizations: {
+      title: '',
+      dateStart: '',
+      dateEnd: '',
+    },
+  }))
+  .catch(() => null);
+
+const onDatePickerChange = (key: 'dateStart' | 'dateEnd', value: Date, index: number) => {
+  if (value) {
+    const timezoneOffsetMinutes = value.getTimezoneOffset();
+    const date = moment(value.getTime() - (timezoneOffsetMinutes * 60 * 1000)).toISOString();
+
+    organizations.value[index].memberOrganizations[key] = date;
+  } else {
+    organizations.value[index].memberOrganizations[key] = '';
+  }
+};
+
+const addOrganization = () => {
+  organizations.value.push({
+    id: '',
+    name: '',
+    memberOrganizations: {
+      title: '',
+      dateStart: '',
+      dateEnd: '',
+    },
+  } as Organization);
+};
+
+const removeOrganization = (index: number) => {
+  organizations.value.splice(index, 1);
+};
+</script>
+
+<style lang="scss">
+.custom-date-picker.organization {
+  &.left {
+    .el-input__wrapper {
+      @apply rounded-l-md rounded-r-none h-10 border-r-0;
+    }
+  }
+
+  &.right {
+    .el-input__wrapper {
+      @apply rounded-r-md rounded-l-none h-10 border-l-0;
+    }
+  }
+
+  .el-input__wrapper {
+    @apply h-10 flex flex-row;
+
+    .el-input__prefix {
+      @apply hidden;
+    }
+  }
+}
+
+.organization-input {
+  .el-input__suffix-inner {
+    @apply bg-white;
+  }
+}
+</style>
diff --git a/frontend/src/modules/member/components/member-organizations.vue b/frontend/src/modules/member/components/member-organizations.vue
index affcda232f..9f1bb5e331 100644
--- a/frontend/src/modules/member/components/member-organizations.vue
+++ b/frontend/src/modules/member/components/member-organizations.vue
@@ -1,26 +1,24 @@
 <template>
   <div v-if="orientation === 'vertical'">
-    <div v-if="props.member.organizations?.length > 0">
+    <div v-if="activeOrganization">
       <router-link
-        v-for="organization of props.member.organizations"
-        :key="organization.id"
         :to="{
           name: 'organizationView',
-          params: { id: organization.id },
+          params: { id: activeOrganization.id },
         }"
         class="flex items-start hover:cursor-pointer"
         @click.stop
       >
-        <div v-if="organization.logo">
+        <div v-if="activeOrganization.logo">
           <div class="w-5 h-5 mr-1">
-            <img :src="organization.logo" alt="Logo" />
+            <img :src="activeOrganization.logo" alt="Logo" />
           </div>
         </div>
         <div class="max-w-full">
           <p
             class="text-gray-900 text-sm text-ellipsis truncate hover:text-brand-500 transition leading-relaxed"
           >
-            {{ organization.displayName || '-' }}
+            {{ activeOrganization.displayName || '-' }}
           </p>
         </div>
       </router-link>
@@ -69,27 +67,25 @@
     >{{ member.attributes.jobTitle.default }}
       {{ member.organizations.length ? 'at' : '' }}</span>
     <div
-      v-if="member.organizations.length"
+      v-if="activeOrganization"
       class="flex gap-2 flex-wrap max-w-[70%]"
     >
       <router-link
-        v-for="organization of props.member.organizations"
-        :key="organization.id"
         :to="{
           name: 'organizationView',
-          params: { id: organization.id },
+          params: { id: activeOrganization.id },
         }"
         class="badge--interactive"
         @click.stop
       >
         <img
-          v-if="organization.logo"
-          :src="organization.logo"
+          v-if="activeOrganization.logo"
+          :src="activeOrganization.logo"
           alt="Logo"
           class="w-3.5"
         />
         <span class="text-xs">{{
-          organization.displayName || '-'
+          activeOrganization.displayName || '-'
         }}</span>
       </router-link>
     </div>
@@ -100,7 +96,7 @@
 </template>
 
 <script setup>
-import { defineProps } from 'vue';
+import { computed } from 'vue';
 
 const props = defineProps({
   member: {
@@ -116,6 +112,27 @@ const props = defineProps({
     default: () => 'vertical',
   },
 });
+
+const activeOrganization = computed(() => {
+  if (!props.member.organizations?.length) {
+    return null;
+  }
+
+  return props.member.organizations.reduce((mostRecent, organization) => {
+    const mostRecentEndDate = new Date(mostRecent.memberOrganizations?.dateEnd);
+    const mostRecentStartDate = new Date(mostRecent.memberOrganizations?.dateStart);
+    const organizationEndDate = new Date(organization.memberOrganizations?.dateEnd);
+    const organizationStartDate = new Date(organization.memberOrganizations?.dateStart);
+    const isEndDateNull = !mostRecent.memberOrganizations?.dateEnd;
+
+    if ((organizationEndDate > mostRecentEndDate && !isEndDateNull)
+    || (organizationStartDate > mostRecentStartDate && isEndDateNull)) {
+      return organization;
+    }
+
+    return mostRecent;
+  }, props.member.organizations[0]);
+});
 </script>
 
 <script>
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 60f5b6a717..5ca4a6f7ca 100644
--- a/frontend/src/modules/member/components/view/_aside/_aside-enriched.vue
+++ b/frontend/src/modules/member/components/view/_aside/_aside-enriched.vue
@@ -1,31 +1,5 @@
 <template>
   <div>
-    <!-- Work experience -->
-    <div
-      v-if="member.attributes.workExperiences"
-      class="font-medium text-black mb-4"
-    >
-      Work experience
-    </div>
-    <app-member-custom-attributes-array-renderer
-      title="Work experience"
-      :attribute="member.attributes.workExperiences"
-      more-label="experiences"
-    >
-      <template #itemSlot="{ item }">
-        <div class="block py-3">
-          <div
-            class="text-xs text-gray-900 break-keep text-left"
-          >
-            {{ item.title }}
-          </div>
-          <div class="text-gray-500 text-2xs">
-            {{ item.company }}
-          </div>
-        </div>
-      </template>
-    </app-member-custom-attributes-array-renderer>
-
     <!-- Education -->
     <div
       v-if="member.attributes.education"
diff --git a/frontend/src/modules/member/components/view/_aside/_aside-organizations.vue b/frontend/src/modules/member/components/view/_aside/_aside-organizations.vue
new file mode 100644
index 0000000000..fc604c60f6
--- /dev/null
+++ b/frontend/src/modules/member/components/view/_aside/_aside-organizations.vue
@@ -0,0 +1,126 @@
+<template>
+  <div>
+    <div class="flex items-center justify-between">
+      <div class="font-medium text-black">
+        Organizations
+      </div>
+      <router-link
+        :to="{
+          name: 'memberEdit',
+          params: {
+            id: member.id,
+          },
+        }"
+        :class="{
+          'pointer-events-none cursor-not-allowed':
+            isEditLockedForSampleData,
+        }"
+      >
+        <el-button
+          class="btn btn-link btn-link--primary"
+          :disabled="isEditLockedForSampleData"
+        >
+          <i class="ri-pencil-line" /><span>Edit</span>
+        </el-button>
+      </router-link>
+    </div>
+
+    <div
+      v-if="member.organizations.length"
+      class="flex flex-col gap-4 mt-6"
+    >
+      <router-link
+        v-for="{
+          id,
+          logo,
+          name,
+          displayName,
+          memberOrganizations,
+        } of member.organizations"
+        :key="id"
+        :to="{
+          name: 'organizationView',
+          params: {
+            id,
+          },
+        }"
+        class="group hover:cursor-pointer"
+      >
+        <div
+          class="flex justify-start gap-3"
+          :class="{
+            'items-center': !hasValues(memberOrganizations),
+          }"
+        >
+          <div
+            class="min-w-[24px] w-6 h-6 rounded-md border border-gray-200 p-1 flex items-center justify-center overflow-hidden"
+            :class="{
+              'bg-white': logo,
+              'bg-gray-50': !logo,
+            }"
+          >
+            <img
+              v-if="logo"
+              :src="logo"
+              :alt="`${displayName || name} logo`"
+            />
+            <i
+              v-else
+              class="ri-community-line text-base text-gray-300"
+            />
+          </div>
+          <div class="flex flex-col gap-1">
+            <div
+              class="text-xs text-gray-900 group-hover:text-brand-500 transition font-medium"
+            >
+              {{ displayName || name }}
+            </div>
+            <div v-if="hasValues(memberOrganizations)" class="text-gray-600 text-2xs">
+              <span v-if="memberOrganizations.title">{{ memberOrganizations.title }}</span>
+              <span v-if="memberOrganizations.dateStart || memberOrganizations.dateEnd">
+                <span v-if="memberOrganizations.title" class="mx-1">•</span>
+                <span>
+                  {{ memberOrganizations.dateStart
+                    ? moment(memberOrganizations.dateStart).utc().format('MMMM YYYY')
+                    : 'Unkown' }}
+                </span>
+                <span class="mx-1 whitespace-nowrap">-></span>
+                <span>
+                  {{ memberOrganizations.dateEnd
+                    ? moment(memberOrganizations.dateEnd).utc().format('MMMM YYYY')
+                    : 'Present' }}
+                </span>
+              </span>
+            </div>
+          </div>
+        </div>
+      </router-link>
+    </div>
+    <div v-else class="text-gray-400 mt-6 text-sm">
+      No organizations
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { MemberPermissions } from '@/modules/member/member-permissions';
+import { mapGetters } from '@/shared/vuex/vuex.helpers';
+import { computed } from 'vue';
+import moment from 'moment';
+
+defineProps({
+  member: {
+    type: Object,
+    default: () => {},
+  },
+});
+
+const { currentTenant, currentUser } = mapGetters('auth');
+
+const isEditLockedForSampleData = computed(() => new MemberPermissions(
+  currentTenant.value,
+  currentUser.value,
+).editLockedForSampleData);
+
+const hasValues = (organizations) => Object.values(organizations || {}).some((v) => !!v);
+</script>
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 f6d84cfa4f..290f9b9aa0 100644
--- a/frontend/src/modules/member/components/view/member-view-aside.vue
+++ b/frontend/src/modules/member/components/view/member-view-aside.vue
@@ -8,6 +8,10 @@
 
     <div class="member-view-aside panel">
       <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"
@@ -21,11 +25,11 @@
 </template>
 
 <script setup>
-import { defineProps } from 'vue';
 import AppMemberEnrichment from '@/modules/member/components/member-enrichment.vue';
 import AppMemberAsideCustomAttributes from './_aside/_aside-custom-attributes.vue';
 import AppMemberAsideIdentities from './_aside/_aside-identities.vue';
 import AppMemberAsideEnriched from './_aside/_aside-enriched.vue';
+import AppLfMemberAsideOrganizations from './_aside/_aside-organizations.vue';
 
 defineProps({
   member: {
diff --git a/frontend/src/modules/member/member-model.js b/frontend/src/modules/member/member-model.js
index ff6e513370..3a91be60b4 100644
--- a/frontend/src/modules/member/member-model.js
+++ b/frontend/src/modules/member/member-model.js
@@ -34,6 +34,10 @@ const fields = {
     'attributes',
     label('attributes'),
   ),
+  name: new StringField(
+    'name',
+    'Name',
+  ),
   displayName: new StringField(
     'displayName',
     label('fullName'),
diff --git a/frontend/src/modules/member/pages/member-form-page.vue b/frontend/src/modules/member/pages/member-form-page.vue
index dcf6e6f8ec..7e115d0109 100644
--- a/frontend/src/modules/member/pages/member-form-page.vue
+++ b/frontend/src/modules/member/pages/member-form-page.vue
@@ -41,6 +41,12 @@
             <el-divider
               class="!mb-6 !mt-16 !border-gray-200"
             />
+            <app-member-form-organizations
+              v-model="formModel"
+            />
+            <el-divider
+              class="!mb-6 !mt-16 !border-gray-200"
+            />
             <app-member-form-attributes
               v-model="formModel"
               :attributes="computedAttributes"
@@ -115,6 +121,7 @@ import AppMemberFormDetails from '@/modules/member/components/form/member-form-d
 import AppMemberFormIdentities from '@/modules/member/components/form/member-form-identities.vue';
 import AppMemberFormAttributes from '@/modules/member/components/form/member-form-attributes.vue';
 import AppMemberGlobalAttributesDrawer from '@/modules/member/components/member-global-attributes-drawer.vue';
+import AppMemberFormOrganizations from '@/modules/member/components/form/member-form-organizations.vue';
 import { MemberModel } from '@/modules/member/member-model';
 import { FormSchema } from '@/shared/form/form-schema';
 import ConfirmDialog from '@/shared/dialog/confirm-dialog';
@@ -151,6 +158,7 @@ const { fields } = MemberModel;
 const formSchema = computed(
   () => new FormSchema([
     fields.displayName,
+    fields.name,
     fields.emails,
     fields.joinedAt,
     fields.tags,
@@ -188,6 +196,7 @@ function getInitialModel(r) {
     JSON.stringify(
       formSchema.value.initialValues({
         displayName: r ? r.displayName : '',
+        name: r ? r.name : '',
         emails: r ? r.emails : '',
         joinedAt: r ? r.joinedAt : '',
         attributes: r
@@ -340,7 +349,21 @@ async function onSubmit() {
     },
     ...formModel.value.organizations.length && {
       organizations: formModel.value.organizations.map(
-        (o) => o.id,
+        (o) => ({
+          id: o.id,
+          name: o.name,
+          ...o.memberOrganizations?.title && {
+            title: o.memberOrganizations?.title,
+          },
+          ...o.memberOrganizations?.dateStart && {
+            startDate: o.memberOrganizations?.dateStart,
+          },
+          ...o.memberOrganizations?.dateEnd && {
+            endDate: o.memberOrganizations?.dateEnd,
+          },
+        }),
+      ).filter(
+        (o) => !!o.id,
       ),
     },
     ...(Object.keys(formattedAttributes).length
diff --git a/frontend/src/modules/member/types/Member.ts b/frontend/src/modules/member/types/Member.ts
index 93ba3364cf..fc52bf48dd 100644
--- a/frontend/src/modules/member/types/Member.ts
+++ b/frontend/src/modules/member/types/Member.ts
@@ -1,3 +1,5 @@
+import { Organization } from '@/modules/organization/types/Organization';
+
 export interface MemberAttribute {
   default: string;
   custom: string;
@@ -45,7 +47,7 @@ export interface Member {
   lastEnriched: string | null;
   noMergeIds: string[] | null;
   numberOfOpenSourceContributions: number | null;
-  organizations: any[];
+  organizations: Organization[];
   reach:MemberReach;
   score: number;
   tags: MemberTag[];
diff --git a/frontend/src/modules/organization/organization-field.js b/frontend/src/modules/organization/organization-field.js
index be075a54ce..71b4edaff2 100644
--- a/frontend/src/modules/organization/organization-field.js
+++ b/frontend/src/modules/organization/organization-field.js
@@ -16,8 +16,8 @@ export class OrganizationField {
         }
 
         return {
-          id: record.id,
-          label: record.name,
+          ...record,
+          label: record.displayName,
         };
       },
       options,
diff --git a/frontend/src/modules/organization/types/Organization.ts b/frontend/src/modules/organization/types/Organization.ts
index 84f9174868..6aaaf52e83 100644
--- a/frontend/src/modules/organization/types/Organization.ts
+++ b/frontend/src/modules/organization/types/Organization.ts
@@ -43,4 +43,9 @@ export interface Organization{
   updatedById: string;
   url: string;
   website: string;
+  memberOrganizations: {
+    title: string;
+    dateStart: string;
+    dateEnd: string;
+  }
 }
diff --git a/frontend/src/shared/form/autocomplete-one-input.vue b/frontend/src/shared/form/autocomplete-one-input.vue
index 032a6d90e1..b4d1ef4e7a 100644
--- a/frontend/src/shared/form/autocomplete-one-input.vue
+++ b/frontend/src/shared/form/autocomplete-one-input.vue
@@ -5,7 +5,7 @@
     :loading="loading"
     :remote-method="handleSearch"
     :model-value="modelValue"
-    :clearable="true"
+    :clearable="clearable"
     :default-first-option="true"
     :filterable="true"
     :placeholder="placeholder || ''"
@@ -118,6 +118,14 @@ export default {
       type: Array,
       default: () => [],
     },
+    clearable: {
+      type: Boolean,
+      default: true,
+    },
+    storeKey: {
+      type: String,
+      default: null,
+    },
   },
   emits: ['update:modelValue'],
   data() {
@@ -164,13 +172,18 @@ export default {
         typeof query === 'string'
         && query !== ''
         && this.createIfNotFound
+        && !value
       ) {
-        // If value is a string, convert it to a db object
-        const newItem = await this.createFn(value);
+        const newItem = await this.createFn(query);
         this.localOptions.push(newItem);
         this.$emit('update:modelValue', newItem);
       } else {
-        this.$emit('update:modelValue', value || null);
+        this.$emit('update:modelValue', {
+          ...value,
+          ...this.storeKey && {
+            [this.storeKey]: this.modelValue[this.storeKey],
+          },
+        } || null);
       }
     },
 
@@ -187,7 +200,6 @@ export default {
 
     async fetchAllResults() {
       this.loading = true;
-
       try {
         this.localOptions = await this.fetchFn(
           this.currentQuery,
@@ -213,7 +225,6 @@ export default {
           value,
           AUTOCOMPLETE_SERVER_FETCH_SIZE,
         );
-
         this.loading = false;
       } catch (error) {
         console.error(error);