diff --git a/src/components/BaseComponents/InputField.vue b/src/components/BaseComponents/InputField.vue
new file mode 100644
index 0000000000000000000000000000000000000000..46fb4fc61a3e964c7c768148f3f546b92e2fa1cf
--- /dev/null
+++ b/src/components/BaseComponents/InputField.vue
@@ -0,0 +1,10 @@
+<template>
+ <input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+ />
+</template>
+
+<script>
+export default {
+ name: "InputField"
+}
+</script>
\ No newline at end of file
diff --git a/src/components/CommunityComponents/NewCommunityForm.vue b/src/components/CommunityComponents/NewCommunityForm.vue
index 89fefade21d432348c0e6263d5a86236eb9b1af1..28bf92fb184781619c1ed9c842b83485578017ca 100644
--- a/src/components/CommunityComponents/NewCommunityForm.vue
+++ b/src/components/CommunityComponents/NewCommunityForm.vue
@@ -1,9 +1,7 @@
<template>
<div class="w-full max-w-sm m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[10%] p-4">
<!-- Component heading -->
- <div class="flex justify-center mt-6">
- <p class="text-4xl">Opprett Gruppe</p>
- </div>
+ <h3 class="text-xl font-medium text-center text-gray-600 dark:text-gray-200 mt-4 mb-8">Opprett ny gruppe</h3>
<!-- Radio boxes -->
<div class="mt-6">
@@ -59,7 +57,7 @@
<input
type="text"
id="title"
- class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
v-model="v$.group.name.$model"
required
/>
@@ -84,7 +82,7 @@
>
<input
type="text"
- class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
v-model="v$.group.place.$model"
required
/>
@@ -112,7 +110,7 @@
id="description"
rows="4"
v-model="v$.group.description.$model"
- class="block p-2.5 w-full text-sm text-gray-900 bg-gray-200 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
required
></textarea>
diff --git a/src/components/CommunityComponents/NewItemForm.vue b/src/components/CommunityComponents/NewItemForm.vue
index 8e7c69cd1b323549085dade4b541cc2af6e11056..da1a6e52f5a44682c03fe45e8f1cb3587c88e2c3 100644
--- a/src/components/CommunityComponents/NewItemForm.vue
+++ b/src/components/CommunityComponents/NewItemForm.vue
@@ -1,9 +1,7 @@
<template>
<div class="w-full max-w-sm m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[3%] p-4">
<!-- Component heading -->
- <div class="flex justify-center ">
- <p class="text-4xl mb-6 mt-6">Utleie</p>
- </div>
+ <h3 class="text-xl font-medium text-center text-gray-600 dark:text-gray-200 mt-4 mb-8">Utleie</h3>
<!-- Title -->
<div class="mb-6" :class="{ error: v$.item.title.$errors.length }">
@@ -15,7 +13,7 @@
<input
type="text"
id="title"
- class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
v-model="v$.item.title.$model"
required
/>
@@ -42,7 +40,7 @@
<select
v-model="v$.item.select.$model"
id="categories"
- class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
>
<option class="text-gray-400" value="" disabled selected>
Select a category
@@ -76,7 +74,7 @@
>
<select
v-model="v$.item.selectGroup.$model"
- class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
>
<option class="text-gray-400" value="" disabled selected>
Select a Group
@@ -113,7 +111,7 @@
type="number"
v-model="v$.item.price.$model"
id="price"
- class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
required
/>
@@ -140,7 +138,7 @@
id="description"
rows="4"
v-model="v$.item.description.$model"
- class="block p-2.5 w-full text-sm text-gray-900 bg-gray-200 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
required
></textarea>
@@ -164,7 +162,7 @@
>
<input
type="text"
- class="bg-gray-200 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+ class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
v-model="v$.item.address.$model"
id="adress"
required
@@ -200,12 +198,10 @@
accept="image/png, image/jpeg"
/>
- <button
+ <Button
+ :text="'Velg bilde'"
@click="$refs.file.click()"
- class="text-black bg-gray-200 hover:bg-grey-800 focus:ring-4 focus:outline-none focus:ring-grey-300 font-medium rounded-lg text-sm sm:w-auto px-5 py-2.5 text-center dark:bg-grey-600 dark:hover:bg-grey-700 dark:focus:ring-grey-800"
- >
- Velg bilde
- </button>
+ />
<div v-for="image in item.images" :key="image" class="m-2">
<img :src="image" class="w-2/5 inline" alt="Bilde av gjenstanden" />
@@ -214,13 +210,12 @@
<!-- Save item button -->
<div class="flex justify-center">
- <button
+ <Button
+ :text="'Lagre'"
@click="saveClicked"
- class="content-center text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
id="saveButton"
- >
- Lagre
- </button>
+ />
+
</div>
</div>
</template>
@@ -229,6 +224,7 @@
import useVuelidate from "@vuelidate/core";
import { parseUserFromToken } from "@/utils/token-utils";
import { postNewItem } from "@/utils/apiutil";
+import Button from "@/components/BaseComponents/ColoredButton";
import {
required,
@@ -241,6 +237,10 @@ import {
export default {
name: "AddNewItem",
+ components:{
+ Button,
+ },
+
setup() {
return { v$: useVuelidate() };
},
diff --git a/src/components/FormComponents/LoginForm.vue b/src/components/FormComponents/LoginForm.vue
index c62610798b3befba8772f8ddc8211a03a982a55d..b493d4c60a933ecaff7abc65990993e92290d821 100644
--- a/src/components/FormComponents/LoginForm.vue
+++ b/src/components/FormComponents/LoginForm.vue
@@ -1,17 +1,17 @@
<template>
- <div class="w-full max-w-sm m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[10%]">
+ <div class="w-full max-w-md m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[10%]">
<div class="px-6 py-4 mt-4">
- <h3 class="text-xl font-medium text-center text-gray-600 dark:text-gray-200">Logg på</h3>
+ <h3 class="text-xl font-medium text-center text-gray-600 dark:text-gray-200 mt-4 mb-8">Logg på</h3>
<div>
- <div class="w-full mt-6" :class="{ error: v$.user.password.$errors.length }">
+ <div class="w-full mt-6" :class="{ error: v$.user.email.$errors.length }">
<input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
type="email"
- placeholder="Skriv inn din e-postadresse *"
- v-model="v$.user.email.$model"
- required
- />
+ placeholder="Skriv inn din e-postadresse *"
+ v-model="v$.user.email.$model"
+ required
+ />
<!-- error message -->
<div v-for="(error, index) of v$.user.email.$errors" :key="index">
<div
@@ -48,8 +48,8 @@
</div>
</div>
- <div class="flex items-center justify-between mt-4">
- <a href="#" class="text-sm text-gray-600 dark:text-gray-200 hover:text-gray-500">Glemt passord?</a>
+ <div class="flex items-center justify-between mt-8 ">
+ <router-link to="/resetPassword" class="text-blue-500">Glemt passord?</router-link>
<Button @click="loginClicked" :text="'Logg på'"></Button>
</div>
@@ -74,6 +74,9 @@ import Button from "@/components/BaseComponents/ColoredButton"
export default {
name: "LoginForm.vue",
+ components: {
+ Button,
+ },
setup() {
return { v$: useVuelidate() };
},
@@ -105,6 +108,7 @@ export default {
methods: {
async loginClicked() {
+
this.showError = true;
this.v$.user.$touch();
@@ -123,7 +127,6 @@ export default {
if (loginResponse.isLoggedIn === false) {
this.message = "Feil e-post/passord";
- this.$store.commit("logout");
} else if (loginResponse.isLoggedIn === true) {
this.$store.commit("saveToken", loginResponse.token);
await this.$router.push("/");
@@ -131,13 +134,6 @@ export default {
console.log("Something went wrong");
}
},
-
- validate() {
- this.$refs.form.validate();
- },
},
- components: {
- Button,
- }
};
</script>
diff --git a/src/components/FormComponents/RegisterForm.vue b/src/components/FormComponents/RegisterForm.vue
index b96eaecf4cf4e2d424d51d364ed42999ce1c8855..250a3ac44810cf2fa213f1933d73c39742da89a0 100644
--- a/src/components/FormComponents/RegisterForm.vue
+++ b/src/components/FormComponents/RegisterForm.vue
@@ -1,70 +1,64 @@
<template>
<div
- class="w-full max-w-sm m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[10%] p-4"
+ class="w-full max-w-md m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[10%] p-4"
>
- <h3 class="text-xl font-medium text-center text-gray-600 dark:text-gray-200">Opprett ny bruker</h3>
+ <h3 class="text-xl font-medium text-center text-gray-600 dark:text-gray-200 mt-4 mb-8">Opprett ny bruker</h3>
<form @submit.prevent>
- <div class="grid grid-cols-1 gap-6 mt-4 sm:grid-cols-2">
- <div>
- <input
- v-model="email"
- id="email"
+ <div class="grid grid-cols-1 gap-6 mt-4">
+ <div >
+ <input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+ v-model="email"
+ id="email"
type="email"
placeholder="E-post adresse"
- class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-200 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 focus:ring-blue-300 focus:ring-opacity-40 dark:focus:border-blue-300 focus:outline-none focus:ring"
- />
+ />
</div>
- <div>
- <input
- v-model="password"
- id="password"
+ <div class="w-full">
+ <input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+ v-model="password"
+ id="password"
type="password"
placeholder="Passord"
- class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-200 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 focus:ring-blue-300 focus:ring-opacity-40 dark:focus:border-blue-300 focus:outline-none focus:ring"
- />
+ />
</div>
<div>
- <input
- v-model="confirmPassword"
+ <input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+ v-model="confirmPassword"
id="confirmPassword"
type="password"
placeholder="Bekreft passord"
- class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-200 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 focus:ring-blue-300 focus:ring-opacity-40 dark:focus:border-blue-300 focus:outline-none focus:ring"
- />
+ />
</div>
<div>
- <input
- data-test="firstNameTest"
+ <input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+ data-test="firstNameTest"
v-model="firstName"
id="firstName"
type="text"
placeholder="Fornavn"
- class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-200 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 focus:ring-blue-300 focus:ring-opacity-40 dark:focus:border-blue-300 focus:outline-none focus:ring"
- />
+ />
</div>
<div>
- <input
- v-model="lastName"
+ <input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+ v-model="lastName"
id="lastName"
type="text"
placeholder="Etternavn"
- class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-200 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 focus:ring-blue-300 focus:ring-opacity-40 dark:focus:border-blue-300 focus:outline-none focus:ring"
- />
+ />
</div>
<div>
- <input
- v-model="address"
+ <input class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+ v-model="address"
id="address"
type="text"
placeholder="Adresse"
- class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-200 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 focus:ring-blue-300 focus:ring-opacity-40 dark:focus:border-blue-300 focus:outline-none focus:ring"
- />
+ />
</div>
</div>
diff --git a/src/components/UserProfileComponents/LargeProfileCard.vue b/src/components/UserProfileComponents/LargeProfileCard.vue
index 7c126c58df842c78676d714262dd979a27bd6041..5d8f87603e1cbe47fb7d30fb6a499d2be05731f7 100644
--- a/src/components/UserProfileComponents/LargeProfileCard.vue
+++ b/src/components/UserProfileComponents/LargeProfileCard.vue
@@ -1,6 +1,6 @@
<template>
<div
- class="w-full max-w-sm m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[10%] p-6"
+ class="w-full max-w-xl m-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl mt-[10%] p-6"
>
<div v-show="isCurrentUser" class="float-right px-4 pt-4">
<button
@@ -25,9 +25,9 @@
<div
id="dropdown"
v-show="dropdown"
- class="z-10 w-44 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700 origin-bottom-left absolute"
+ class="z-10 w-44 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700 "
>
- <ul class="py-1" aria-labelledby="dropdownDefault">
+ <ul class="py-1 absolute bg-white" aria-labelledby="dropdownDefault">
<li>
<router-link
to=""
diff --git a/src/views/CommunityViews/CommunityView.vue b/src/views/CommunityViews/CommunityView.vue
index 3a7300a1838fe6b3f17ab9ae83a585db9ee7f388..a6ef26f4da4f0b75dc62ec9a9d0a80c698851f60 100644
--- a/src/views/CommunityViews/CommunityView.vue
+++ b/src/views/CommunityViews/CommunityView.vue
@@ -1,57 +1,49 @@
<template>
- <div class="max-w-sm m-auto">
- <div >
- <img
- class="cursor-pointer h-8 float-right"
- v-if="isLoggedIn"
- src="@/assets/newCommunity.png"
- alt="Legg til gruppe"
- @click="$router.push('/createNewGroup')"
- />
- </div>
- <div>
- <div id="myGroups" v-if="isLoggedIn">
- <div class="m-4" >Mine grupper:</div>
- <group-list :groupList="myGroups" />
- </div>
- <div id="localGroups">
- <div class="m-4">Offentlige grupper:</div>
- <group-list :groupList="localGroups" />
+ <div v-if="loggedIn">
+ <div class="flex flex-row p-4 relative">
+ <p class="capitalize font-bold w-full">Mine felleskap</p>
+ <PlusIcon
+ class="cursor-pointer max-h-6 max-w-6 float-right grow"
+ @click="$router.push('/createNewGroup')"
+ v-if="loggedIn"
+ alt="Lag ett nytt felleskap"
+ />
</div>
+ <CommunityList :communities="myCommunities" :member="true" />
</div>
- </div>
+ <p class="capitalize font-bold w-full p-4">Offentlige felleskap</p>
+ <CommunityList :communities="publicCommunities" :member="false" />
</template>
<script>
-import GroupList from "@/components/CommunityComponents/CommunityList.vue";
+import CommunityList from "@/components/CommunityComponents/CommunityList.vue";
import { getMyGroups, getVisibleGroups } from "@/utils/apiutil";
+import { PlusIcon } from "@heroicons/vue/outline";
export default {
name: "HomeView",
data() {
return {
- isLoggedIn: false,
- myGroups: [],
- localGroups: [],
+ loggedIn: false,
+ myCommunities: [],
+ publicCommunities: [],
};
},
components: {
- GroupList,
- },
- methods: {
- async getMyGroups() {
- this.myGroups = await getMyGroups();
- },
- async getPotentialGroups() {
- this.localGroups = await getVisibleGroups();
- },
+ CommunityList,
+ PlusIcon,
},
async created() {
- await this.getMyGroups();
- await this.getPotentialGroups();
- if(this.$store.state.user.token !== null){
- this.isLoggedIn = true
- }
- },
+ this.publicCommunities = await getVisibleGroups();
+ this.loggedIn = this.$store.state.user.token !== null;
+ if (!this.loggedIn) return;
+
+ this.myCommunities = await getMyGroups();
+
+ // Remove all of the user's communities from the public communities arrays
+ this.publicCommunities = this.publicCommunities.filter(
+ (val) => !this.myCommunities.includes(val)
+ );
+ },
};
</script>