Initial commit

Created from https://vercel.com/new

.env.template

@@ -0,0 +1,2 @@
+# this is a template, copy to .env.local with proper values for local development (do not store APIs Key in git!)
+NEXT_PUBLIC_WIX_CLIENT_ID=

.eslintrc

@@ -0,0 +1,8 @@
+{
+  "plugins": ["prettier"],
+  "extends": ["next/core-web-vitals", "prettier"],
+  "rules": {
+    "prettier/prettier": "error",
+    "react-hooks/rules-of-hooks": "warn"
+  }
+}

.github/actions/run-playwright/action.yml

@@ -0,0 +1,113 @@
+name: 'Store Playwright Results'
+description: 'Store Playwright Results'
+inputs:
+  provider-deployment-url:
+    description: 'The deployment URL to test with'
+    required: true
+  provider:
+    description: 'Which next deployment provider is used'
+    required: true
+  githubToken:
+    description: 'GitHub Token'
+    required: true
+  prNumber:
+    description: 'Pull request ID (optional)'
+    required: false
+outputs:
+  conclusion:
+    description: 'E2E result'
+runs:
+  using: "composite"
+  steps:
+    - name: Run E2E Tests on Netlify URL
+      id: playwright-e2e
+      run: REMOTE_PROVIDER=${{ inputs.provider }} yarn e2e
+      shell: bash
+      env:
+        PLAYWRIGHT_TEST_BASE_URL: ${{ inputs.provider-deployment-url }}
+    - uses: actions/upload-artifact@v3
+      id: playwright-report-artifact
+      if: always()
+      with:
+        name: playwright-report-${{ inputs.provider }}
+        path: playwright-report/
+        retention-days: 10
+    - uses: actions/upload-artifact@v3
+      id: playwright-screenshots-artifact
+      if: always()
+      with:
+        name: screenshots-${{inputs.provider}}
+        path: tests/e2e/__screenshots__/${{inputs.provider}}
+        retention-days: 10
+    - uses: actions/github-script@v6
+      if: always()
+      with:
+        github-token: ${{ inputs.githubToken }}
+        script: |
+          const conclusion = '${{ steps.playwright-e2e.outcome }}';
+          const prNumber = '${{ inputs.prNumber }}';
+          const provider = '${{ inputs.provider }}';
+          const deploymentUrl = '${{ inputs.provider-deployment-url }}';
+          
+          if (prNumber && conclusion) {
+            core.setOutput('conclusion', conclusion);
+            const owner = context.repo.owner;
+            const repo = context.repo.repo;
+            const jobName = context.job;
+            const runId = context.runId;
+
+            const pullRequest = await github.rest.pulls.get({
+              owner,
+              repo,
+              pull_number: prNumber,
+            });
+            const checksForPr = await github.rest.checks.listForRef({
+              owner: owner,
+              repo: repo,
+              ref: pullRequest.data.head.ref,
+            });
+          
+            let checkRunId = null;
+            for (const checkRun of checksForPr.data.check_runs) {
+              if (checkRun.name === jobName) {
+                checkRunId = checkRun.id;
+                console.log(`Found Check Run ID: ${checkRunId}`);
+                break;
+              }
+            }
+          
+            if (checkRunId) {
+              const checkInput = {
+                owner,
+                repo,
+                check_run_id: checkRunId,
+                pull_request: prNumber,
+                status: 'completed',
+                conclusion: conclusion,
+                output: {
+                  title: `e2e ${provider}`,
+                  summary: `e2e ${provider}: ${conclusion}`,
+                },
+              };
+              github.rest.checks.update(checkInput).catch((error) => {
+                console.warn('Error updating check:', error, ' flow continues');
+              });
+            }
+            // Create a comment with the artifact links on the pull request
+            const artifactLinks = [
+              `## ${conclusion === 'success' ? ':green_circle:' : ':red_circle:'} Playwright E2E for ${provider.toUpperCase()}`,
+              `| Name | Info    |`,
+              `|------|---------|`,
+              `| Summary | [Action Summary](https://github.com/${owner}/${repo}/actions/runs/${runId}/) |`,
+              `| Site URL | [${deploymentUrl}](${deploymentUrl}) |`,
+            ];
+            const comment = artifactLinks.join('\n');
+            github.rest.issues.createComment({
+              owner,
+              repo,
+              issue_number: pullRequest.data.number,
+              body: comment
+            }).catch((error) => {
+              console.warn('Error creating comment:', error, ' flow continues');
+            });
+          }

.github/actions/setup-playwright/action.yml

@@ -0,0 +1,22 @@
+name: 'Setup Playwright With Cache'
+description: 'Setup Playwright With Cache'
+runs:
+  using: "composite"
+  steps:
+    - name: Store Playwright's Version
+      id: store-playwright-version
+      run: |
+        PLAYWRIGHT_VERSION=$(npm ls @playwright/test | grep @playwright | sed 's/.*@//')
+        echo "Playwright's Version: $PLAYWRIGHT_VERSION"
+        echo "PLAYWRIGHT_VERSION=$PLAYWRIGHT_VERSION" >> $GITHUB_OUTPUT
+      shell: bash
+    - name: Cache Playwright Browsers for Playwright's Version
+      id: cache-playwright-browsers
+      uses: actions/cache@v3
+      with:
+        path: ~/.cache/ms-playwright
+        key: playwright-browsers-${{ steps.store-playwright-version.outputs.PLAYWRIGHT_VERSION }}
+    - name: Setup Playwright
+      if: steps.cache-playwright-browsers.outputs.cache-hit != 'true'
+      run: yarn playwright install --with-deps
+      shell: bash

.github/dependabot.yml

@@ -0,0 +1,15 @@
+# To get started with Dependabot version updates, you'll need to specify which
+# package ecosystems to update and where the package manifests are located.
+# Please see the documentation for all configuration options:
+# https://docs.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
+
+version: 2
+updates:
+ - package-ecosystem: "npm"
+   directory: "/"
+   open-pull-requests-limit: 10
+   versioning-strategy: lockfile-only
+   schedule:
+     interval: "weekly"
+     # Check for npm updates on Saturdays
+     day: "saturday"

.gitignore

@@ -0,0 +1,54 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+.vscode
+
+# Yarn Berry
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+#IDE
+.idea
+/test-results/
+/playwright-report/
+/playwright/.cache/
+

.npmrc

@@ -0,0 +1 @@
+registry=https://registry.npmjs.org

.prettierrc.js

@@ -0,0 +1,5 @@
+module.exports = {
+  semi: true,
+  onTrailingComma: true,
+  singleQuote: true,
+};

.yarnrc.yml

@@ -0,0 +1,7 @@
+nodeLinker: node-modules
+
+plugins:
+  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
+    spec: "@yarnpkg/plugin-interactive-tools"
+
+yarnPath: .yarn/releases/yarn-3.3.0.cjs

LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Wix.com
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,74 @@
+# Wix Bookings Template: A Next.js Personal Trainer Site
+
+![Template showcase](docs/media/template-showcase.gif)
+
+This template is a [Next.js](https://nextjs.org/) project bootstrapped with [create-next-app](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). It uses [Wix Headless](https://dev.wix.com/api/sdk/about-wix-headless/overview) to leverage the Wix Bookings and Wix Pricing Plans business solutions for managing classes and memberships.
+
+## Local Development
+
+Prerequisites:
+
+1. [Create a Wix Headless project](https://dev.wix.com/docs/go-headless/getting-started/setup/general-setup/create-a-project)
+2. [Add the Bookings and Pricing Plans apps to your project](https://dev.wix.com/docs/go-headless/getting-started/setup/general-setup/add-apps-to-a-project)
+3. Authorize the template with [quick start deployment](https://manage.wix.com/headless-funnel-nextjs/select-platform?templateName=classes-subscriptions) or by [creating an OAuth app](https://dev.wix.com/docs/go-headless/getting-started/setup/authorization/create-an-o-auth-app-for-visitors-and-members)
+4. [Set up your project's eCommerce settings](https://www.wix.com/my-account/site-selector/?buttonText=Select%20Site&title=Select%20a%20Site&autoSelectOnSingleSite=true&actionUrl=https:%2F%2Fwww.wix.com%2Fdashboard%2F%7B%7BmetaSiteId%7D%7D%2Fstore/settings)
+
+Set up environment variables to consume Wix Headless APIs:
+
+1. In the template's root folder, create a file for the local environment variables:
+    ```sh
+    cp .env.template .env.local.
+    ```
+2. In the new **.env.local** file, paste the OAuth app client ID after `NEXT_PUBLIC_WIX_CLIENT_ID=`.
+
+Run the development server:
+
+1. Run either:
+
+    ```sh
+    yarn dev
+    ```
+
+    or
+
+    ```sh
+    npm i
+    npm run dev
+    ```
+
+2. Open http://localhost:3000 in your browser to see the template home page.
+
+Edit the template:
+
+- Start editing the homepage by modifying **app/page.tsx**. The page auto-updates as you edit the file.
+- Edit any other page using the pattern **app/page.tsx**. For more information, see [Defining Routes](https://beta.nextjs.org/docs/routing/defining-routes) in the Next.js documentation.
+
+# Deployment
+
+You can deploy this repository using any platform which supports Next.js Version 13 and [App Router](https://nextjs.org/docs/app).
+
+The repository requires a single environment variable: `NEXT_PUBLIC_WIX_CLIENT_ID`, which should contain a client ID authorizing access to a Wix project's data.
+
+# Learn More
+
+To learn how to customize the template and add more functionality using Wix APIs, see the [Wix JavaScript SDK reference](https://dev.wix.com/api/sdk).
+
+This template is written in [Next.js](https://nextjs.org/docs) 13 using the [Next.js App Router](https://nextjs.org/docs/app). 
+
+To learn more about Next.js, see:
+
+- [Next.js documentation](https://nextjs.org/docs): Learn about Next.js features and APIs.
+- [Learn Next.js](https://nextjs.org/learn): An interactive Next.js tutorial.
+
+Additionally, this template uses the following libraries and features:
+
+- [React Server Components](https://nextjs.org/docs/advanced-features/react-18/server-components)
+- [TypeScript](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-9.html)
+- [TanStack Query v4](https://tanstack.com/query/latest)
+- [Tailwind CSS](https://tailwindcss.com/)
+- [Flowbite](https://flowbite.com/)
+- [Wix client SDK](https://dev.wix.com/api/sdk/introduction)
+
+# Next.js Booking and Wix Integration Guide
+
+See the comprehensive [integration guide](./docs/integration-guide.md) for step-by-step instructions on how to configure Wix as your headless Booking solution using Next.js on Vercel.

app/account/my-account/page.tsx

@@ -0,0 +1,30 @@
+import MyAccountSection from '@app/components/MyAccount/MyAccountSection';
+import { getCurrentMember } from '@app/model/members/members-api';
+import { useServerAuthSession } from '@app/hooks/useServerAuthSession';
+
+export default async function MyAccountPage() {
+  const wixSession = useServerAuthSession();
+  const { member } = await getCurrentMember(wixSession);
+  return (
+    <MyAccountSection member={member}>
+      <h2 className="text-highlight text-4xl">My Account</h2>
+      <div className="text-sm font-open-sans-condensed py-2">
+        <p className="pt-2">
+          Here you can manage your orders for both pricing plans and bookings
+          and view your member details
+        </p>
+      </div>
+      <div className="grid grid-cols-1 sm:grid-cols-2 gap-8 pt-8">
+        <div>
+          Name:{' '}
+          {`${member?.contact?.firstName ?? ''} ${
+            member?.contact?.lastName ?? ''
+          }`}
+        </div>
+        <div>Login Email: {`${member?.loginEmail ?? ''}`}</div>
+        <div>Nickname: {`${member?.profile?.nickname ?? ''}`}</div>
+        <div>Phone: {`${member?.contact?.phones?.[0] ?? ''}`}</div>
+      </div>
+    </MyAccountSection>
+  );
+}