[WIP] - Make the theme deployable to Fly.io

.dockerignore

@@ -0,0 +1,7 @@
+/node_modules
+*.log
+.DS_Store
+/.cache
+.git
+/dist
+/.shopify

.eslintrc.cjs

@@ -4,8 +4,6 @@
 module.exports = {
   extends: [
     "@remix-run/eslint-config",
-    "plugin:hydrogen/recommended",
-    "plugin:hydrogen/typescript",
   ],
   rules: {
     "@typescript-eslint/ban-ts-comment": "off",
@@ -17,7 +15,7 @@ module.exports = {
     // TODO: Remove jest plugin from hydrogen/eslint-plugin
     "jest/no-deprecated-functions": "off",
     "import/order": [
-      "error",
+      "warn",
       {
         /**
          * @description

Dockerfile

@@ -0,0 +1,36 @@
+# This file is moved to the root directory before building the image
+
+# base node image
+FROM node:20-bookworm-slim as base
+RUN apt-get update && apt-get install -y openssl ca-certificates
+
+# Build the app
+FROM base as build
+
+WORKDIR /myapp
+ADD . .
+RUN npm install
+
+RUN npx patch-package
+
+# Finally, build the production image with minimal footprint
+RUN npm run build
+
+FROM base
+
+
+WORKDIR /myapp
+
+ENV NODE_ENV=production
+ENV FLY="true"
+ENV PORT="8080"
+
+COPY --from=build /myapp/node_modules /myapp/node_modules
+
+COPY --from=build /myapp/dist /myapp/dist
+
+
+ADD . .
+EXPOSE 8080
+
+CMD ["npm", "run", "start"]

app/root.tsx

@@ -1,11 +1,11 @@
-import {
-  type AppLoadContext,
-  defer,
-  type LinksFunction,
-  type LoaderFunctionArgs,
+import type {
+  AppLoadContext,
+  LinksFunction,
+  LoaderFunctionArgs,
   MetaArgs,
-  type SerializeFrom,
+  SerializeFrom,
 } from "@shopify/remix-oxygen";
+import { defer } from "@shopify/remix-oxygen";
 import type { ShouldRevalidateFunction } from "@remix-run/react";
 import {
   isRouteErrorResponse,
@@ -25,22 +25,22 @@ import {
   UNSTABLE_Analytics as Analytics,
   useNonce,
 } from "@shopify/hydrogen";
-import { CustomAnalytics } from "~/components/CustomAnalytics";
 import invariant from "tiny-invariant";
 import { withWeaverse } from "@weaverse/hydrogen";
 import roboto400 from "@fontsource/roboto/400.css?url";
 import roboto500 from "@fontsource/roboto/500.css?url";
 import roboto700 from "@fontsource/roboto/700.css?url";
 
+import { CustomAnalytics } from "~/components/CustomAnalytics";
 import { Layout } from "~/components";
 import { seoPayload } from "~/lib/seo.server";
+import { GlobalLoading } from "~/components/global-loading";
 
 import { GenericError } from "./components/GenericError";
 import { NotFound } from "./components/NotFound";
 import styles from "./styles/app.css?url";
 import { DEFAULT_LOCALE, parseMenu } from "./lib/utils";
-import { GlobalStyle } from "./weaverse/style";
-import { GlobalLoading } from "~/components/global-loading";
+import { GlobalStyle } from "./weaverse/style"; // This is important to avoid re-fetching root queries on sub-navigations
 
 // This is important to avoid re-fetching root queries on sub-navigations
 export const shouldRevalidate: ShouldRevalidateFunction = ({
@@ -168,7 +168,6 @@ function App() {
 export default withWeaverse(App);
 
 export function ErrorBoundary({ error }: { error: Error }) {
-  const nonce = useNonce();
   const routeError = useRouteError();
   const rootData = useRootLoaderData();
   const locale = rootData?.selectedLocale ?? DEFAULT_LOCALE;

fly.toml

@@ -0,0 +1,22 @@
+# fly.toml app configuration file generated for pilot-purple-snowflake-481 on 2024-05-14T14:03:19+07:00
+#
+# See https://fly.io/docs/reference/configuration/ for information about how to use this file.
+#
+
+app = 'pilot'
+primary_region = 'sin'
+
+[build]
+
+[http_service]
+  internal_port = 3000
+  force_https = true
+  auto_stop_machines = true
+  auto_start_machines = true
+  min_machines_running = 0
+  processes = ['app']
+
+[[vm]]
+  memory = '512mb'
+  cpu_kind = 'shared'
+  cpus = 1