Merge branch 'master' into development

.github/workflows/deploy.yml

@@ -0,0 +1,19 @@
+name: Deploy sprint
+
+on:
+  push:
+    branches: [master]
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy via SSH
+        uses: appleboy/ssh-action@v1
+        with:
+          host: ${{ secrets.SERVER_HOST }}
+          username: ${{ secrets.SERVER_USER }}
+          port: ${{ secrets.SERVER_PORT }}
+          key: ${{ secrets.SERVER_SSH_KEY }}
+          script: |
+            /home/ob/.local/bin/s

packages/frontend/src/pages/Test.tsx

@@ -1,53 +1,52 @@
-import { useState } from "react";
-import LogOutButton from "@/components/log-out-button";
-import ThemeToggle from "@/components/theme-toggle";
-import { Button } from "@/components/ui/button";
-import ColourPicker from "@/components/ui/colour-picker";
 import Icon, { iconNames, iconStyles } from "@/components/ui/icon";
 
 function Test() {
-  const [colour, setColour] = useState("#e05656");
-
   return (
-    <main className="w-full min-h-[100vh] flex justify-center items-center gap-32 p-4">
+    <main className="w-full min-h-[100vh] flex flex-col justify-center items-center p-4">
-      <div className="mt-8 flex flex-col items-center gap-4">
-        <p className="text-muted-foreground">Other test components</p>
-        <div className="flex gap-4">
-          <Button linkTo="/">go back to "/"</Button>
-        </div>
-        <LogOutButton />
-        <ColourPicker colour={colour} onChange={setColour} />
-
-        <ThemeToggle />
-      </div>
-
       <div>
-        <h1 className="text-2xl font-bold">Icon Demo</h1>
-        <p className="text-muted-foreground">
-          All {iconNames.length} icons across {iconStyles.length} styles
-        </p>
-
         <div className="overflow-x-auto">
           <table className="border-collapse">
             <thead>
               <tr className="border-b">
-                <th className="text-left p-2 font-medium">Name</th>
+                {Array.from(
-                {iconStyles.map((iconStyle) => (
+                  { length: Math.ceil(iconNames.length / 10) },
-                  <th key={iconStyle} className="text-center p-2 font-medium capitalize">
+                  (_, groupNumber) => groupNumber + 1,
-                    {iconStyle}
+                ).flatMap((groupNumber) => [
-                  </th>
+                  <th key={`name-${groupNumber}`} className="text-left p-2 font-medium">
-                ))}
+                    Name
+                  </th>,
+                  ...iconStyles.map((iconStyle) => (
+                    <th
+                      key={`${iconStyle}-${groupNumber}`}
+                      className="text-center p-2 font-medium capitalize"
+                    >
+                      {iconStyle}
+                    </th>
+                  )),
+                ])}
               </tr>
             </thead>
             <tbody>
-              {iconNames.map((name) => (
+              {Array.from({ length: 10 }, (_, rowNumber) => rowNumber + 1).map((rowNumber) => (
-                <tr key={name} className="border-b hover:bg-muted/50">
+                <tr key={`row-${rowNumber}`} className="border-b hover:bg-muted/50">
-                  <td className="font-mono text-sm pl-2 pr-12">{name}</td>
+                  {Array.from(
-                  {iconStyles.map((iconStyle) => (
+                    { length: Math.ceil(iconNames.length / 10) },
-                    <td key={iconStyle} className="p-2 text-center">
+                    (_, groupNumber) => groupNumber + 1,
-                      <Icon icon={name} iconStyle={iconStyle} size={24} />
+                  ).flatMap((groupNumber) => {
-                    </td>
+                    const iconIndex = (groupNumber - 1) * 10 + (rowNumber - 1);
-                  ))}
+                    const name = iconNames[iconIndex];
+
+                    return [
+                      <td key={`name-${groupNumber}-${rowNumber}`} className="font-mono text-sm pl-2 pr-12">
+                        {name ?? ""}
+                      </td>,
+                      ...iconStyles.map((iconStyle) => (
+                        <td key={`${iconStyle}-${groupNumber}-${rowNumber}`} className="p-2 text-center">
+                          {name ? <Icon icon={name} iconStyle={iconStyle} size={24} /> : null}
+                        </td>
+                      )),
+                    ];
+                  })}
                 </tr>
               ))}
             </tbody>

todo.md

@@ -1,22 +1,15 @@
 # HIGH PRIORITY
 
 - FEATURES:
-- org settings:
-  - manage issue types
-    - create, edit, delete
-    - assign icons to issue types (ensure each available icon is in EACH icon set)
 - filters
-- time tracking:
-  - add overlay in the bottom left for active timers if there are any. this should be minimal with the issue key (API-005), the time, and a play/pause + end button
 - pricing page
   - see jira and other competitors
     - explore payment providers (stripe is the only one i know)
-- add "modal=true" in issue urls that are copied, and open issue-modal.tsx instead of the issue-detail-pane.tsx
+- real logo
 
 # LOW PRIORITY
 
 - dedicated /register route (currently login/register are combined on /login)
-- real logo
 - issues
   - assignee "note" for extra context on their role in the task
   - deadline