feat: add event page source cards

backend/src/embeddings/vector_store.py

@@ -1,4 +1,3 @@
-from uuid import uuid4
 from langchain_openai import OpenAIEmbeddings
 
 from langchain_pinecone import PineconeVectorStore

frontend/app/(authenticated)/events/[id]/event-details.tsx

@@ -19,7 +19,7 @@ const EventDetails = ({ event }: Props) => {
   );
 
   return (
-    <div className="flex flex-col px-6 text-muted-foreground font-medium space-y-2 md:space-y-4">
+    <div className="flex flex-col px-6 text-muted-foreground font-[450] space-y-2 md:space-y-4">
       <div className="grid grid-cols-12 gap-x-4 gap-y-3 place-items-start">
         <span className="flex items-center col-span-12 md:col-span-4 xl:col-span-3">
           <LayoutDashboardIcon

frontend/app/(authenticated)/events/[id]/event-source.tsx

@@ -0,0 +1,75 @@
+import { NewspaperIcon } from "lucide-react";
+
+import { ArticleSource } from "@/client";
+import Link from "@/components/navigation/link";
+import { Card } from "@/components/ui/card";
+import { Separator } from "@/components/ui/separator";
+import {
+  articleSourceToDisplayNameMap,
+  articleSourceToIconMap,
+} from "@/types/events";
+
+const EventSource = () => {
+  const originalArticles: {
+    name: string;
+    source: ArticleSource;
+    date: string;
+    articleUrl: string;
+  }[] = [
+    {
+      name: "Norris pips Verstappen to dramatic Singapore Grand Prix pole after Sainz crash",
+      source: "CNA",
+      date: "21 Sep 2024",
+      articleUrl:
+        "https://www.channelnewsasia.com/sport/singapore-grand-prix-gp-formula-1-qualifying-lando-norris-pole-4623041",
+    },
+    {
+      name: "Lando Norris wins F1 Singapore Grand Prix despite hitting wall twice – as it happened",
+      source: "GUARDIAN",
+      date: "22 Sep 2024",
+      articleUrl:
+        "https://www.theguardian.com/sport/live/2024/sep/22/singapore-grand-prix-formula-one-live?filterKeyEvents=false&page=with%3Ablock-66f022af8f0801142f2830e7",
+    },
+  ];
+
+  return (
+    <div className="flex flex-col px-6 gap-y-8">
+      <div className="flex flex-col gap-y-1">
+        <span className="flex items-center font-medium text-3xl mb-6">
+          <NewspaperIcon className="inline-flex mr-3 stroke-offblack fill-muted" />
+          Event source
+        </span>
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-x-12 gap-y-4">
+          {originalArticles.map((article) => {
+            const articleSource = article.source;
+            const sourceName = articleSourceToDisplayNameMap[articleSource];
+            const SourceIcon = articleSourceToIconMap[articleSource];
+            return (
+              <Card className="col-span-1" key={article.name}>
+                <div className="flex flex-col items-center h-fit p-6 gap-y-4">
+                  <SourceIcon />
+                  <div className="flex flex-col gap-y-4">
+                    <Link
+                      className="font-medium no-underline hover:underline"
+                      href={article.articleUrl}
+                      isExternal
+                    >
+                      {article.name}
+                    </Link>
+                    <div className="flex items-center text-muted-foreground gap-x-4">
+                      <span>{sourceName}</span>
+                      <Separator className="h-5" orientation="vertical" />
+                      <span>{article.date}</span>
+                    </div>
+                  </div>
+                </div>
+              </Card>
+            );
+          })}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default EventSource;

frontend/app/(authenticated)/events/[id]/page.tsx

@@ -9,6 +9,7 @@ import { getEvent } from "@/queries/event";
 
 import EventAnalysis from "./event-analysis";
 import EventDetails from "./event-details";
+import EventSource from "./event-source";
 import EventSummary from "./event-summary";
 
 const Page = ({ params }: { params: { id: string } }) => {
@@ -18,7 +19,7 @@ const Page = ({ params }: { params: { id: string } }) => {
   if (isLoading) {
     return (
       <div className="flex justify-center items-center w-full">
-        <LoadingSpinner className="w-24 h-24 stroke-green-700" />
+        <LoadingSpinner className="w-24 h-24" />
       </div>
     );
   }
@@ -46,6 +47,7 @@ const Page = ({ params }: { params: { id: string } }) => {
         <Separator className="my-10" />
         <EventAnalysis event={data} />
         <Separator className="my-10" />
+        <EventSource />
       </div>
     )
   );

frontend/app/not-found.tsx

@@ -1,6 +1,6 @@
-import JippyClown from "@/assets/jippy-clown";
 import Link from "@/components/navigation/link";
 import { Button } from "@/components/ui/button";
+import JippyClown from "@/public/jippy-clown";
 
 function AboutPage() {
   return (

frontend/client/client.ts

@@ -1,15 +1,15 @@
-export { createClient } from './core/';
+export { createClient } from "./core/";
 export type {
   Client,
   Config,
   Options,
   RequestOptions,
   RequestOptionsBase,
   RequestResult,
-} from './core/types';
+} from "./core/types";
 export {
   createConfig,
   formDataBodySerializer,
   jsonBodySerializer,
   urlSearchParamsBodySerializer,
-} from './core/utils';
+} from "./core/utils";

frontend/client/core/index.ts

@@ -1,8 +1,8 @@
-import type { AxiosError } from 'axios';
-import axios from 'axios';
+import type { AxiosError } from "axios";
+import axios from "axios";
 
-import type { Client, Config, RequestOptions } from './types';
-import { createConfig, getUrl, mergeConfigs, mergeHeaders } from './utils';
+import type { Client, Config, RequestOptions } from "./types";
+import { createConfig, getUrl, mergeConfigs, mergeHeaders } from "./utils";
 
 export const createClient = (config: Config): Client => {
   let _config = mergeConfigs(createConfig(), config);
@@ -23,7 +23,7 @@ export const createClient = (config: Config): Client => {
   };
 
   // @ts-expect-error
-  const request: Client['request'] = async (options) => {
+  const request: Client["request"] = async (options) => {
     const opts: RequestOptions = {
       ..._config,
       ...options,
@@ -51,7 +51,7 @@ export const createClient = (config: Config): Client => {
 
       let { data } = response;
 
-      if (opts.responseType === 'json' && opts.responseTransformer) {
+      if (opts.responseType === "json" && opts.responseTransformer) {
         data = await opts.responseTransformer(data);
       }
 
@@ -71,15 +71,15 @@ export const createClient = (config: Config): Client => {
   };
 
   return {
-    delete: (options) => request({ ...options, method: 'delete' }),
-    get: (options) => request({ ...options, method: 'get' }),
+    delete: (options) => request({ ...options, method: "delete" }),
+    get: (options) => request({ ...options, method: "get" }),
     getConfig,
-    head: (options) => request({ ...options, method: 'head' }),
+    head: (options) => request({ ...options, method: "head" }),
     instance,
-    options: (options) => request({ ...options, method: 'options' }),
-    patch: (options) => request({ ...options, method: 'patch' }),
-    post: (options) => request({ ...options, method: 'post' }),
-    put: (options) => request({ ...options, method: 'put' }),
+    options: (options) => request({ ...options, method: "options" }),
+    patch: (options) => request({ ...options, method: "patch" }),
+    post: (options) => request({ ...options, method: "post" }),
+    put: (options) => request({ ...options, method: "put" }),
     request,
     setConfig,
   } as Client;

frontend/client/core/types.ts

@@ -5,14 +5,14 @@ import type {
   AxiosResponse,
   AxiosStatic,
   CreateAxiosDefaults,
-} from 'axios';
+} from "axios";
 
-import type { BodySerializer } from './utils';
+import type { BodySerializer } from "./utils";
 
 type OmitKeys<T, K> = Pick<T, Exclude<keyof T, K>>;
 
 export interface Config<ThrowOnError extends boolean = boolean>
-  extends Omit<CreateAxiosDefaults, 'headers'> {
+  extends Omit<CreateAxiosDefaults, "headers"> {
   /**
    * Axios implementation. You can use this option to provide a custom
    * Axios instance.
@@ -37,7 +37,7 @@ export interface Config<ThrowOnError extends boolean = boolean>
    * {@link https://developer.mozilla.org/docs/Web/API/Headers/Headers#init See more}
    */
   headers?:
-    | CreateAxiosDefaults['headers']
+    | CreateAxiosDefaults["headers"]
     | Record<
         string,
         | string
@@ -54,15 +54,15 @@ export interface Config<ThrowOnError extends boolean = boolean>
    * {@link https://developer.mozilla.org/docs/Web/API/fetch#method See more}
    */
   method?:
-    | 'connect'
-    | 'delete'
-    | 'get'
-    | 'head'
-    | 'options'
-    | 'patch'
-    | 'post'
-    | 'put'
-    | 'trace';
+    | "connect"
+    | "delete"
+    | "get"
+    | "head"
+    | "options"
+    | "patch"
+    | "post"
+    | "put"
+    | "trace";
   /**
    * A function for transforming response data before it's returned to the
    * caller function. This is an ideal place to post-process server data,
@@ -99,16 +99,16 @@ type MethodFn = <
   TError = unknown,
   ThrowOnError extends boolean = false,
 >(
-  options: Omit<RequestOptionsBase<ThrowOnError>, 'method'>,
+  options: Omit<RequestOptionsBase<ThrowOnError>, "method">,
 ) => RequestResult<Data, TError, ThrowOnError>;
 
 type RequestFn = <
   Data = unknown,
   TError = unknown,
   ThrowOnError extends boolean = false,
 >(
-  options: Omit<RequestOptionsBase<ThrowOnError>, 'method'> &
-    Pick<Required<RequestOptionsBase<ThrowOnError>>, 'method'>,
+  options: Omit<RequestOptionsBase<ThrowOnError>, "method"> &
+    Pick<Required<RequestOptionsBase<ThrowOnError>>, "method">,
 ) => RequestResult<Data, TError, ThrowOnError>;
 
 export interface Client {
@@ -127,12 +127,12 @@ export interface Client {
 
 export type RequestOptions = RequestOptionsBase<false> &
   Config<false> & {
-    headers: AxiosRequestConfig['headers'];
+    headers: AxiosRequestConfig["headers"];
   };
 
 type OptionsBase<ThrowOnError extends boolean> = Omit<
   RequestOptionsBase<ThrowOnError>,
-  'url'
+  "url"
 > & {
   /**
    * You can provide a client instance returned by `createClient()` instead of
@@ -147,12 +147,12 @@ export type Options<
   ThrowOnError extends boolean = boolean,
 > = T extends { body?: any }
   ? T extends { headers?: any }
-    ? OmitKeys<OptionsBase<ThrowOnError>, 'body' | 'headers'> & T
-    : OmitKeys<OptionsBase<ThrowOnError>, 'body'> &
+    ? OmitKeys<OptionsBase<ThrowOnError>, "body" | "headers"> & T
+    : OmitKeys<OptionsBase<ThrowOnError>, "body"> &
         T &
-        Pick<OptionsBase<ThrowOnError>, 'headers'>
+        Pick<OptionsBase<ThrowOnError>, "headers">
   : T extends { headers?: any }
-    ? OmitKeys<OptionsBase<ThrowOnError>, 'headers'> &
+    ? OmitKeys<OptionsBase<ThrowOnError>, "headers"> &
         T &
-        Pick<OptionsBase<ThrowOnError>, 'body'>
+        Pick<OptionsBase<ThrowOnError>, "body">
     : OptionsBase<ThrowOnError> & T;