Add Event Images (#1070)

Co-authored-by: Alder Whiteford <[email protected]>

backend/entities/events/previews/models.go

@@ -15,6 +15,7 @@ type Common struct {
 	Link      string           `json:"link"`
 	StartTime time.Time        `json:"start_time"`
 	EndTime   time.Time        `json:"end_time"`
+	Image     string           `json:"image"`
 }
 
 type EventStub struct {

backend/entities/models/event.go

@@ -24,6 +24,8 @@ type Event struct {
 	Description string     `json:"description"`
 	Host        *uuid.UUID `json:"host"`
 
+	Image string `json:"image"`
+
 	// geoshi
 	EventType EventType `json:"event_type"`
 	Location  string    `json:"location"`

backend/migrations/000001_init.up.sql

@@ -89,6 +89,7 @@ CREATE TABLE IF NOT EXISTS "events"(
     created_at timestamp WITH time zone NOT NULL DEFAULT CURRENT_TIMESTAMP,
     updated_at timestamp WITH time zone NOT NULL DEFAULT CURRENT_TIMESTAMP,
     name varchar(255) NOT NULL,
+    image varchar(255),
     preview varchar(255) NOT NULL,
     description text NOT NULL,
     event_type event_type NOT NULL,

frontend/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@generatesac/lib",
-  "version": "0.0.189",
+  "version": "0.0.191",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

frontend/lib/src/types/event.ts

@@ -40,6 +40,7 @@ const eventSchemaIntermediate = z.object({
   start_time: z.string(),
   end_time: z.string(),
   location: z.string().max(255),
+  image: z.string().max(255).optional(),
   link: z.string().max(255).optional(),
   event_type: eventTypeEnum,
   is_recurring: z.boolean().optional(),
@@ -55,6 +56,7 @@ const eventPreviewSchemaIntermediate = z.object({
   event_type: eventTypeEnum,
   location: z.string().max(255),
   link: z.string().max(255).optional(),
+  image: z.string().max(255).optional(),
 
   start_time: z.string(),
   end_time: z.string(),

frontend/mobile/package.json

@@ -25,7 +25,7 @@
         "@fortawesome/free-solid-svg-icons": "^6.5.2",
         "@fortawesome/react-fontawesome": "^0.2.2",
         "@fortawesome/react-native-fontawesome": "^0.3.2",
-        "@generatesac/lib": "0.0.189",
+        "@generatesac/lib": "0.0.191",
         "@gorhom/bottom-sheet": "^4.6.3",
         "@hookform/resolvers": "^3.4.2",
         "@react-native-async-storage/async-storage": "^1.23.1",

frontend/mobile/src/app/app/event/[id].tsx

@@ -170,7 +170,7 @@ const EventPage = () => {
                 ) : (
                     <>
                         <AnimatedImageHeader
-                            uri={MockEvent.eventImage}
+                            uri={event.image as string}
                             imageHeight={IMG_HEIGHT}
                             scrollOffset={scrollOffset}
                             aspectRatio={1}

frontend/mobile/src/app/design-system/components/Calendar/parser/calendarParser.ts

@@ -6,15 +6,6 @@ import {
     EventSection
 } from '@/src/app/design-system/components/Calendar/DayTimeSection';
 
-const eventPreviewImages = [
-    'https://storage.googleapis.com/pod_public/1300/165117.jpg',
-    'https://images.photowall.com/products/51078/movie-poster-jaws.jpg?h=699&q=85',
-    'https://d3jmn01ri1fzgl.cloudfront.net/photoadking/webp_thumbnail/curious-blue-events-instagram-post-template-40q50e11b340f0.webp',
-    'https://d1csarkz8obe9u.cloudfront.net/posterpreviews/event-social-media-ad-design-template-6549b45cb5b52f594c8b37d7060c290d_screen.jpg?ts=1570209911',
-    'https://d3jmn01ri1fzgl.cloudfront.net/photoadking/webp_thumbnail/wild-sand-events-instagram-post-template-f767rn00607ef2.webp',
-    'https://images.template.net/59201/Red-Nose-Day-Event-Instagram-Post-Template.jpeg'
-];
-
 export function parseData(start: number, end: number, data?: EventPreview[]) {
     // Parsed data:
     const parsedData: EventSection[] = [];
@@ -72,9 +63,7 @@ export function parseData(start: number, end: number, data?: EventPreview[]) {
                 title: event.name,
                 startTime: event.start_time,
                 endTime: event.end_time,
-                image: eventPreviewImages[
-                    Math.floor(Math.random() * eventPreviewImages.length)
-                ],
+                image: event.image as string,
                 host_name: event.host_name,
                 host_logo:
                     event.host_logo ??

frontend/mobile/src/hooks/useEvent.ts

@@ -33,6 +33,7 @@ const useEvent = () => {
             // Fetch events
             getEvent(eventId).then(({ data: eventData }) => {
                 if (eventData) {
+                    console.log(eventData);
                     dispatch(setEvent(eventData));
                     dispatch(setClubId(eventData?.host));
                 }

frontend/mobile/src/store/slices/eventSlice.ts

@@ -44,6 +44,7 @@ export const eventSlice = createSlice({
             state.end_time = action.payload.end_time;
             state.location = action.payload.location;
             state.event_type = action.payload.event_type;
+            state.image = action.payload.image;
             state.is_archived = action.payload.is_archived;
             state.is_draft = action.payload.is_draft;
             state.is_recurring = action.payload.is_recurring;

frontend/mobile/yarn.lock

@@ -1402,10 +1402,10 @@
     humps "^2.0.1"
     prop-types "^15.7.2"
 
-"@generatesac/[email protected].189":
-  version "0.0.189"
-  resolved "https://registry.yarnpkg.com/@generatesac/lib/-/lib-0.0.189.tgz#fc532b0df1d814d74cd8e4fdcd55219aa087bf92"
-  integrity sha512-HewOUivTTC3+/y59UPlsdAemYKXFgv9ckxV5XHNb+F/LhhVal9feC4adWL4sPbm9wGGxBZrQq7XHU39ucnH3rA==
+"@generatesac/[email protected].191":
+  version "0.0.191"
+  resolved "https://registry.yarnpkg.com/@generatesac/lib/-/lib-0.0.191.tgz#3c999ee26ed1eaab77f8bd1f435d779990fabbba"
+  integrity sha512-8P0bPY4DNSW4fgTFVpS4EOR4dRgZ4aI+EJvce4RiBIXQLnfwfAbxEtr0M1xHimEZxLH7Lhe3HpUl7Lt0Qx8arQ==
   dependencies:
     "@reduxjs/toolkit" "^2.2.3"
     react "^18.2.0"

mock_data/.gitignore

@@ -1,3 +1,4 @@
 /bin
 /lib
-*.cfg
+*.cfg
+/.venv

mock_data/main.py

@@ -82,6 +82,13 @@
     ]
 }
 
+randomEventImageData = [
+    'https://i.imgur.com/TM29405.png',
+    'https://i.imgur.com/IfjHhrs.png',
+    'https://i.imgur.com/TQQ7AEE.png',
+    'https://i.imgur.com/Gp0Wwa8.png',
+]
+
 TAGS_STRING = ", ".join(f"\"{tag}\"" for tag in sum(MOCK_CATEGORIES_AND_TAGS.values(), [])) # for tags_prompt
 
 def description_prompt(name: str, preview: str) -> str:
@@ -218,11 +225,14 @@ def random_start_and_endtimes() -> tuple[datetime.datetime, datetime.datetime]:
             location = random.choice(["West Village H", "Curry Student Center", "Snell Library", "Krentzman Quad", "Marino", "ISEC", "ISEC 2"])
             if event_type == "online":
                 location = ""
+
+            image = random.choice(randomEventImageData)
 
             events.append({
                 "id": str(uuid4()),
                 "club_id": clubData["id"],
                 "name": f"Event for {clubData["name"]}",
+                "image": image,
                 "preview": "This club is holding an event.",
                 "description": event_description,
                 "event_type": event_type,
@@ -356,13 +366,14 @@ def fill_clubs():
 @transaction
 def fill_events():
     print("Creating event data...")
-    cmd = """INSERT INTO "events" ("id", "host", "name", "preview", "description", "event_type", "start_time", "end_time", "is_public", "is_draft", "is_archived") VALUES (%s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s)"""
+    cmd = """INSERT INTO "events" ("id", "host", "name", "image", "preview", "description", "event_type", "start_time", "end_time", "is_public", "is_draft", "is_archived") VALUES (%s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s)"""
 
     for event in events:
         data = (
             event['id'],
             event['club_id'],
             event['name'].replace("\'", "''"),
+            random.choice(randomEventImageData),
             event['preview'].replace("\'", "''"),
             event['description'].replace('\'', "''"),
             event['event_type'],