feat: update redirect page layout

Signed-off-by: Innei <i@innei.in>

electron.vite.config.ts

@@ -60,7 +60,7 @@ export default defineConfig({
       }),
     ],
     build: {
-      sourcemap: true,
+      sourcemap: !!process.env.CI,
     },
     define: {
       APP_VERSION: JSON.stringify(pkg.version),

forge.config.ts

@@ -24,6 +24,7 @@ const ymlMapsMap = {
   win32: "latest.yml",
 }
 
+const keepModules = new Set(["font-list", "vscode-languagedetection"])
 // remove folders & files not to be included in the app
 async function cleanSources(
   buildPath,
@@ -41,7 +42,7 @@ async function cleanSources(
   ])
 
   // Keep only node_modules to be included in the app
-  const modules = new Set(["font-list", "@vscode/vscode-languagedetection"])
+
   await Promise.all([
     ...(await readdir(buildPath).then((items) =>
       items
@@ -50,13 +51,18 @@ async function cleanSources(
     )),
     ...(await readdir(path.join(buildPath, "node_modules")).then((items) =>
       items
-        .filter((item) => !modules.has(item))
+        .filter((item) => !keepModules.has(item))
         .map((item) => rimraf(path.join(buildPath, "node_modules", item))),
     )),
   ])
 
   callback()
 }
+
+const ignorePattern = new RegExp(
+  `^/node_modules/(?!${[...keepModules].join("|")})`,
+)
+
 const config: ForgeConfig = {
   packagerConfig: {
     appBundleId: "is.follow",
@@ -70,7 +76,7 @@ const config: ForgeConfig = {
     ],
     afterCopy: [cleanSources],
     asar: true,
-    ignore: [/^\/node_modules\/(?!font-list|@vscode\/vscode-languagedetection)/],
+    ignore: [ignorePattern],
     prune: true,
     ...(process.env.APPLE_ID &&
       process.env.APPLE_PASSWORD &&
@@ -171,7 +177,11 @@ const config: ForgeConfig = {
       makeResults = makeResults.map((result) => {
         result.artifacts = result.artifacts.map((artifact) => {
           if (artifactRegex.test(artifact)) {
-            const newArtifact = `${path.dirname(artifact)}/${result.packageJSON.name}-${result.packageJSON.version}-${platformNamesMap[result.platform]}-${result.arch}${path.extname(artifact)}`
+            const newArtifact = `${path.dirname(artifact)}/${
+              result.packageJSON.name
+            }-${result.packageJSON.version}-${
+              platformNamesMap[result.platform]
+            }-${result.arch}${path.extname(artifact)}`
             fs.renameSync(artifact, newArtifact)
 
             try {
@@ -200,17 +210,18 @@ const config: ForgeConfig = {
       yml.releaseDate = new Date().toISOString()
       const ymlStr =
         `version: ${yml.version}\n` +
-        `files:\n${
-        yml.files
-          .map((file) => (
+        `files:\n${yml.files
+          .map(
+            (file) =>
               `  - url: ${file.url}\n` +
               `    sha512: ${file.sha512}\n` +
-              `    size: ${file.size}\n`
-            ))
-          .join("")
-        }releaseDate: ${yml.releaseDate}\n`
+              `    size: ${file.size}\n`,
+          )
+          .join("")}releaseDate: ${yml.releaseDate}\n`
 
-      const ymlPath = `${path.dirname(makeResults[0].artifacts[0])}/${ymlMapsMap[makeResults[0].platform]}`
+      const ymlPath = `${path.dirname(makeResults[0].artifacts[0])}/${
+        ymlMapsMap[makeResults[0].platform]
+      }`
       fs.writeFileSync(ymlPath, ymlStr)
 
       makeResults.push({

package.json

@@ -69,7 +69,6 @@
     "@tanstack/react-query-devtools": "5.51.15",
     "@tanstack/react-query-persist-client": "5.51.15",
     "@use-gesture/react": "10.3.1",
-    "@vscode/vscode-languagedetection": "1.0.22",
     "@yornaath/batshit": "0.10.1",
     "builder-util-runtime": "9.2.5-alpha.3",
     "class-variance-authority": "0.7.0",
@@ -129,6 +128,7 @@
     "use-context-selector": "2.0.0",
     "usehooks-ts": "3.1.0",
     "vfile": "6.0.2",
+    "vscode-languagedetection": "npm:@vscode/vscode-languagedetection@^1.0.22",
     "zod": "3.23.8",
     "zustand": "4.5.4"
   },

pnpm-lock.yaml

@@ -139,9 +139,6 @@ importers:
       '@use-gesture/react':
         specifier: 10.3.1
         version: 10.3.1(react@18.3.1)
-      '@vscode/vscode-languagedetection':
-        specifier: 1.0.22
-        version: 1.0.22
       '@yornaath/batshit':
         specifier: 0.10.1
         version: 0.10.1
@@ -319,6 +316,9 @@ importers:
       vfile:
         specifier: 6.0.2
         version: 6.0.2
+      vscode-languagedetection:
+        specifier: npm:@vscode/vscode-languagedetection@^1.0.22
+        version: '@vscode/vscode-languagedetection@1.0.22'
       zod:
         specifier: 3.23.8
         version: 3.23.8

src/main/tipc/reader.ts

@@ -20,9 +20,9 @@ export const readerRoute = {
   detectCodeStringLanguage: t.procedure
     .input<{ codeString: string }>()
     .action(async ({ input }) => {
-      const { ModelOperations } = require("@vscode/vscode-languagedetection")
-      const modulOperations = new ModelOperations()
-      const result = await modulOperations.runModel(input.codeString)
+      const { ModelOperations } = require("vscode-languagedetection")
+      const modelOperations = new ModelOperations()
+      const result = await modelOperations.runModel(input.codeString)
       return result
     }),
 }

src/renderer/src/components/common/ErrorElement.tsx

@@ -1,4 +1,3 @@
-import pkg from "@pkg"
 import { attachOpenInEditor } from "@renderer/lib/dev"
 import { getNewIssueUrl } from "@renderer/lib/issues"
 import { clearLocalPersistStoreData } from "@renderer/store/utils/clear"
@@ -6,8 +5,8 @@ import { useEffect, useRef } from "react"
 import { isRouteErrorResponse, useRouteError } from "react-router-dom"
 import { toast } from "sonner"
 
-import { Logo } from "../icons/logo"
 import { StyledButton } from "../ui/button"
+import { PoweredByFooter } from "./PoweredByFooter"
 
 export function ErrorElement() {
   const error = useRouteError()
@@ -85,20 +84,8 @@ export function ErrorElement() {
 
       <FallbackIssue message={message} stack={stack} />
       <div className="grow" />
-      <footer className="center mt-12 flex gap-2">
-        Powered by
-        {" "}
-        <Logo className="size-5" />
-        {" "}
-        <a
-          href={pkg.homepage}
-          className="cursor-pointer font-bold text-theme-accent"
-          target="_blank"
-          rel="noreferrer"
-        >
-          {APP_NAME}
-        </a>
-      </footer>
+
+      <PoweredByFooter />
     </div>
   )
 }

src/renderer/src/components/common/NotFound.tsx

@@ -1,4 +1,3 @@
-import pkg from "@pkg"
 import { isElectronBuild } from "@renderer/constants"
 import { captureException } from "@sentry/react"
 import { useEffect } from "react"
@@ -7,6 +6,7 @@ import { useLocation, useNavigate } from "react-router-dom"
 
 import { Logo } from "../icons/logo"
 import { StyledButton } from "../ui/button"
+import { PoweredByFooter } from "./PoweredByFooter"
 
 class AccessNotFoundError extends Error {
   constructor(
@@ -59,20 +59,7 @@ export const NotFound = () => {
         </p>
       </main>
 
-      <footer className="center -mt-12 flex gap-2 py-8">
-        Powered by
-        {" "}
-        <Logo className="size-5" />
-        {" "}
-        <a
-          href={pkg.homepage}
-          className="cursor-pointer font-bold text-theme-accent no-underline"
-          target="_blank"
-          rel="noreferrer"
-        >
-          {APP_NAME}
-        </a>
-      </footer>
+      <PoweredByFooter className="center -mt-12 flex gap-2 py-8" />
     </div>
   )
 }

src/renderer/src/components/common/PoweredByFooter.tsx

@@ -0,0 +1,21 @@
+import pkg from "@pkg"
+import { cn } from "@renderer/lib/utils"
+
+import { Logo } from "../icons/logo"
+
+export const PoweredByFooter: Component = ({ className }) => (
+  <footer className={cn("center mt-12 flex gap-2", className)}>
+    Powered by
+    {" "}
+    <Logo className="size-5" />
+    {" "}
+    <a
+      href={pkg.homepage}
+      className="cursor-pointer font-bold text-theme-accent"
+      target="_blank"
+      rel="noreferrer"
+    >
+      {APP_NAME}
+    </a>
+  </footer>
+)

src/renderer/src/pages/(external)/redirect.tsx

@@ -1,4 +1,4 @@
-import { Logo } from "@renderer/components/icons/logo"
+import { PoweredByFooter } from "@renderer/components/common/PoweredByFooter"
 import { StyledButton } from "@renderer/components/ui/button"
 import { UserAvatar } from "@renderer/components/user-button"
 import { apiClient } from "@renderer/lib/api-fetch"
@@ -28,23 +28,18 @@ export function Component() {
   }, [])
 
   return (
-    <div className="flex h-screen w-full flex-col items-center justify-center gap-10 px-4">
-      <Logo className="size-20" />
-      <UserAvatar className="bg-stone-100 px-10 py-4 text-2xl" />
-      <h1 className="text-center text-3xl font-bold">
-        Successfully connected to
-        {" "}
-        {APP_NAME}
-        {" "}
-        Account
-      </h1>
+    <div className="flex h-screen w-full flex-col items-center justify-center gap-10 px-4 pb-12 pt-[30vh]">
+      <UserAvatar className="gap-8 px-10 py-4 text-2xl" />
       <h2 className="text-center">
         You have successfully connected to
         {" "}
         {APP_NAME}
         {" "}
-        Account. Now is the time
-        to open
+        Account.
+        {" "}
+        <br />
+        <br />
+        Now is the time to open
         {" "}
         {APP_NAME}
         {" "}
@@ -60,7 +55,7 @@ export function Component() {
         </StyledButton>
 
         <StyledButton
-          className="h-14 !rounded-full px-10 text-lg"
+          className="h-14 !rounded-full px-5 text-lg"
           onClick={async () => window.open(await getCallbackUrl(), "_top")}
         >
           Open
@@ -68,6 +63,8 @@ export function Component() {
           {APP_NAME}
         </StyledButton>
       </div>
+      <div className="grow" />
+      <PoweredByFooter />
     </div>
   )
 }