rename orgs to clubs in all locations

src/app/admin/carousel/add/page.tsx

@@ -1,12 +1,12 @@
-import AddOrg from '@src/components/admin/AddOrg';
+import AddClub from '@src/components/admin/AddClub';
 
 export default function Page() {
   return (
     <div className="m-5 md:pl-72">
       <h1 className="text-center text-4xl font-bold text-black">
-        Add Orgs to Carousel
+        Add Clubs to Carousel
       </h1>
-      <AddOrg />
+      <AddClub />
     </div>
   );
 }

src/app/admin/orgs/[id]/page.tsx → src/app/admin/clubs/[id]/page.tsx

@@ -1,5 +1,5 @@
-import ApprovedOrg from '@src/components/admin/ApprovedOrg';
-import OtherOrgStatus from '@src/components/admin/OtherOrgStatus';
+import ApprovedClub from '@src/components/admin/ApprovedClub';
+import OtherClubStatus from '@src/components/admin/OtherClubStatus';
 import { db } from '@src/server/db';
 import { eq } from 'drizzle-orm';
 import { notFound } from 'next/navigation';
@@ -16,9 +16,9 @@ export default async function Page({ params: { id } }: Props) {
     <div className="m-5 h-screen md:pl-72">
       <h1 className="text-center text-4xl font-bold">{org.name}</h1>
       {org.approved === 'approved' ? (
-        <ApprovedOrg org={org} />
+        <ApprovedClub club={org} />
       ) : (
-        <OtherOrgStatus org={org} />
+        <OtherClubStatus club={org} />
       )}
     </div>
   );

src/app/admin/orgs/page.tsx → src/app/admin/clubs/page.tsx

@@ -1,11 +1,11 @@
-import OrgTable from '@src/components/admin/OrgTable';
+import ClubTable from '@src/components/admin/ClubTable';
 import { api } from '@src/trpc/server';
 
 export default async function Page() {
-  const clubs = await api.admin.allOrgs();
+  const clubs = await api.admin.allClubs();
   return (
     <div className="m-5 md:pl-72">
-      <OrgTable clubs={clubs} />
+      <ClubTable clubs={clubs} />
     </div>
   );
 }

src/app/admin/page.tsx

@@ -8,10 +8,10 @@ export default function Page() {
       </h1>
       <div className="flex justify-center gap-x-5 pt-20">
         <Link
-          href="/admin/orgs"
+          href="/admin/clubs"
           className="rounded-md bg-slate-300 px-2 py-1 text-blue-500 transition-colors hover:bg-slate-400 hover:text-blue-600"
         >
-          Manage Orgs
+          Manage Clubs
         </Link>
         <Link
           href="/admin/users"

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

@@ -1,30 +1,30 @@
 import Header from '@src/components/header/BaseHeader';
-import OrgHeader from '@src/components/club/listing/OrgHeader';
-import OrgInfoSegment from '@src/components/club/listing/OrgInfoSegment';
-import OrgUpcomingEvents from '@src/components/club/listing/OrgUpcomingEvents';
+import ClubHeader from '@src/components/club/listing/ClubHeader';
+import ClubInfoSegment from '@src/components/club/listing/ClubInfoSegment';
+import ClubUpcomingEvents from '@src/components/club/listing/ClubUpcomingEvents';
 import { api } from '@src/trpc/server';
 import { db } from '@src/server/db';
 import { eq } from 'drizzle-orm';
 import { type Metadata } from 'next';
 import NotFound from '@src/components/NotFound';
 
-const OrganizationPage = async ({ params }: { params: { id: string } }) => {
+const ClubPage = async ({ params }: { params: { id: string } }) => {
   const club = await api.club.getDirectoryInfo({ id: params.id });
   if (!club) return <NotFound elementType="Club" />;
 
   return (
     <main className="w-full md:pl-72">
       <Header />
       <div className="mb-5 flex flex-col space-y-4 px-3">
-        <OrgHeader club={club} />
-        <OrgInfoSegment club={club} />
-        <OrgUpcomingEvents clubId={club.id} />
+        <ClubHeader club={club} />
+        <ClubInfoSegment club={club} />
+        <ClubUpcomingEvents clubId={club.id} />
       </div>
     </main>
   );
 };
 
-export default OrganizationPage;
+export default ClubPage;
 
 export async function generateMetadata({
   params,

src/app/directory/create/OfficerSelector.tsx

@@ -7,7 +7,7 @@ import {
   type FieldErrors,
 } from 'react-hook-form';
 import { type z } from 'zod';
-import { UserSearchBar } from '../../../components/searchBar/UserSearchBar';
+import { UserSearchBar } from '@src/components/searchBar/UserSearchBar';
 
 type OfficerSelectorProps = {
   control: Control<z.infer<typeof createClubSchema>>;

src/app/page.tsx

@@ -1,7 +1,7 @@
 import Header from '../components/header/BaseHeader';
 import Carousel from '../components/club/directory/Carousel';
 import TagFilter from '../components/club/directory/TagFilter';
-import OrgDirectoryGrid from '../components/club/directory/OrgDirectoryGrid';
+import ClubDirectoryGrid from '../components/club/directory/ClubDirectoryGrid';
 import type { Metadata } from 'next';
 import { api } from '@src/trpc/server';
 
@@ -33,7 +33,7 @@ const Home = async (props: Params) => {
           <Carousel clubs={onlyClubs} />
         </div>
         <TagFilter tags={tags} />
-        <OrgDirectoryGrid tag={props.searchParams.tag} />
+        <ClubDirectoryGrid tag={props.searchParams.tag} />
       </div>
     </main>
   );

src/components/admin/AddOrg.tsx → src/components/admin/AddClub.tsx

@@ -2,26 +2,26 @@
 
 import { useState } from 'react';
 import { DayPicker, type DateRange } from 'react-day-picker';
-import OrgSearch from './OrgSearch';
+import ClubSearch from './ClubSearch';
 import 'react-day-picker/dist/style.css';
 import { api } from '@src/trpc/react';
 import { useRouter } from 'next/navigation';
 
-type AddOrg = {
+type AddClub = {
   range: DateRange;
   orgId: string | null;
   name: string | null;
 };
 
-export default function AddOrg() {
-  const [addOrg, setAddOrg] = useState<AddOrg>({
+export default function AddClub() {
+  const [addClub, setAddClub] = useState<AddClub>({
     range: { from: undefined, to: undefined },
     orgId: null,
     name: null,
   });
   const router = useRouter();
   const utils = api.useContext();
-  const { mutate } = api.admin.addOrgCarousel.useMutation({
+  const { mutate } = api.admin.addClubCarousel.useMutation({
     onSuccess: async () => {
       await utils.admin.upcomingCarousels.invalidate();
       await utils.club.getCarousel.invalidate();
@@ -32,21 +32,21 @@ export default function AddOrg() {
   });
 
   function onClick() {
-    if (!addOrg.orgId || !addOrg.range.from || !addOrg.range.to) return;
+    if (!addClub.orgId || !addClub.range.from || !addClub.range.to) return;
 
     mutate({
-      orgId: addOrg.orgId,
-      range: addOrg.range,
+      orgId: addClub.orgId,
+      range: addClub.range,
     });
   }
 
-  function setOrg({ id, name }: { id: string; name: string }) {
-    setAddOrg({ ...addOrg, orgId: id, name });
+  function setClub({ id, name }: { id: string; name: string }) {
+    setAddClub({ ...addClub, orgId: id, name });
   }
 
   function setRange(range: DateRange | undefined) {
-    setAddOrg({
-      ...addOrg,
+    setAddClub({
+      ...addClub,
       range: {
         from: range?.from ? range.from : undefined,
         to: range?.to ? range.to : undefined,
@@ -58,26 +58,26 @@ export default function AddOrg() {
     <div className="mx-auto max-w-4xl space-y-6 rounded-xl bg-white p-8 shadow-lg">
       <div className="flex flex-col space-y-4 md:flex-row md:items-center md:justify-between">
         <div className="w-full">
-          <OrgSearch setOrg={setOrg} />
-          {addOrg.name && (
+          <ClubSearch setClub={setClub} />
+          {addClub.name && (
             <div className="text-2xl font-semibold text-gray-800">
-              Adding {addOrg.name}
+              Adding {addClub.name}
             </div>
           )}
-          {addOrg.range.from && addOrg.range.to && (
+          {addClub.range.from && addClub.range.to && (
             <div className="flex flex-col space-y-2 text-base text-gray-700">
               <div>
                 <span className="font-semibold">From:</span>
                 <span className="ml-2">
-                  {addOrg.range.from.toLocaleDateString(undefined, {
+                  {addClub.range.from.toLocaleDateString(undefined, {
                     dateStyle: 'long',
                   })}
                 </span>
               </div>
               <div>
                 <span className="font-semibold">To:</span>
                 <span className="ml-2">
-                  {addOrg.range.to.toLocaleDateString(undefined, {
+                  {addClub.range.to.toLocaleDateString(undefined, {
                     dateStyle: 'long',
                   })}
                 </span>
@@ -87,7 +87,7 @@ export default function AddOrg() {
         </div>
         <DayPicker
           mode="range"
-          selected={addOrg.range}
+          selected={addClub.range}
           onSelect={setRange}
           className="rounded-md border p-4"
           disabled={{ before: new Date() }}
@@ -96,9 +96,9 @@ export default function AddOrg() {
       <button
         className="w-full rounded-lg bg-blue-600 px-4 py-3 text-lg font-bold text-white shadow-md transition duration-200 ease-in-out hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 disabled:cursor-not-allowed disabled:bg-gray-300 sm:w-auto"
         onClick={onClick}
-        disabled={!addOrg.orgId || !addOrg.range.from || !addOrg.range.to}
+        disabled={!addClub.orgId || !addClub.range.from || !addClub.range.to}
       >
-        Add Org
+        Add Club
       </button>
     </div>
   );

src/components/admin/ApprovedClub.tsx

@@ -0,0 +1,23 @@
+import { type SelectClub } from '@src/server/db/models';
+import AddOfficer from './AddOfficer';
+import OfficerTable from './OfficerTable';
+import ClubDescription from './ClubDescription';
+import { api } from '@src/trpc/server';
+import ChangeClubStatus from './ChangeClubStatus';
+
+type Props = { club: SelectClub };
+export default async function AcceptedClub({ club: club }: Props) {
+  const officers = await api.club.getOfficers({ id: club.id });
+
+  return (
+    <>
+      <h2 className="text-center text-2xl font-bold">Officers</h2>
+      <div className="flex items-center justify-between">
+        <AddOfficer clubId={club.id} />
+        <ClubDescription club={club} />
+      </div>
+      <OfficerTable officers={officers} />
+      <ChangeClubStatus status={club.approved} clubId={club.id} />
+    </>
+  );
+}

src/components/admin/CarouselCards.tsx

@@ -11,7 +11,7 @@ type Props = {
 
 export default function CarouselCard({ item }: Props) {
   const router = useRouter();
-  const { mutate } = api.admin.removeOrgCarousel.useMutation({
+  const { mutate } = api.admin.removeClubCarousel.useMutation({
     onSuccess: () => router.refresh(),
   });
   return (

src/components/admin/ChangeOrgStatus.tsx → src/components/admin/ChangeClubStatus.tsx

@@ -4,27 +4,27 @@ import { api } from '@src/trpc/react';
 import { useRouter } from 'next/navigation';
 import { useState } from 'react';
 
-type Props = { status: 'approved' | 'pending' | 'rejected'; orgId: string };
+type Props = { status: 'approved' | 'pending' | 'rejected'; clubId: string };
 
-export default function ChangeOrgStatus({ status: initial, orgId }: Props) {
+export default function ChangeClubStatus({ status: initial, clubId }: Props) {
   const router = useRouter();
   const [status, setStatus] = useState<Props['status']>(initial);
-  const { mutate } = api.admin.changeOrgStatus.useMutation({
+  const { mutate } = api.admin.changeClubStatus.useMutation({
     onSuccess: () => router.refresh(),
   });
 
   function onChange(e: React.ChangeEvent<HTMLSelectElement>) {
     switch (e.target.value) {
       case 'approved':
-        mutate({ orgId, status: 'approved' });
+        mutate({ clubId: clubId, status: 'approved' });
         setStatus('approved');
         break;
       case 'pending':
-        mutate({ orgId, status: 'pending' });
+        mutate({ clubId: clubId, status: 'pending' });
         setStatus('pending');
         break;
       case 'rejected':
-        mutate({ orgId, status: 'rejected' });
+        mutate({ clubId: clubId, status: 'rejected' });
         setStatus('rejected');
         break;
     }

src/components/admin/OrgDescription.tsx → src/components/admin/ClubDescription.tsx

@@ -6,7 +6,7 @@ import { type SelectClub } from '@src/server/db/models';
 type Props = {
   club: SelectClub;
 };
-export default function OrgDescription({ club }: Props) {
+export default function ClubDescription({ club }: Props) {
   return (
     <Dialog.Root>
       <Dialog.Trigger className="rounded-md bg-slate-300 px-3 py-2 font-medium text-blue-500 transition-colors hover:bg-slate-400 hover:text-blue-700 focus:outline-none focus:ring focus:ring-blue-300">

src/components/admin/OrgSearch.tsx → src/components/admin/ClubSearch.tsx

@@ -6,18 +6,18 @@ import { DebouncedSearchBar } from '../searchBar/DebouncedSearchBar';
 import { type SelectClub } from '@src/server/db/models';
 
 type Props = {
-  setOrg: ({ id, name }: { id: string; name: string }) => void;
+  setClub: ({ id, name }: { id: string; name: string }) => void;
 };
 
-export default function OrgSearch({ setOrg }: Props) {
+export default function ClubSearch({ setClub }: Props) {
   const [search, setSearch] = useState<string>('');
   const { data } = api.club.byName.useQuery(
     { name: search },
     { enabled: !!search },
   );
 
   const onClickSearchResult = (club: SelectClub) => {
-    setOrg({ id: club.id, name: club.name });
+    setClub({ id: club.id, name: club.name });
     setSearch('');
   };
   return (

src/components/admin/OrgTable.tsx → src/components/admin/ClubTable.tsx

@@ -18,11 +18,11 @@ import { useRouter } from 'next/navigation';
 import { type Club, fuzzyFilter } from '@src/utils/table';
 import StatusFilter from './StatusFilter';
 
-export default function OrgTable({ clubs }: { clubs: Club[] }) {
+export default function ClubTable({ clubs }: { clubs: Club[] }) {
   const router = useRouter();
   const parentRef = useRef<HTMLDivElement>(null);
   const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
-  const { mutate } = api.admin.deleteOrg.useMutation({
+  const { mutate } = api.admin.deleteClub.useMutation({
     onSuccess: () => router.refresh(),
   });