icons pack

rivet-gg · Sep 19, 2024 · a671207 · a671207
1 parent a23ce1f
commit a671207
Show file tree

Hide file tree

Showing 44 changed files with 8,634 additions and 267 deletions.
diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -4,4 +4,4 @@ npmScopes:
   fortawesome:
     npmAlwaysAuth: true
     npmRegistryServer: 'https://npm.fontawesome.com/'
-    npmAuthToken: ${FONTAWESOME_PACKAGE_TOKEN}
+    npmAuthToken: ${FONTAWESOME_PACKAGE_TOKEN:-}
diff --git a/apps/hub/src/domains/game/components/game-backend/game-backend-events-list-panel.tsx b/apps/hub/src/domains/game/components/game-backend/game-backend-events-list-panel.tsx
@@ -22,43 +22,38 @@ export function GameBackendEventsListPanel({
   return (
     <ScrollArea className="overflow-auto h-full truncate min-w-0">
       <Flex direction="col" gap="2" my="4" mx="4" className="truncate min-w-0">
-        <>
-          {events.map((event) => (
-            <Button
-              key={event.eventTimestamp}
-              variant={
-                eventId === event.eventTimestamp ? "secondary" : "outline"
-              }
-              asChild
+        {events.map((event) => (
+          <Button
+            key={event.eventTimestamp}
+            variant={eventId === event.eventTimestamp ? "secondary" : "outline"}
+            asChild
+          >
+            <Link
+              search={{ eventId: event.eventTimestamp }}
+              className="truncate min-w-0"
             >
-              <Link
-                search={{ eventId: event.eventTimestamp }}
-                className="truncate min-w-0"
+              <Flex
+                gap="2"
+                items="center"
+                w="full"
+                className="truncate min-w-0 max-w-full"
               >
-                <Flex
-                  gap="2"
-                  items="center"
-                  w="full"
-                  className="truncate min-w-0 max-w-full"
-                >
-                  <GameBackendResponseBadge {...event} />
-                  <span className="flex-1 text-left truncate min-w-0 max-w-full inline-block">
-                    {event.event.request.fmtUrl}
-                  </span>
-                  <WithTooltip
-                    trigger={
-                      <SmallText>
-                        <Uptime createTs={new Date(+event.eventTimestamp)} />{" "}
-                        ago
-                      </SmallText>
-                    }
-                    content={event.eventDate}
-                  />
-                </Flex>
-              </Link>
-            </Button>
-          ))}
-        </>
+                <GameBackendResponseBadge {...event} />
+                <span className="flex-1 text-left truncate min-w-0 max-w-full inline-block">
+                  {event.event.request.fmtUrl}
+                </span>
+                <WithTooltip
+                  trigger={
+                    <SmallText>
+                      <Uptime createTs={new Date(+event.eventTimestamp)} /> ago
+                    </SmallText>
+                  }
+                  content={event.eventDate}
+                />
+              </Flex>
+            </Link>
+          </Button>
+        ))}
       </Flex>
     </ScrollArea>
   );

diff --git a/apps/hub/src/index.css b/apps/hub/src/index.css
@@ -14,4 +14,4 @@
   #root {
     @apply min-h-screen;
   }
-}
+}
diff --git a/biome.json b/biome.json
@@ -8,8 +8,8 @@
       "**/coverage/**",
       "**/lib/**",
       "**/tmp",
-      "**/*.gen.ts",
-      "**/.turbo/**"
+      "**/.turbo/**",
+      "*gen*"
     ]
   },
   "formatter": {

diff --git a/lefthook.yml b/lefthook.yml
@@ -2,7 +2,7 @@ pre-commit:
   commands:
     check:
       glob: "*.{js,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc}"
-      run: npx biome check --apply --no-errors-on-unmatched --files-ignore-unknown=true {staged_files} && git update-index --again
+      run: npx biome check --write --no-errors-on-unmatched --files-ignore-unknown=true {staged_files} && git update-index --again
     types:
       glob: "*.{json,js,jsx,ts,tsx}"
       run: yarn workspaces foreach -A run tsc --noEmit
diff --git a/package.json b/package.json
@@ -9,11 +9,8 @@
     "fmt": "yarn biome check --write ."
   },
   "devDependencies": {
-    "@biomejs/biome": "1.8.2",
+    "@biomejs/biome": "1.9.1",
     "lefthook": "^1.6.12",
     "turbo": "^2.0.1"
-  },
-  "dependencies": {
-    "filesize": "^10.1.6"
   }
 }
diff --git a/packages/components/package.json b/packages/components/package.json
@@ -6,6 +6,7 @@
   "files": ["dist", "src", "public"],
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
+  "sideEffects": false,
   "exports": {
     ".": {
       "import": "./src/index.ts"
@@ -16,20 +17,14 @@
     "./tailwind-base": "./src/tailwind-base.ts",
     "./layout": "./src/layout/index.ts"
   },
+  "types": "./dist/index.d.ts",
   "scripts": {
-    "dev": "vite build --watch",
-    "build": "tsc && vite build"
+    "dev": "vite build --watch"
   },
   "dependencies": {
     "@codemirror/lang-javascript": "^6.2.2",
     "@codemirror/lang-json": "^6.0.1",
     "@codemirror/view": "^6.28.4",
-    "@fortawesome/fontawesome-svg-core": "^6.5.2",
-    "@fortawesome/free-brands-svg-icons": "^6.5.2",
-    "@fortawesome/free-solid-svg-icons": "^6.5.2",
-    "@fortawesome/pro-regular-svg-icons": "^6.5.2",
-    "@fortawesome/pro-solid-svg-icons": "^6.5.2",
-    "@fortawesome/react-fontawesome": "^0.2.2",
     "@hookform/resolvers": "^3.9.0",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-avatar": "^1.0.4",
@@ -51,6 +46,7 @@
     "@radix-ui/react-tooltip": "^1.1.1",
     "@radix-ui/react-visually-hidden": "^1.0.3",
     "@react-hookz/web": "^24.0.4",
+    "@rivet-gg/icons": "workspace:^",
     "@tailwindcss/container-queries": "^0.1.1",
     "@tanstack/react-virtual": "^3.10.1",
     "@uiw/codemirror-extensions-basic-setup": "^4.23.0",

diff --git a/packages/components/public/theme.css b/packages/components/public/theme.css
@@ -45,18 +45,18 @@
   --background-main: 0 7.14% 5.49%;
 }
 
-  :root {
-    --chart-1: 12 76% 61%;
-    --chart-2: 173 58% 39%;
-    --chart-3: 197 37% 24%;
-    --chart-4: 43 74% 66%;
-    --chart-5: 27 87% 67%;
-  }
- 
-  .dark {
-    --chart-1: 18.5 100% 50%;
-    --chart-2: 160 60% 45%;
-    --chart-3: 30 80% 55%;
-    --chart-4: 280 65% 60%;
-    --chart-5: 340 75% 55%;
-  }
+:root {
+  --chart-1: 12 76% 61%;
+  --chart-2: 173 58% 39%;
+  --chart-3: 197 37% 24%;
+  --chart-4: 43 74% 66%;
+  --chart-5: 27 87% 67%;
+}
+
+.dark {
+  --chart-1: 18.5 100% 50%;
+  --chart-2: 160 60% 45%;
+  --chart-3: 30 80% 55%;
+  --chart-4: 280 65% 60%;
+  --chart-5: 340 75% 55%;
+}
diff --git a/packages/components/src/auto-form/fields/array.tsx b/packages/components/src/auto-form/fields/array.tsx
@@ -1,5 +1,4 @@
-import { faAdd, faTrash } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Icon, faAdd, faTrash } from "@rivet-gg/icons";
 import { useFieldArray, useFormContext } from "react-hook-form";
 import * as z from "zod";
 import {
@@ -76,7 +75,7 @@ export default function AutoFormArray({
                   className="hover:bg-zinc-300 hover:text-black focus:ring-0 focus:ring-offset-0 focus-visible:ring-0 focus-visible:ring-offset-0 dark:bg-white dark:text-black dark:hover:bg-zinc-300 dark:hover:text-black dark:hover:ring-0 dark:hover:ring-offset-0 dark:focus-visible:ring-0 dark:focus-visible:ring-offset-0"
                   onClick={() => remove(index)}
                 >
-                  <FontAwesomeIcon icon={faTrash} className="size-4 " />
+                  <Icon icon={faTrash} className="size-4 " />
                 </Button>
               </div>
 
@@ -90,7 +89,7 @@ export default function AutoFormArray({
           onClick={() => append({})}
           className="mt-4 flex items-center"
         >
-          <FontAwesomeIcon icon={faAdd} className="mr-2 size-4" />
+          <Icon icon={faAdd} className="mr-2 size-4" />
           Add
         </Button>
       </AccordionContent>

diff --git a/packages/components/src/auto-form/fields/file.tsx b/packages/components/src/auto-form/fields/file.tsx
@@ -1,6 +1,5 @@
 "use client";
-import { faTrash } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Icon, faTrash } from "@rivet-gg/icons";
 import { type ChangeEvent, useState } from "react";
 import { FormControl, FormItem, FormMessage } from "../../ui/form";
 import { Input } from "../../ui/input";
@@ -63,7 +62,7 @@ export default function AutoFormFile({
             type="button"
             aria-label="Remove image"
           >
-            <FontAwesomeIcon icon={faTrash} />
+            <Icon icon={faTrash} />
           </button>
         </div>
       )}

diff --git a/packages/components/src/copy-area.tsx b/packages/components/src/copy-area.tsx
@@ -1,7 +1,7 @@
 "use client";
-import { faCopy } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
 import { Slot } from "@radix-ui/react-slot";
+import { Icon, faCopy } from "@rivet-gg/icons";
 import { type ReactNode, forwardRef, useState } from "react";
 import { toast } from "sonner";
 import { cn } from "./lib/utils";
@@ -45,7 +45,7 @@ export const CopyArea = forwardRef<HTMLButtonElement, CopyAreaProps>(
           variant="outline"
           type="button"
           endIcon={
-            <FontAwesomeIcon
+            <Icon
               className="group-hover/button:opacity-100 opacity-0 transition-opacity"
               icon={faCopy}
             />
@@ -84,7 +84,7 @@ export const CopyArea = forwardRef<HTMLButtonElement, CopyAreaProps>(
         )}
 
         <Button variant="secondary" size="icon" onClick={handleClick}>
-          <FontAwesomeIcon icon={faCopy} />
+          <Icon icon={faCopy} />
         </Button>
       </Flex>
     );

diff --git a/packages/components/src/cta-card.tsx b/packages/components/src/cta-card.tsx
@@ -1,5 +1,4 @@
-import { faArrowRight } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Icon, faArrowRight } from "@rivet-gg/icons";
 import { ActionCard, type ActionCardProps } from "./action-card";
 
 interface CtaCardProps extends Omit<ActionCardProps, "action"> {}
@@ -8,7 +7,7 @@ export const CtaCard = (props: CtaCardProps) => {
   return (
     <ActionCard
       {...props}
-      action={<FontAwesomeIcon icon={faArrowRight} className="size-4" />}
+      action={<Icon icon={faArrowRight} className="size-4" />}
     />
   );
 };
diff --git a/packages/components/src/datepicker.tsx b/packages/components/src/datepicker.tsx
@@ -2,8 +2,8 @@
 
 import { format } from "date-fns";
 
-import { faCalendar } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faCalendar } from "@rivet-gg/icons";
+import { Icon } from "@rivet-gg/icons";
 import type { DateRange } from "react-day-picker";
 import { cn } from "./lib/utils";
 import { Button } from "./ui/button";
@@ -43,7 +43,7 @@ export function DatePicker({
             !date && "text-muted-foreground",
           )}
         >
-          <FontAwesomeIcon icon={faCalendar} className="mr-2 h-4 w-4" />
+          <Icon icon={faCalendar} className="mr-2 h-4 w-4" />
           {date ? format(date, "PPP") : <span>Pick a date</span>}
         </Button>
       </PopoverTrigger>
@@ -100,7 +100,7 @@ export function RangeDatePicker({
               !date && "text-muted-foreground",
             )}
           >
-            <FontAwesomeIcon icon={faCalendar} className="mr-2 h-4 w-4" />
+            <Icon icon={faCalendar} className="mr-2 h-4 w-4" />
             {date?.from ? (
               date.to ? (
                 <>

diff --git a/packages/components/src/external-card.tsx b/packages/components/src/external-card.tsx
@@ -1,5 +1,5 @@
-import { faArrowUpRightFromSquare } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faArrowUpRightFromSquare } from "@rivet-gg/icons";
+import { Icon } from "@rivet-gg/icons";
 import type { ReactNode } from "react";
 import { ActionCard, type ActionCardProps } from "./action-card";
 import { Button } from "./ui/button";
@@ -17,7 +17,7 @@ export const ExternalCard = ({ href, label, ...props }: ExternalCardProps) => {
         <Button
           asChild
           variant="outline"
-          endIcon={<FontAwesomeIcon icon={faArrowUpRightFromSquare} />}
+          endIcon={<Icon icon={faArrowUpRightFromSquare} />}
         >
           <a href={href} target="_blank" rel="noreferrer">
             {label}

diff --git a/packages/components/src/header/index.tsx b/packages/components/src/header/index.tsx
@@ -1,5 +1,5 @@
-import { faBars } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faBars } from "@rivet-gg/icons";
+import { Icon } from "@rivet-gg/icons";
 import type { ReactNode } from "react";
 import { AssetImage } from "../asset-image";
 import { Button } from "../ui/button";
@@ -54,7 +54,7 @@ export function Header({
                 size="icon"
                 className="shrink-0 md:hidden"
               >
-                <FontAwesomeIcon icon={faBars} className="size-5" />
+                <Icon icon={faBars} className="size-5" />
                 <span className="sr-only">Toggle navigation menu</span>
               </Button>
             </SheetTrigger>

diff --git a/packages/components/src/logs-view.tsx b/packages/components/src/logs-view.tsx
@@ -1,6 +1,5 @@
 "use client";
-import { faArrowDownToLine } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Icon, faArrowDownToLine } from "@rivet-gg/icons";
 import type { Virtualizer } from "@tanstack/react-virtual";
 import {
   type PropsWithChildren,
@@ -192,8 +191,9 @@ export function LogsView({
                         variant="outline"
                         aria-label="Toggle follow logs"
                       >
-                        <FontAwesomeIcon
+                        <Icon
                           className="size-4"
+                          // @ts-ignore
                           icon={faArrowDownToLine}
                         />
                       </Toggle>

diff --git a/packages/components/src/module-card.tsx b/packages/components/src/module-card.tsx
@@ -1,7 +1,7 @@
 "use client";
 import type { IconProp } from "@fortawesome/fontawesome-svg-core";
-import { faExternalLink } from "@fortawesome/pro-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faExternalLink } from "@rivet-gg/icons";
+import { Icon } from "@rivet-gg/icons";
 import { motion } from "framer-motion";
 import { Suspense, lazy } from "react";
 import { cn } from "./lib/utils";
@@ -97,7 +97,7 @@ export function DocumentedModuleCard(props: ModuleCardProps) {
               target="_blank"
               rel="noopener noreferrer"
             >
-              Open in New Tab <FontAwesomeIcon icon={faExternalLink} />
+              Open in New Tab <Icon icon={faExternalLink} />
             </Link>
           </Text>
           <SheetDescription className="-mx-6" asChild>