fix: Eliminate query errors on /quests, add release CI (#18)

.changeset/chilly-beds-double.md

@@ -0,0 +1,5 @@
+---
+"namesake": patch
+---
+
+Resolve query errors on /quests route for unauthenticated users

.github/workflows/release.yml

@@ -0,0 +1,35 @@
+name: Release
+
+on:
+  push:
+    branches:
+      - main
+
+concurrency: ${{ github.workflow }}-${{ github.ref }}
+
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@v3
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          run_install: false
+
+      - name: Setup Node.js 20
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          cache: 'pnpm'
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Create release pull request
+        uses: changesets/action@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

package.json

@@ -3,6 +3,7 @@
   "private": true,
   "version": "0.0.0",
   "type": "module",
+  "packageManager": "[email protected]",
   "scripts": {
     "preinstall": "npx only-allow pnpm",
     "dev": "npm-run-all --parallel dev:frontend dev:backend",

public/manifest.webmanifest

@@ -1,4 +1,5 @@
 {
+  "name": "Namesake",
   "icons": [
     { "src": "/favicon-192.png", "type": "image/png", "sizes": "192x192" },
     { "src": "/favicon-512.png", "type": "image/png", "sizes": "512x512" }

src/components/shared/AppHeader.tsx

@@ -10,8 +10,10 @@ export const AppHeader = () => {
     <div className="flex gap-4 items-center w-screen py-3 px-4 border-b border-gray-dim">
       <Link href={{ to: "/" }}>Namesake</Link>
       <Link href={{ to: "/quests" }}>Quests</Link>
-      {/* TODO: Conditionally render this link */}
-      <Link href={{ to: "/admin" }}>Admin</Link>
+      <Authenticated>
+        {/* TODO: Gate this by role */}
+        <Link href={{ to: "/admin" }}>Admin</Link>
+      </Authenticated>
       <div className="ml-auto">
         <Authenticated>
           <MenuTrigger>

src/routes/__root.tsx

@@ -5,7 +5,6 @@ import {
   createRootRouteWithContext,
   useRouter,
 } from "@tanstack/react-router";
-import { TanStackRouterDevtools } from "@tanstack/router-devtools";
 import type { ConvexAuthState } from "convex/react";
 import { RouterProvider } from "react-aria-components";
 import { AppHeader } from "../components/shared";
@@ -38,7 +37,6 @@ function RootRoute() {
         <AppHeader />
         <Outlet />
       </main>
-      <TanStackRouterDevtools />
     </RouterProvider>
   );
 }

src/routes/quests/index.tsx

@@ -1,10 +1,8 @@
-import { RiAddFill } from "@remixicon/react";
 import { createFileRoute } from "@tanstack/react-router";
-import { useMutation, useQuery } from "convex/react";
+import { useQuery } from "convex/react";
 import { api } from "../../../convex/_generated/api";
 import {
   Badge,
-  Button,
   Container,
   GridList,
   GridListItem,
@@ -17,8 +15,6 @@ export const Route = createFileRoute("/quests/")({
 
 function QuestsRoute() {
   const allQuests = useQuery(api.quests.getAllActiveQuests);
-  const otherQuests = useQuery(api.usersQuests.getAvailableQuestsForUser);
-  const addQuest = useMutation(api.usersQuests.create);
 
   if (allQuests === undefined) return;
   if (allQuests === null) return null;
@@ -31,27 +27,12 @@ function QuestsRoute() {
         items={allQuests}
         renderEmptyState={() => "No quests found"}
       >
-        {allQuests.map(({ _id, _creationTime, title, state }) => {
-          const isQuestAdded = !otherQuests?.some((quest) => quest._id === _id);
-
-          return (
-            <GridListItem textValue={title} key={_id}>
-              {title}
-              {state && <Badge>{state}</Badge>}
-              {isQuestAdded ? (
-                <Badge variant="info">{`Added ${new Date(_creationTime).toLocaleString()}`}</Badge>
-              ) : (
-                <Button
-                  onPress={() => addQuest({ questId: _id })}
-                  variant="icon"
-                  aria-label="Add quest"
-                >
-                  <RiAddFill size={16} />
-                </Button>
-              )}
-            </GridListItem>
-          );
-        })}
+        {allQuests.map(({ _id, title, state }) => (
+          <GridListItem textValue={title} key={_id}>
+            {title}
+            {state && <Badge>{state}</Badge>}
+          </GridListItem>
+        ))}
       </GridList>
     </Container>
   );