chore: Various updates and workflows initialization (#17)

* Update SEO title and description

* Package upgrades

* Add test and lint workflow

* Use custom graphql config

* Update README

.github/workflows/test-and-lint.yml

@@ -0,0 +1,56 @@
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+name: Test and lint workflow
+
+env:
+  NEXT_PUBLIC_GRAPHQL_URL: https://demo.saleor.io/graphql/
+
+jobs:
+  cache-and-install:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+
+      - uses: pnpm/action-setup@v2
+        name: Install pnpm
+        with:
+          version: 8
+          run_install: false
+
+      - name: Get pnpm store directory
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
+
+      - uses: actions/cache@v3
+        name: Setup pnpm cache
+        with:
+          path: ${{ env.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Generate the GraphQL
+        run: pnpm generate:graphql
+
+      - name: Compile the code
+        run: pnpm compile
+
+      - name: Lint the code
+        run: pnpm lint

README.md

@@ -1,4 +1,3 @@
-
 [Saleor](https://saleor.io/) storefront built using [Next.js](https://nextjs.org/) 13 and the new **App Router**.
 
 > [!NOTE]
@@ -16,17 +15,18 @@
 ## Getting Started
 
 **Requirements:**
+
 - An instance of the _Saleor_ backend up and running (the easiest way is probably to use [Saleor Cloud](https://cloud.saleor.io/) and its free tier)
 - The [Saleor Stripe App](https://docs.saleor.io/docs/3.x/developer/app-store/apps/stripe) installed in the dashboard
 
 **Follow these steps in order to execute the project correctly:**
 
 1. Rename the `.env.local.example` into `.env.local` and fill the `NEXT_PUBLIC_GRAPHQL_URL` environment variable with the correct URL to your GraphQL API
-2. Start the project in development mode using `pnpm dev`
-3. Open [http://localhost:3000](http://localhost:3000) with your browser
-4. 🎉
+2. Generate the GraphQL types using `pnpm generate:graphql`
+3. Start the project in development mode using `pnpm dev`
+4. Open [http://localhost:3000](http://localhost:3000) with your browser
+5. 🎉
 
 ## Configuration
 
 You can configure your storefront using the environment variables in [`src/misc/config.ts`](https://github.com/dgopsq/saleor-nextjs-base/blob/main/src/misc/config.ts). The only required configuration is `NEXT_PUBLIC_GRAPHQL_URL`, everything else is optional and has been documented directly in the file.
-

package.json

@@ -7,25 +7,25 @@
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
-    "generate:graphql": "graphql-codegen --config scripts/graphql.ts",
+    "generate:graphql": "graphql-codegen --require dotenv/config --config scripts/graphql.ts dotenv_config_path=.env.local",
     "compile": "tsc --noEmit"
   },
   "dependencies": {
-    "@apollo/client": "3.8.0-beta.7",
+    "@apollo/client": "^3.8.3",
     "@apollo/experimental-nextjs-app-support": "^0.2.2",
-    "@headlessui/react": "^1.7.15",
+    "@headlessui/react": "^1.7.17",
     "@heroicons/react": "^2.0.18",
-    "@hookform/resolvers": "^3.1.1",
-    "@stripe/react-stripe-js": "^2.1.1",
-    "@stripe/stripe-js": "^1.54.1",
-    "@tailwindcss/forms": "^0.5.4",
+    "@hookform/resolvers": "^3.3.1",
+    "@stripe/react-stripe-js": "^2.1.2",
+    "@stripe/stripe-js": "^1.54.2",
+    "@tailwindcss/forms": "^0.5.6",
     "@types/node": "20.3.1",
     "@types/react": "18.2.12",
     "@types/react-dom": "18.2.5",
     "autoprefixer": "10.4.14",
     "editorjs-html": "^3.4.3",
     "eslint-config-next": "13.4.5",
-    "graphql": "^16.7.1",
+    "graphql": "^16.8.0",
     "js-cookie": "^3.0.5",
     "jwt-decode": "^3.1.2",
     "lodash": "^4.17.21",
@@ -34,15 +34,15 @@
     "postcss": "8.4.24",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-hook-form": "^7.45.2",
+    "react-hook-form": "^7.46.1",
     "react-hot-toast": "^2.4.1",
-    "stripe": "^12.14.0",
+    "stripe": "^12.18.0",
     "tailwindcss": "3.3.2",
-    "ts-pattern": "^5.0.4",
-    "tslog": "^4.8.2",
+    "ts-pattern": "^5.0.5",
+    "tslog": "^4.9.2",
     "usehooks-ts": "^2.9.1",
     "zod": "^3.21.4",
-    "zustand": "^4.3.9"
+    "zustand": "^4.4.1"
   },
   "devDependencies": {
     "@graphql-codegen/cli": "4.0.1",
@@ -52,9 +52,10 @@
     "@graphql-typed-document-node/core": "^3.2.0",
     "@tailwindcss/aspect-ratio": "^0.4.2",
     "@types/js-cookie": "^3.0.3",
-    "@types/lodash": "^4.14.196",
-    "@typescript-eslint/eslint-plugin": "^6.2.0",
-    "@typescript-eslint/parser": "^6.2.0",
+    "@types/lodash": "^4.14.198",
+    "@typescript-eslint/eslint-plugin": "^6.6.0",
+    "@typescript-eslint/parser": "^6.6.0",
+    "dotenv": "^16.3.1",
     "eslint": "8.42.0",
     "typescript": "5.1.3"
   }