diff --git a/src/components/smart/FilterAanduidingsobject.vue b/src/components/smart/FilterAanduidingsobject.vue
index f2de691a..20a296cb 100644
--- a/src/components/smart/FilterAanduidingsobject.vue
+++ b/src/components/smart/FilterAanduidingsobject.vue
@@ -45,14 +45,12 @@ const updateValue = (value: IAutocompleteOption<IESAanduidingsobject>) => {
 const performAutocompleteSearch = async (searchTerm: string): Promise<IAutocompleteOption[]> => {
   try {
     aanduidingsobjecten.value = await inventarisApiService.getAanduidingsobjecten(`${searchTerm}*`);
-    const autocompleteData: IAutocompleteOption[] = aanduidingsobjecten.value.map((ao) => {
+    return aanduidingsobjecten.value.map((ao) => {
       return {
         title: ao.titel,
         value: ao.uri,
       };
     });
-
-    return autocompleteData;
   } catch (error) {
     console.error('Error fetching autocomplete data:', error);
     return Promise.resolve([]);
diff --git a/src/stories/smart-components/filter-aoe-actor.stories.ts b/src/stories/smart-components/filter-aoe-actor.stories.ts
index 87b7f21b..297daa2d 100644
--- a/src/stories/smart-components/filter-aoe-actor.stories.ts
+++ b/src/stories/smart-components/filter-aoe-actor.stories.ts
@@ -64,4 +64,19 @@ export const Default: Story = {
     api: 'https://dev-actoren.onroerenderfgoed.be',
     id: 'my-id',
   },
+  render: () => ({
+    components: {
+      FilterAOEActor,
+    },
+    setup() {
+      const api = 'https://dev-actoren.onroerenderfgoed.be';
+      const getSsoToken = async () => 'vul hier bearer token in';
+      return { api, getSsoToken };
+    },
+    template: `
+    <div>
+      <filter-a-o-e-actor :api="api" :get-sso-token="getSsoToken" />
+    </div>
+    `,
+  }),
 };
diff --git a/src/stories/smart-components/filter-gemeente.stories.ts b/src/stories/smart-components/filter-gemeente.stories.ts
index 42f537f1..37e6a589 100644
--- a/src/stories/smart-components/filter-gemeente.stories.ts
+++ b/src/stories/smart-components/filter-gemeente.stories.ts
@@ -1,5 +1,6 @@
 import '@/scss/main.scss';
 import FilterGemeente from '../../components/smart/FilterGemeente.vue';
+import type { IGemeente } from '../../models';
 import type { Meta, StoryObj } from '@storybook/vue3';
 
 // More on how to set up stories at: https://storybook.js.org/docs/vue/writing-stories/introduction
@@ -42,6 +43,25 @@ const meta: Meta<typeof FilterGemeente> = {
       },
     },
   },
+  render: (args) => ({
+    components: { FilterGemeente },
+    inheritAttrs: false,
+    setup() {
+      return { args };
+    },
+    template: `
+      <div>
+      <Suspense>
+        <FilterGemeente v-bind="args" @update:value="onUpdateGemeente" />
+      </Suspense>
+      </div>
+    `,
+    methods: {
+      onUpdateGemeente(payload: IGemeente) {
+        args.value = payload.niscode;
+      },
+    },
+  }),
 };
 
 export default meta;
diff --git a/src/stories/smart-components/filter-provincie.stories.ts b/src/stories/smart-components/filter-provincie.stories.ts
index 4b24a6b3..9339594f 100644
--- a/src/stories/smart-components/filter-provincie.stories.ts
+++ b/src/stories/smart-components/filter-provincie.stories.ts
@@ -1,5 +1,6 @@
 import '@/scss/main.scss';
 import FilterProvincie from '../../components/smart/FilterProvincie.vue';
+import type { IProvincie } from '../../models';
 import type { Meta, StoryObj } from '@storybook/vue3';
 
 // More on how to set up stories at: https://storybook.js.org/docs/vue/writing-stories/introduction
@@ -42,6 +43,25 @@ const meta: Meta<typeof FilterProvincie> = {
       },
     },
   },
+  render: (args) => ({
+    components: { FilterProvincie },
+    inheritAttrs: false,
+    setup() {
+      return { args };
+    },
+    template: `
+      <div>
+      <Suspense>
+        <FilterProvincie v-bind="args" @update:value="onUpdateProvincie" />
+      </Suspense>
+      </div>
+    `,
+    methods: {
+      onUpdateProvincie(payload: IProvincie) {
+        args.value = payload.niscode;
+      },
+    },
+  }),
 };
 
 export default meta;