Update template to use RR7 app template and Polaris web components

Author: lizkenyon

sample-apps/payment-customizations/.eslintignore

@@ -1,6 +1,5 @@
 node_modules
 build
 public/build
-shopify-app-remix
 */*.yml
 .shopify

sample-apps/payment-customizations/.eslintrc.cjs

@@ -0,0 +1,38 @@
+/**
+ * This is intended to be a basic starting point for linting in your app.
+ * It relies on recommended configs out of the box for simplicity, but you can
+ * and should modify this configuration to best suit your team's needs.
+ */
+
+/** @type {import('eslint').Linter.Config} */
+module.exports = {
+  env: {
+    browser: true,
+    es2022: true,
+    node: true,
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:react-hooks/recommended',
+    'plugin:jsx-a11y/recommended',
+  ],
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+  },
+  plugins: ['react', 'react-hooks', 'jsx-a11y', 'import'],
+  rules: {
+    'react/react-in-jsx-scope': 'off',
+    'react/prop-types': 'off',
+    'react/no-unknown-property': ['error', { ignore: ['variant', 'tone'] }],
+  },
+  settings: {
+    react: {
+      version: 'detect',
+    },
+  },
+};

sample-apps/payment-customizations/.eslintrc.js

@@ -4,11 +4,25 @@ node_modules
 /build
 /app/build
 /public/build/
+/public/_dev
 /app/public/build
 /prisma/dev.sqlite
 /prisma/dev.sqlite-journal
 database.sqlite
 
 .env
+.env.*
+
 package-lock.json
 yarn.lock
+pnpm-lock.yaml
+
+/extensions/*/dist
+
+# Ignore shopify files created during app dev
+.shopify/*
+.shopify.lock
+
+# Hide files auto-generated by react router
+.react-router/
+

sample-apps/payment-customizations/.gitignore

@@ -1,36 +1,41 @@
-const fs = require('node:fs');
-const apiVersion = require("@shopify/shopify-app-remix").LATEST_API_VERSION;
+import fs from "fs";
+import { LATEST_API_VERSION } from "@shopify/shopify-api";
+import { shopifyApiProject, ApiType } from "@shopify/api-codegen-preset";
 
 function getConfig() {
-    const config = {
-        projects: {
-            shopifyAdminApi: {
-                schema: `https://shopify.dev/admin-graphql-direct-proxy/${apiVersion}`,
-                documents: ['./app/**/*.{graphql,js,ts,jsx,tsx}']
-            }
-        }
-    }
+  const config = {
+    projects: {
+      default: shopifyApiProject({
+        apiType: ApiType.Admin,
+        apiVersion: LATEST_API_VERSION,
+        documents: ["./app/**/*.{js,jsx}", "./app/.server/**/*.{js,jsx}"],
+        outputDir: "./app/types",
+      }),
+    },
+  };
 
-    let extensions = []
-    try {
-        extensions = fs.readdirSync('./extensions');
-    } catch {
-        // ignore if no extensions
-    }
+  let extensions = [];
+  try {
+    extensions = fs.readdirSync("./extensions");
+  } catch {
+    // ignore if no extensions
+  }
 
-    for (const entry of extensions) {
-        const extensionPath = `./extensions/${entry}`;
-        const schema = `${extensionPath}/schema.graphql`;
-        if(!fs.existsSync(schema)) {
-            continue;
-        }
-        config.projects[entry] = {
-            schema,
-            documents: [`${extensionPath}/input.graphql`]
-        }
+  for (const entry of extensions) {
+    const extensionPath = `./extensions/${entry}`;
+    const schema = `${extensionPath}/schema.graphql`;
+    if (!fs.existsSync(schema)) {
+      continue;
     }
+    config.projects[entry] = {
+      schema,
+      documents: [`${extensionPath}/**/*.graphql`],
+    };
+  }
 
-    return config;
+  return config;
 }
 
-module.exports = getConfig();
+const config = getConfig();
+
+export default config; 

sample-apps/payment-customizations/.graphqlrc.js

@@ -1,4 +1,4 @@
 engine-strict=true
 auto-install-peers=true
 shamefully-hoist=true
-@shopify:registry=https://registry.npmjs.org
+enable-pre-post-scripts=true

sample-apps/payment-customizations/.npmrc

@@ -1,13 +1,7 @@
 package.json
-.cache
 .shadowenv.d
 .vscode
-build
 node_modules
 prisma
 public
-shopify-app-remix
-.github
-tmp
-*.yml
 .shopify

sample-apps/payment-customizations/.prettierignore

@@ -1,14 +1,21 @@
 FROM node:18-alpine
+RUN apk add --no-cache openssl
 
 EXPOSE 3000
+
 WORKDIR /app
+
+ENV NODE_ENV=production
+
+COPY package.json package-lock.json* ./
+
+RUN npm ci --omit=dev && npm cache clean --force
+# Remove CLI packages since we don't need them in production by default.
+# Remove this line if you want to run CLI commands in your container.
+RUN npm remove @shopify/cli
+
 COPY . .
 
-RUN npm install
 RUN npm run build
 
-# You'll probably want to remove this in production, it's here to make it easier to test things!
-RUN rm prisma/dev.sqlite
-RUN npx prisma migrate dev --name init
-
-CMD ["npm", "run", "start"]
+CMD ["npm", "run", "docker-start"]