Clean up directory pages + remove like button

src/app/directory/[id]/page.tsx

@@ -1,10 +1,8 @@
-import ClubDocuments from '@src/components/ClubDocuments';
 import Header from '@src/components/BaseHeader';
 import OrgHeader from '@src/components/OrgHeader';
 import OrgInfoSegment from '@src/components/OrgInfoSegment';
 import OrgUpcomingEvents from '@src/components/OrgUpcomingEvents';
 import { api } from '@src/trpc/server';
-import { PlusIcon } from '@src/icons/Icons';
 import { db } from '@src/server/db';
 import { eq } from 'drizzle-orm';
 import { type Metadata } from 'next';
@@ -21,14 +19,6 @@ const OrganizationPage = async ({ params }: { params: { id: string } }) => {
         <OrgHeader club={club} />
         <OrgInfoSegment club={club} />
         <OrgUpcomingEvents clubId={club.id} />
-        <ClubDocuments />
-        <div className="flex h-full w-full flex-row items-center justify-between rounded-lg bg-blue-100 px-14 py-7">
-          <div className="text-lg font-bold text-blue-primary">Promo text</div>
-          <button className="flex w-fit flex-row items-center justify-center rounded-3xl bg-blue-primary py-2.5 pl-5 pr-6 text-center text-xs font-extrabold text-white transition-colors hover:bg-blue-700">
-            <PlusIcon />
-            <div>Apply</div>
-          </button>
-        </div>
       </div>
     </main>
   );

src/components/ContactIcons.tsx

@@ -120,34 +120,21 @@ export const Email = ({ className }: IconProps) => {
     </svg>
   );
 };
+const logoStyling = 'fill-slate-800 transition-colors group-hover:fill-white';
 export const logo: logoProps = {
-  discord: (
-    <Discord className="fill-slate-300 transition-colors group-hover:fill-white" />
-  ),
+  discord: <Discord className={logoStyling} />,
 
-  youtube: (
-    <Youtube className="fill-slate-300 transition-colors group-hover:fill-white" />
-  ),
+  youtube: <Youtube className={logoStyling} />,
 
   twitch: '/nebula-logo.png',
 
-  facebook: (
-    <Facebook className="fill-slate-300 transition-colors group-hover:fill-white" />
-  ),
+  facebook: <Facebook className={logoStyling} />,
 
-  twitter: (
-    <Twitter className="fill-slate-300 transition-colors group-hover:fill-white" />
-  ),
+  twitter: <Twitter className={logoStyling} />,
 
-  instagram: (
-    <Instagram className="fill-slate-300 transition-colors group-hover:fill-white" />
-  ),
-  website: (
-    <Website className="fill-slate-300 transition-colors group-hover:fill-white" />
-  ),
-  email: (
-    <Email className="fill-slate-300 transition-colors group-hover:fill-white" />
-  ),
+  instagram: <Instagram className={logoStyling} />,
+  website: <Website className={logoStyling} />,
+  email: <Email className={logoStyling} />,
 
   other: '/Jupiter.png',
 } as const;

src/components/DirectoryOrgs.tsx

@@ -2,7 +2,6 @@ import { type FC } from 'react';
 import Image from 'next/image';
 import type { SelectClub as Club } from '@src/server/db/models';
 import JoinButton from './JoinButton';
-import LikeButton from './LikeButton';
 import Link from 'next/link';
 import { type Session } from 'next-auth';
 
@@ -25,11 +24,6 @@ const OrgDirectoryCards: FC<Props> = ({ club, session, priority }) => {
           priority={priority}
           className="select-none object-cover"
         />
-        <div className="absolute left-2 right-2 top-2 flex h-fit flex-row items-center space-x-2">
-          <button className="ml-auto rounded-full bg-black bg-opacity-50 p-1.5 font-bold text-white transition-colors">
-            <LikeButton />
-          </button>
-        </div>
       </div>
       <div className="flex flex-col space-y-2 p-6">
         <h1 className="line-clamp-1 text-2xl font-medium text-slate-800 md:text-xl">

src/components/OrgHeader.tsx

@@ -6,7 +6,6 @@ import type {
 } from '@src/server/db/models';
 import JoinButton from './JoinButton';
 import { getServerAuthSession } from '@src/server/auth';
-import LikeButton from './LikeButton';
 import Link from 'next/link';
 import { api } from '@src/trpc/server';
 
@@ -21,10 +20,14 @@ const OrgHeader = async ({ club }: { club: Club }) => {
     <div className="relative">
       <div className="h-full w-full">
         <Image
-          src={club.image}
+          src={'/images/wideWave.jpg'}
           alt="Picture of the club"
-          width={400}
+          style={{
+            width: '100%',
+            height: 'auto',
+          }}
           height={150}
+          width={450}
           className="rounded-lg object-cover"
           priority
         />
@@ -70,12 +73,6 @@ const OrgHeader = async ({ club }: { club: Club }) => {
                   clubID={club.id}
                   isJoined={memberType !== undefined}
                 />
-                <button
-                  className="rounded-full bg-blue-primary p-2.5 transition-colors hover:bg-blue-700"
-                  type="button"
-                >
-                  <LikeButton />
-                </button>
               </>
             )}
             <ContactButtons contacts={club.contacts || []} />

src/server/db/index.ts

@@ -19,4 +19,6 @@ const schema = {
   ...admin,
 };
 
-export const db = drizzle(postgres(env.DATABASE_URL), { schema });
+export const db = drizzle(postgres(env.DATABASE_URL, { prepare: false }), {
+  schema,
+});