activist-org#560 update components to use basic event store

aasimsyed · Jul 1, 2024 · b3bbf9c · b3bbf9c
1 parent 13e3cbe
commit b3bbf9c
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 40 deletions.
diff --git a/frontend/components/card/CardConnect.vue b/frontend/components/card/CardConnect.vue
@@ -113,6 +113,7 @@
 <script setup lang="ts">
 import { Popover, PopoverButton, PopoverPanel } from "@headlessui/vue";
 import type { Organization } from "~/types/entities/organization";
+import type { Event } from "~/types/events/event";
 import { IconMap } from "~/types/icon-map";
 
 const props = defineProps<{
@@ -129,15 +130,17 @@ const idGroup = typeof paramsIDGroup === "string" ? paramsIDGroup : undefined;
 const organizationStore = useOrganizationStore();
 let organization: Organization;
 const group = useGroupStore();
-const event = useEventStore();
+const eventStore = useEventStore();
+let event: Event;
 
 if (props.pageType == "organization") {
   await organizationStore.fetchByID(id);
   organization = organizationStore.organization;
 } else if (props.pageType == "group") {
   await group.fetchByID(idGroup);
 } else if (props.pageType == "event") {
-  await event.fetchByID(id);
+  await eventStore.fetchByID(id);
+  event = eventStore.event;
 }
 
 const editModeEnabled = ref(false);

diff --git a/frontend/components/page/PageBreadcrumbs.vue b/frontend/components/page/PageBreadcrumbs.vue
@@ -76,6 +76,7 @@
 <script setup lang="ts">
 import { validate as isValidUUID } from "uuid";
 import type { Organization } from "~/types/entities/organization";
+import type { Event } from "~/types/events/event";
 
 const url = window.location.href;
 let pageType = "";
@@ -92,7 +93,8 @@ const idGroup = typeof paramsIDGroup === "string" ? paramsIDGroup : undefined;
 const organizationStore = useOrganizationStore();
 let organization: Organization;
 const group = useGroupStore();
-const event = useEventStore();
+const eventStore = useEventStore();
+let event: Event;
 
 if (
   url.includes("/organizations/") &&
@@ -109,10 +111,13 @@ if (
 } else if (
   url.includes("/events/") &&
   !url.includes("/organizations/") &&
-  !url.includes("/groups/")
+  !url.includes("/groups/") &&
+  !url.includes("/events/create") &&
+  !url.includes("/events/search")
 ) {
   pageType = "event";
-  await event.fetchByID(id);
+  await eventStore.fetchByID(id);
+  event = eventStore.event;
 }
 
 const breadcrumbs = ref<string[]>([]);

diff --git a/frontend/i18n/en-US.json b/frontend/i18n/en-US.json
@@ -523,7 +523,6 @@
   "pages.events.create.description-placeholder": "Please provide a description of the event for the community so that we can learn more about it",
   "pages.events.create.events-name-placeholder": "The name of the event",
   "pages.events.create.event-type": "Type",
-  "pages.events.create.event-type-placeholder": "(e.g. Learn, Action)",
   "pages.events.create.format": "Format",
   "pages.events.create.format-placeholder": "The format of the event (e.g. Protest, Seminar)",
   "pages.events.create.header-0": "Information",

diff --git a/frontend/pages/events/create.vue b/frontend/pages/events/create.vue
@@ -88,10 +88,7 @@
             />
           </div>
           <div class="mx-14 mt-5 w-full">
-            <CardConnect
-              :social-links="formData.social_accounts"
-              :userIsAdmin="true"
-            />
+            <CardConnect pageType="event" />
           </div>
           <div class="card-style mx-14 mt-5 w-full px-5 py-6">
             <label for="description" class="responsive-h3 block font-medium"

diff --git a/frontend/stores/event.ts b/frontend/stores/event.ts
@@ -4,30 +4,38 @@ import type {
   PiniaResEventText,
 } from "~/types/events/event";
 
+interface EventStore {
+  loading: boolean;
+  event: Event;
+  events: Event[];
+}
+
 export const useEventStore = defineStore("event", {
   // MARK: Properties
 
-  state: (): Event => ({
+  state: (): EventStore => ({
     loading: false,
 
-    // event
-    id: "",
-    name: "",
-    tagline: "",
-    createdBy: "",
-    iconURL: "",
-    type: "learn",
-    offlineLocation: "",
-    getInvolvedURL: "",
-    socialLinks: [""],
-    startTime: "",
-
-    // event_organizations
-    organizations: [],
-
-    // event_text
-    description: "",
-    getInvolved: "",
+    event: {
+      id: "",
+      name: "",
+      tagline: "",
+      createdBy: "",
+      iconURL: "",
+      type: "learn",
+      offlineLocation: "",
+      getInvolvedURL: "",
+      socialLinks: [""],
+      startTime: "",
+
+      // event_organizations
+      organizations: [],
+
+      // event_text
+      description: "",
+      getInvolved: "",
+    },
+    events: [],
   }),
   actions: {
     // MARK: Create
@@ -74,16 +82,16 @@ export const useEventStore = defineStore("event", {
       // const resources = eventRes._value;
       const texts = eventTextsRes._value.results[0];
 
-      this.id = event.id;
-      this.name = event.name;
-      this.tagline = event.tagline;
-      this.iconURL = event.iconURL;
-      this.offlineLocation = event.offlineLocation;
-      this.getInvolvedURL = event.getInvolvedURL;
-      this.socialLinks = event.socialLinks;
+      this.event.id = event.id;
+      this.event.name = event.name;
+      this.event.tagline = event.tagline;
+      this.event.iconURL = event.iconURL;
+      this.event.offlineLocation = event.offlineLocation;
+      this.event.getInvolvedURL = event.getInvolvedURL;
+      this.event.socialLinks = event.socialLinks;
 
-      this.description = texts.description;
-      this.getInvolved = texts.getInvolved;
+      this.event.description = texts.description;
+      this.event.getInvolved = texts.getInvolved;
 
       this.loading = false;
     },

diff --git a/frontend/types/events/event.d.ts b/frontend/types/events/event.d.ts
@@ -37,8 +37,6 @@ export interface Event {
   // support
   // supportingOrgs?: Organization[];
   // supportingUsers?: User[];
-
-  loading: boolean;
 }
 
 // MARK: Bridge Tables