From 52cf05b9920308e95fa7a21be8898fe0868c6704 Mon Sep 17 00:00:00 2001
From: Jaleel Bennett <jaleelbennett58@gmail.com>
Date: Thu, 22 Aug 2024 22:33:43 -0400
Subject: [PATCH] cicd(workflow): added deploy step and conditional steps for
 each job

---
 .github/workflows/{cc.yml => ci.yml} |  40 ++++++++-
 components/ui/select.tsx             |  58 ++++++------
 components/ui/switch.tsx             |  18 ++--
 components/ui/tooltip.tsx            |  22 ++---
 tests/parser.test.ts                 | 126 ---------------------------
 5 files changed, 86 insertions(+), 178 deletions(-)
 rename .github/workflows/{cc.yml => ci.yml} (79%)
 delete mode 100644 tests/parser.test.ts

diff --git a/.github/workflows/cc.yml b/.github/workflows/ci.yml
similarity index 79%
rename from .github/workflows/cc.yml
rename to .github/workflows/ci.yml
index 0143828..ec6c6bf 100644
--- a/.github/workflows/cc.yml
+++ b/.github/workflows/ci.yml
@@ -1,5 +1,4 @@
-name: Code check
-
+name: CI
 on:
   pull_request:
     branches: ["*"]
@@ -44,6 +43,7 @@ jobs:
       - run: pnpm lint
 
   format:
+    needs: lint
     runs-on: ubuntu-latest
     name: Format
     steps:
@@ -79,9 +79,10 @@ jobs:
       - name: Install dependencies
         run: pnpm install
 
-      - run: pnpm format:check
+      - run: pnpm format:write
 
   tsc:
+    needs: format
     runs-on: ubuntu-latest
     name: Typecheck
     steps:
@@ -105,6 +106,7 @@ jobs:
         id: pnpm-cache
         run: |
           echo "pnpm_cache_dir=$(pnpm store path)" >> $GITHUB_OUTPUT
+
       - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
@@ -112,7 +114,39 @@ jobs:
           key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
+
       - name: Install dependencies
         run: pnpm install
 
       - run: pnpm typecheck
+
+  deploy:
+    needs: tsc
+    runs-on: ubuntu-latest
+    name: Deploy
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Install Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - uses: pnpm/action-setup@v3.0.0
+        name: Install pnpm
+        id: pnpm-install
+        with:
+          version: 8.6.1
+          run_install: false
+
+      - name: Install packages
+        run: pnpm install --frozen-lockfile
+
+      - name: Install Railway
+        run: pnpm add -g @railway/cli
+
+      - name: Deploy
+        run: railway up
+        env:
+          RAILWAY_TOKEN: ${{ secrets.RAILWAY_TOKEN }}
diff --git a/components/ui/select.tsx b/components/ui/select.tsx
index cbe5a36..9218f68 100644
--- a/components/ui/select.tsx
+++ b/components/ui/select.tsx
@@ -1,16 +1,16 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as SelectPrimitive from "@radix-ui/react-select"
-import { Check, ChevronDown, ChevronUp } from "lucide-react"
+import * as React from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { Check, ChevronDown, ChevronUp } from "lucide-react";
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils";
 
-const Select = SelectPrimitive.Root
+const Select = SelectPrimitive.Root;
 
-const SelectGroup = SelectPrimitive.Group
+const SelectGroup = SelectPrimitive.Group;
 
-const SelectValue = SelectPrimitive.Value
+const SelectValue = SelectPrimitive.Value;
 
 const SelectTrigger = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Trigger>,
@@ -20,7 +20,7 @@ const SelectTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
-      className
+      className,
     )}
     {...props}
   >
@@ -29,8 +29,8 @@ const SelectTrigger = React.forwardRef<
       <ChevronDown className="h-4 w-4 opacity-50" />
     </SelectPrimitive.Icon>
   </SelectPrimitive.Trigger>
-))
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
+));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
 
 const SelectScrollUpButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
@@ -40,14 +40,14 @@ const SelectScrollUpButton = React.forwardRef<
     ref={ref}
     className={cn(
       "flex cursor-default items-center justify-center py-1",
-      className
+      className,
     )}
     {...props}
   >
     <ChevronUp className="h-4 w-4" />
   </SelectPrimitive.ScrollUpButton>
-))
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
 
 const SelectScrollDownButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
@@ -57,15 +57,15 @@ const SelectScrollDownButton = React.forwardRef<
     ref={ref}
     className={cn(
       "flex cursor-default items-center justify-center py-1",
-      className
+      className,
     )}
     {...props}
   >
     <ChevronDown className="h-4 w-4" />
   </SelectPrimitive.ScrollDownButton>
-))
+));
 SelectScrollDownButton.displayName =
-  SelectPrimitive.ScrollDownButton.displayName
+  SelectPrimitive.ScrollDownButton.displayName;
 
 const SelectContent = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Content>,
@@ -78,7 +78,7 @@ const SelectContent = React.forwardRef<
         "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         position === "popper" &&
           "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
+        className,
       )}
       position={position}
       {...props}
@@ -88,7 +88,7 @@ const SelectContent = React.forwardRef<
         className={cn(
           "p-1",
           position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
         )}
       >
         {children}
@@ -96,8 +96,8 @@ const SelectContent = React.forwardRef<
       <SelectScrollDownButton />
     </SelectPrimitive.Content>
   </SelectPrimitive.Portal>
-))
-SelectContent.displayName = SelectPrimitive.Content.displayName
+));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
 
 const SelectLabel = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Label>,
@@ -108,8 +108,8 @@ const SelectLabel = React.forwardRef<
     className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
     {...props}
   />
-))
-SelectLabel.displayName = SelectPrimitive.Label.displayName
+));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
 
 const SelectItem = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Item>,
@@ -119,7 +119,7 @@ const SelectItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
@@ -131,8 +131,8 @@ const SelectItem = React.forwardRef<
 
     <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
   </SelectPrimitive.Item>
-))
-SelectItem.displayName = SelectPrimitive.Item.displayName
+));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
 
 const SelectSeparator = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Separator>,
@@ -143,8 +143,8 @@ const SelectSeparator = React.forwardRef<
     className={cn("-mx-1 my-1 h-px bg-muted", className)}
     {...props}
   />
-))
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 export {
   Select,
@@ -157,4 +157,4 @@ export {
   SelectSeparator,
   SelectScrollUpButton,
   SelectScrollDownButton,
-}
+};
diff --git a/components/ui/switch.tsx b/components/ui/switch.tsx
index bc69cf2..b73edee 100644
--- a/components/ui/switch.tsx
+++ b/components/ui/switch.tsx
@@ -1,9 +1,9 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as SwitchPrimitives from "@radix-ui/react-switch"
+import * as React from "react";
+import * as SwitchPrimitives from "@radix-ui/react-switch";
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils";
 
 const Switch = React.forwardRef<
   React.ElementRef<typeof SwitchPrimitives.Root>,
@@ -12,18 +12,18 @@ const Switch = React.forwardRef<
   <SwitchPrimitives.Root
     className={cn(
       "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
-      className
+      className,
     )}
     {...props}
     ref={ref}
   >
     <SwitchPrimitives.Thumb
       className={cn(
-        "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+        "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0",
       )}
     />
   </SwitchPrimitives.Root>
-))
-Switch.displayName = SwitchPrimitives.Root.displayName
+));
+Switch.displayName = SwitchPrimitives.Root.displayName;
 
-export { Switch }
+export { Switch };
diff --git a/components/ui/tooltip.tsx b/components/ui/tooltip.tsx
index 30fc44d..2c42a2c 100644
--- a/components/ui/tooltip.tsx
+++ b/components/ui/tooltip.tsx
@@ -1,15 +1,15 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as TooltipPrimitive from "@radix-ui/react-tooltip"
+import * as React from "react";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 
-import { cn } from "@/lib/utils"
+import { cn } from "@/lib/utils";
 
-const TooltipProvider = TooltipPrimitive.Provider
+const TooltipProvider = TooltipPrimitive.Provider;
 
-const Tooltip = TooltipPrimitive.Root
+const Tooltip = TooltipPrimitive.Root;
 
-const TooltipTrigger = TooltipPrimitive.Trigger
+const TooltipTrigger = TooltipPrimitive.Trigger;
 
 const TooltipContent = React.forwardRef<
   React.ElementRef<typeof TooltipPrimitive.Content>,
@@ -20,11 +20,11 @@ const TooltipContent = React.forwardRef<
     sideOffset={sideOffset}
     className={cn(
       "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
+      className,
     )}
     {...props}
   />
-))
-TooltipContent.displayName = TooltipPrimitive.Content.displayName
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
diff --git a/tests/parser.test.ts b/tests/parser.test.ts
deleted file mode 100644
index 8157537..0000000
--- a/tests/parser.test.ts
+++ /dev/null
@@ -1,126 +0,0 @@
-import { MediumArticleProcessor } from "../lib/parser";
-import { describe, it, expect } from "vitest";
-
-describe("MediumArticleProcessor", () => {
-  const processor = new MediumArticleProcessor();
-
-  describe("processArticle", () => {
-    it("should process a simple article with correct classes and attributes", () => {
-      const simpleHtml = `
-        <section>
-          <h2>Test Header</h2>
-          <p>This is a test paragraph.</p>
-        </section>
-      `;
-      const result = processor.processArticleContent(simpleHtml);
-      expect(result).toContain(
-        '<h2 class="font-bold font-sans break-normal text-gray-900 dark:text-gray-100 text-1xl md:text-2xl pt-12">Test Header</h2>',
-      );
-      expect(result).toContain(
-        '<p class="leading-8 mt-7">This is a test paragraph.</p>',
-      );
-    });
-
-    it("should handle various paragraph types with correct attributes", () => {
-      const complexHtml = `
-        <section>
-          <h2>Main Header</h2>
-          <h3>Sub Header</h3>
-          <p>Normal paragraph</p>
-          <ul><li>List item</li></ul>
-          <ol><li>Ordered list item</li></ol>
-          <pre><code>Code block</code></pre>
-          <blockquote>Blockquote</blockquote>
-          <figure><img src="test.jpg" alt="Test image"></figure>
-        </section>
-      `;
-      const result = processor.processArticleContent(complexHtml);
-      expect(result).toContain(
-        '<h2 class="font-bold font-sans break-normal text-gray-900 dark:text-gray-100 text-1xl md:text-2xl pt-12">Main Header</h2>',
-      );
-      expect(result).toContain(
-        '<h3 class="font-bold font-sans break-normal text-gray-900 dark:text-gray-100 text-1xl md:text-2xl pt-12">Sub Header</h3>',
-      );
-      expect(result).toContain(
-        '<p class="leading-8 mt-7">Normal paragraph</p>',
-      );
-      expect(result).toContain(
-        '<ul class="list-disc pl-8 mt-2"><li class="mt-3">List item</li></ul>',
-      );
-      expect(result).toContain(
-        '<ol class="list-decimal pl-8 mt-2"><li class="mt-3">Ordered list item</li></ol>',
-      );
-      expect(result).toContain(
-        '<pre class="mt-7 flex flex-col justify-center border dark:border-gray-700"><code class="p-2 bg-gray-100 dark:bg-gray-900 overflow-x-auto nohighlight">Code block</code></pre>',
-      );
-      expect(result).toContain(
-        '<blockquote style="box-shadow: inset 3px 0 0 0 rgb(209 207 239 / var(--tw-bg-opacity));" class="px-5 pt-3 pb-3 mt-5"><p class="font-italic">Blockquote</p></blockquote>',
-      );
-      expect(result).toContain(
-        '<div class="mt-7"><img alt="Test image" class="pt-5 lazy m-auto" role="presentation" data-src="https://miro.medium.com/v2/resize:fit:700/default-placeholder"></div>',
-      );
-    });
-
-    it("should handle text markups with correct tags and attributes", () => {
-      const markupHtml = `
-        <section>
-          <p>This is <strong>bold</strong> and <em>italic</em> text with a <a href="https://example.com">link</a>.</p>
-        </section>
-      `;
-      const result = processor.processArticleContent(markupHtml);
-      expect(result).toContain("<strong>bold</strong>");
-      expect(result).toContain("<em>italic</em>");
-      expect(result).toContain(
-        '<a href="https://example.com" target="_blank" rel="noopener noreferrer">link</a>',
-      );
-    });
-
-    it("should handle empty sections", () => {
-      const emptyHtml = "<section></section>";
-      const result = processor.processArticleContent(emptyHtml);
-      expect(result).toBe("");
-    });
-
-    // it("should handle mixtape embeds with correct structure and classes", () => {
-    //   const mixtapeHtml = `
-    //     <section>
-    //       <div class="mixtape-embed">
-    //         <a href="https://example.com">
-    //           <h2>Embed Title</h2>
-    //           <p>Embed Description</p>
-    //           <p>example.com</p>
-    //         </a>
-    //       </div>
-    //     </section>
-    //   `;
-    //   const result = processor.processArticle(mixtapeHtml);
-    //   expect(result).toContain(
-    //     '<div class="border border-gray-300 p-2 mt-7 items-center overflow-hidden">'
-    //   );
-    //   expect(result).toContain(
-    //     '<a rel="noopener follow" href="https://example.com" target="_blank">'
-    //   );
-    //   expect(result).toContain(
-    //     '<h2 class="text-black dark:text-gray-100 text-base font-bold">Embed Title</h2>'
-    //   );
-    //   expect(result).toContain(
-    //     '<h3 class="text-grey-darker text-sm">Embed Description</h3>'
-    //   );
-    //   expect(result).toContain(
-    //     '<p class="text-grey-darker text-xs">example.com</p>'
-    //   );
-    // });
-
-    // it("should handle iframes with correct attributes", () => {
-    //   const iframeHtml = `
-    //     <section>
-    //       <iframe src="https://www.youtube.com/embed/dQw4w9WgXcQ"></iframe>
-    //     </section>
-    //   `;
-    //   const result = processor.processArticle(iframeHtml);
-    //   expect(result).toContain(
-    //     '<div class="mt-7"><iframe class="w-full" src="https://www.youtube.com/embed/dQw4w9WgXcQ" allowfullscreen="" frameborder="0" scrolling="no" style="min-height: 400px;"></iframe></div>'
-    //   );
-    // });
-  });
-});