diff --git a/src/components/CommunityComponents/CommunityHome.vue b/src/components/CommunityComponents/CommunityHome.vue
index bc068b83aaef9300e1211ffe3993c35558b84295..5ba88fc1c7d94bcb9c69fbe4f17c322cc50a13e9 100644
--- a/src/components/CommunityComponents/CommunityHome.vue
+++ b/src/components/CommunityComponents/CommunityHome.vue
@@ -6,69 +6,74 @@
<section v-else class="w-full px-5 py-4 mx-auto rounded-md">
<CommunityHeader :admin="false" class="mb-5" />
- <!-- Search field -->
- <div class="relative" id="searchComponent">
- <span class="absolute inset-y-0 left-0 flex items-center pl-3">
- <svg class="w-5 h-5 text-gray-400" viewBox="0 0 24 24" fill="none">
- <path
- d="M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z"
- stroke="currentColor"
- stroke-width="2"
- stroke-linecap="round"
- stroke-linejoin="round"
- ></path>
- </svg>
- </span>
-
- <input
- type="text"
- class="w-full py-3 pl-10 pr-4 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-primary-medium dark:focus:border-primary-medium focus:outline-none focus:ring"
- placeholder="Search"
- v-model="search"
- @change="searchWritten"
- />
+ <div v-if="!items.length" class="flex place-content-center text-gray-400">
+ Ingen gjenstander 氓 vise 馃ズ 馃憠馃憟
</div>
+ <div v-else>
+ <!-- Search field -->
+ <div class="relative" id="searchComponent">
+ <span class="absolute inset-y-0 left-0 flex items-center pl-3">
+ <svg class="w-5 h-5 text-gray-400" viewBox="0 0 24 24" fill="none">
+ <path
+ d="M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z"
+ stroke="currentColor"
+ stroke-width="2"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ ></path>
+ </svg>
+ </span>
- <div class="absolute inset-x-0 px-5 py-3">
- <!-- ItemCards -->
- <div class="flex items-center justify-center w-screen">
- <!-- Shows items based on pagination -->
- <div
- class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full"
- v-if="showItems"
- >
- <ItemCard
- v-for="item in visibleItems"
- :key="item"
- :item="item"
- @click="goToItemInfoPage(item.listingID)"
- />
+ <input
+ type="text"
+ class="w-full py-3 pl-10 pr-4 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-primary-medium dark:focus:border-primary-medium focus:outline-none focus:ring"
+ placeholder="Search"
+ v-model="search"
+ @change="searchWritten"
+ />
+ </div>
+
+ <div class="absolute inset-x-0 px-5 py-3">
+ <!-- ItemCards -->
+ <div class="flex items-center justify-center w-screen">
+ <!-- Shows items based on pagination -->
+ <div
+ class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full"
+ v-if="showItems"
+ >
+ <ItemCard
+ v-for="item in visibleItems"
+ :key="item"
+ :item="item"
+ @click="goToItemInfoPage(item.listingID)"
+ />
+ </div>
+
+ <!-- Shows items based on search field input -->
+ <div
+ class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full place-items-center"
+ v-if="showSearchedItems"
+ >
+ <ItemCard
+ v-for="item in searchedItems"
+ :key="item"
+ :item="item"
+ @click="goToItemInfoPage(item.listingID)"
+ />
+ </div>
</div>
- <!-- Shows items based on search field input -->
- <div
- class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full place-items-center"
- v-if="showSearchedItems"
- >
- <ItemCard
- v-for="item in searchedItems"
- :key="item"
- :item="item"
- @click="goToItemInfoPage(item.listingID)"
+ <!-- pagination -->
+ <div class="flex justify-center" v-if="showItems">
+ <PaginationTemplate
+ v-bind:items="items"
+ v-on:page:update="updatePage"
+ v-bind:currentPage="currentPage"
+ v-bind:pageSize="pageSize"
+ class="mt-10"
/>
</div>
</div>
-
- <!-- pagination -->
- <div class="flex justify-center" v-if="showItems">
- <PaginationTemplate
- v-bind:items="items"
- v-on:page:update="updatePage"
- v-bind:currentPage="currentPage"
- v-bind:pageSize="pageSize"
- class="mt-10"
- />
- </div>
</div>
</section>
</div>
diff --git a/src/components/CommunityComponents/CommunityList.vue b/src/components/CommunityComponents/CommunityList.vue
index 007c4a182536fc4fd6531eccd75e86ca08ebfa8c..b6641f92549da76ed1f956e600842d9b07615eb5 100644
--- a/src/components/CommunityComponents/CommunityList.vue
+++ b/src/components/CommunityComponents/CommunityList.vue
@@ -1,5 +1,8 @@
<template>
- <ul>
+ <p v-if="!communities.length" class="flex place-content-center text-gray-400">
+ Ingen grupper
+ </p>
+ <ul v-else>
<li v-for="community in communities" :key="community">
<CommunityListItem
:community="community"
diff --git a/src/components/ItemComponents/NewItemForm.vue b/src/components/ItemComponents/NewItemForm.vue
index 7d7140f9079c819c3dba0fac84afbb9f9cc63917..67ed1ebcc6ab09ca8977bb710f5f0becdd7a2149 100644
--- a/src/components/ItemComponents/NewItemForm.vue
+++ b/src/components/ItemComponents/NewItemForm.vue
@@ -95,7 +95,9 @@
</ul>
</div>
<!-- Error message for community -->
- <label class="text-error-medium text-sm block">{{ groupErrorMessage }}</label>
+ <label class="text-error-medium text-sm block">{{
+ groupErrorMessage
+ }}</label>
</div>
<!-- price -->
diff --git a/tests/unit/component-tests/community-component-tests/__snapshots__/community-list.spec.js.snap b/tests/unit/component-tests/community-component-tests/__snapshots__/community-list.spec.js.snap
index 0feda8234936c3b8b7a1ec27d48066f90615cdaf..52d4de639d8683ee0b575f40d2290c6ad383d554 100644
--- a/tests/unit/component-tests/community-component-tests/__snapshots__/community-list.spec.js.snap
+++ b/tests/unit/component-tests/community-component-tests/__snapshots__/community-list.spec.js.snap
@@ -1,10 +1,110 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`CommunityList component renders correctly 1`] = `
-<ul
- grouplist="[object Object],[object Object]"
->
+<ul>
+ <li>
+ <div
+ class="border-black"
+ >
+
+ <!-- Main modal -->
+ <!--v-if-->
+
+ <div
+ class="bg-white shadow dark:bg-gray-800 select-none cursor-pointer hover:bg-gray-50 flex items-center p-2"
+ >
+ <div
+ class="h-3 w-14 flex flex-col justify-center items-center ml-2 mt-4 mb-4 mr-2"
+ >
+ <img
+ alt="Fellsekaps bilde"
+ class="rounded-md"
+ src="string"
+ />
+ </div>
+ <div
+ class="flex-1 pl-1 overflow-hidden"
+ >
+ <div
+ class="font-medium dark:text-white truncate"
+ >
+ string
+ </div>
+ </div>
+ <div
+ class="flex flex-row justify-center items-center"
+ >
+ <svg
+ aria-hidden="true"
+ class="max-h-6 max-w-6 shrink m-2"
+ fill="none"
+ stroke="currentColor"
+ stroke-width="2"
+ viewBox="0 0 24 24"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <path
+ d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ />
+ </svg>
+ </div>
+ </div>
+ </div>
+ </li>
+ <li>
+ <div
+ class="border-black"
+ >
+
+ <!-- Main modal -->
+ <!--v-if-->
+
+ <div
+ class="bg-white shadow dark:bg-gray-800 select-none cursor-pointer hover:bg-gray-50 flex items-center p-2"
+ >
+ <div
+ class="h-3 w-14 flex flex-col justify-center items-center ml-2 mt-4 mb-4 mr-2"
+ >
+ <img
+ alt="Fellsekaps bilde"
+ class="rounded-md"
+ src="string"
+ />
+ </div>
+ <div
+ class="flex-1 pl-1 overflow-hidden"
+ >
+ <div
+ class="font-medium dark:text-white truncate"
+ >
+ string
+ </div>
+ </div>
+ <div
+ class="flex flex-row justify-center items-center"
+ >
+ <svg
+ aria-hidden="true"
+ class="max-h-6 max-w-6 shrink m-2"
+ fill="none"
+ stroke="currentColor"
+ stroke-width="2"
+ viewBox="0 0 24 24"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <path
+ d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ />
+ </svg>
+ </div>
+ </div>
+ </div>
+ </li>
</ul>
`;
diff --git a/tests/unit/component-tests/community-component-tests/community-list.spec.js b/tests/unit/component-tests/community-component-tests/community-list.spec.js
index fbd0968070e19814478e839c92245089f09013b8..1341e301a208a570b8d3f3cb009e311129e4f002 100644
--- a/tests/unit/component-tests/community-component-tests/community-list.spec.js
+++ b/tests/unit/component-tests/community-component-tests/community-list.spec.js
@@ -7,7 +7,7 @@ describe("CommunityList component", () => {
beforeEach(() => {
wrapper = mount(CommunityList, {
props: {
- groupList: [
+ communities: [
{
communityId: 0,
name: "string",