Merge branch 'develop' into JUP-88-Update-About-Page

.github/workflows/generateCheck.sh

@@ -1,14 +1,16 @@
+files=$(npx prettier . -l)
+status=$?
 if [ $status == 0 ]; then
-	echo "## Formatting Check passed 🥳" >>$GITHUB_STEP_SUMMARY
-	echo "All files are formatted correctly" >>$GITHUB_STEP_SUMMARY
-	exit 0
+  echo "## Formatting Check passed 🥳" >>$GITHUB_STEP_SUMMARY
+  echo "All files are formatted correctly" >>$GITHUB_STEP_SUMMARY
+  exit 0
 else
-	echo "## Formatting Check Failed 😅" >>$GITHUB_STEP_SUMMARY
-	echo "Please run prettier using \`npx prettier . --write\` in order to format your code" >>$GITHUB_STEP_SUMMARY
-	echo "### Files with bad formatting:" >>$GITHUB_STEP_SUMMARY
-	for file in $files; do
-		echo "- $file" >>$GITHUB_STEP_SUMMARY
-		echo "::error file=$file::$file not formatted correctly"
-	done
-	exit 1
+  echo "## Formatting Check Failed 😅" >>$GITHUB_STEP_SUMMARY
+  echo "Please run prettier using \`npx prettier . --write\` in order to format your code" >>$GITHUB_STEP_SUMMARY
+  echo "### Files with bad formatting:" >>$GITHUB_STEP_SUMMARY
+  for file in $files; do
+    echo "- $file" >>$GITHUB_STEP_SUMMARY
+    echo "::error file=$file::$file not formatted correctly"
+  done
+  exit 1
 fi

.github/workflows/prettierCheck.yml

@@ -11,14 +11,6 @@ jobs:
           node-version: 18
           cache: 'npm'
       - name: Run npm install
-        run: |
-          mv package.json package.json.bak
-          npm i --no-save prettier prettier-plugin-tailwindcss
-          mv package.json.bak package.json
-      - name: Run prettier
-        run: |
-          files=`npx prettier . -l` || st=$? && st=$?
-          echo status=`echo $st`>>"$GITHUB_ENV"
-          echo files=`echo $files`>> "$GITHUB_ENV"
-      - name: generate errors/summary
+        run: npm ci
+      - name: Run prettier & generate problems
         run: .github/workflows/generateCheck.sh

.prettierrc.mjs

@@ -0,0 +1,16 @@
+/**
+ * @see https://prettier.io/docs/en/configuration.html
+ * @type {import("prettier").Config}
+ */
+const config = {
+  printWidth: 80,
+  semi: true,
+  singleQuote: true,
+  tabWidth: 2,
+  trailingComma: 'all',
+  useTabs: false,
+  bracketSameLine: false,
+  plugins: ['prettier-plugin-tailwindcss'],
+};
+
+export default config;

package.json

@@ -15,6 +15,7 @@
   "dependencies": {
     "@auth/drizzle-adapter": "^0.3.2",
     "@hookform/resolvers": "^3.3.2",
+    "@next/third-parties": "^14.2.15",
     "@radix-ui/react-alert-dialog": "^1.0.5",
     "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-dropdown-menu": "^2.0.6",
@@ -27,7 +28,6 @@
     "@trpc/client": "^11.0.0-rc.340",
     "@trpc/react-query": "^11.0.0-rc.340",
     "@trpc/server": "^11.0.0-rc.340",
-    "@vercel/analytics": "^1.3.1",
     "date-fns": "^2.30.0",
     "dotenv": "^16.0.3",
     "drizzle-orm": "^0.28.5",

src/app/directory/search/ClubSearch.tsx

@@ -0,0 +1,35 @@
+'use client';
+import { api } from '@src/trpc/react';
+import type { SelectClub as Club } from '@src/server/db/models';
+import { type Session } from 'next-auth';
+import ClubCard from '@src/components/club/ClubCard';
+
+interface ClubSearchComponentProps {
+  userSearch: string;
+  session: Session | null;
+}
+
+export const ClubSearchComponent = ({
+  userSearch,
+  session,
+}: ClubSearchComponentProps) => {
+  const { data } = api.club.byNameNoLimit.useQuery(
+    { name: userSearch },
+    { enabled: !!userSearch },
+  );
+
+  if (!data) {
+    return <p />;
+  }
+  if (data.length === 0) {
+    return <p>No results found</p>;
+  }
+
+  return (
+    <div className="grid w-full auto-rows-fr grid-cols-[repeat(auto-fill,320px)] justify-center gap-16 pb-4">
+      {data.map((club: Club) => (
+        <ClubCard key={club.id} club={club} session={session} priority />
+      ))}
+    </div>
+  );
+};

src/app/directory/search/page.tsx

@@ -0,0 +1,24 @@
+import Header from '@src/components/header/BaseHeader';
+import { ClubSearchComponent } from './ClubSearch';
+import { getServerAuthSession } from '@src/server/auth';
+
+type Params = {
+  searchParams: { [key: string]: string | undefined };
+};
+
+const clubSearch = async (props: Params) => {
+  const { searchParams } = props;
+  const userSearch = searchParams['search'] || '';
+  const session = await getServerAuthSession();
+
+  return (
+    <main className="md:pl-72">
+      <div>
+        <Header />
+        <ClubSearchComponent userSearch={userSearch} session={session} />
+      </div>
+    </main>
+  );
+};
+
+export default clubSearch;

src/app/layout.tsx

@@ -7,7 +7,7 @@ import { TRPCReactProvider } from '@src/trpc/react';
 import Sidebar from '@src/components/nav/Sidebar';
 import { type Metadata } from 'next';
 
-import { Analytics } from '@vercel/analytics/react';
+import { GoogleAnalytics } from '@next/third-parties/google';
 
 const inter = Inter({
   subsets: ['latin'],
@@ -48,7 +48,7 @@ export default function RootLayout({
           <Sidebar />
           <div className="max-h-screen overflow-y-scroll">{children}</div>
         </TRPCReactProvider>
-        <Analytics />
+        <GoogleAnalytics gaId="G-FYTBHVKNG6" />
       </body>
     </html>
   );