diff --git a/.apollo/router-config.yaml b/.apollo/router-config.yaml index 805dfe11..b5a0ecd6 100644 --- a/.apollo/router-config.yaml +++ b/.apollo/router-config.yaml @@ -44,11 +44,11 @@ apq: # # Uncomment 'preview_callback' to try HTTP callback protocal at the /graphql # # https://www.apollographql.com/docs/router/executing-operations/subscription-callback-protocol -# subscription: -# mode: -# preview_callback: -# public_url: http://0.0.0.0:4000/callback # The router's public URL -# listen: 0.0.0.0:${env.PORT:-4000} # The IP address and port the router will listen on for subscription callbacks -# path: /callback # The path of the router's callback endpoint -# subgraphs: # The list of subgraphs that use the HTTP callback protocol -# - playback +subscription: + mode: + preview_callback: + public_url: http://127.0.0.1:4000 # The router's public URL + listen: 0.0.0.0:${env.PORT:-4000} # The IP address and port the router will listen on for subscription callbacks + path: /callback # The path of the router's callback endpoint + subgraphs: # The list of subgraphs that use the HTTP callback protocol + - playback diff --git a/.github/workflows/register_pq.yaml b/.github/workflows/register_pq.yaml new file mode 100644 index 00000000..79240f52 --- /dev/null +++ b/.github/workflows/register_pq.yaml @@ -0,0 +1,27 @@ +name: Register Persisted Queries +on: + push: + branches: + - main + paths: + - 'client/**' + - '.github/workflows/register_pq.yaml' + - 'persisted-query-manifest.config.ts' + # Allows you to run this workflow manually from the Actions tab + workflow_dispatch: +jobs: + publish_persisted_queries: + name: Publish Playback schema to GraphOS + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - name: Install Rover + run: | + curl -sSL https://rover.apollo.dev/nix/latest | sh + echo "$HOME/.rover/bin" >> $GITHUB_PATH + - name: Publish Operations Manifest + run: rover persisted-queries publish $APOLLO_GRAPH_REF --manifest ./client/src/apollo/persisted-query-manifest.json + env: + APOLLO_KEY: ${{ secrets.APOLLO_KEY }} + APOLLO_VCS_COMMIT: ${{ github.event.pull_request.head.sha }} + APOLLO_GRAPH_REF: ${{ secrets.APOLLO_GRAPH_REF }} diff --git a/README.md b/README.md index 5be25bd5..eada083f 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,6 @@ -# +
# React + Apollo Spotify Showcase diff --git a/client/package.json b/client/package.json index d4503947..6126f792 100644 --- a/client/package.json +++ b/client/package.json @@ -6,7 +6,7 @@ "node": ">=18" }, "dependencies": { - "@apollo/client": "^3.8.0", + "@apollo/client": "^3.8.1", "@apollo/persisted-query-lists": "^1.0.0", "@radix-ui/react-context-menu": "^2.1.3", "@radix-ui/react-dialog": "^1.0.3", @@ -18,23 +18,23 @@ "@radix-ui/react-tabs": "^1.0.3", "@radix-ui/react-tooltip": "^1.0.5", "@tanstack/react-table": "^8.9.1", - "@testing-library/jest-dom": "^5.16.5", - "@testing-library/react": "^13.4.0", - "@testing-library/user-event": "^13.5.0", - "@types/jest": "^27.5.2", - "@types/react": "^18.0.26", + "@testing-library/react": "^14.0.0", + "@testing-library/user-event": "^14.4.3", + "@types/react": "^18.2.21", "@types/react-dom": "^18.0.9", "@wry/equality": "^0.5.3", "classnames": "^2.3.2", "date-fns": "^2.29.3", "deepmerge": "^4.3.0", "formik": "^2.2.9", + "graphql": "^16.8.1", "graphql-ws": "^5.12.0", "lodash": "^4.17.21", "lucide-react": "^0.124.0", "node-vibrant": "3.1.6", "prism-react-renderer": "^1.3.5", "prism-themes": "^1.9.0", + "prismjs": "^1.29.0", "react": "^18.2.0", "react-dom": "^18.2.0", "react-markdown": "^8.0.5", @@ -49,7 +49,8 @@ "start": "vite", "build": "tsc && vite build", "serve": "serve dist -s -n -L -p $PORT", - "lint:types": "tsc --noEmit -p ./tsconfig.json" + "lint:types": "tsc --noEmit -p ./tsconfig.json", + "test": "NODE_ENV=test vitest" }, "browserslist": { "production": [ @@ -66,20 +67,25 @@ "devDependencies": { "@apollo/rover": "^0.16.2", "@mdx-js/rollup": "^2.3.0", + "@rollup/plugin-graphql": "^2.0.3", "@tailwindcss/line-clamp": "^0.4.2", "@types/mdx": "^2.0.3", - "@types/node": "^20.4.5", + "@types/node": "^20.5.7", "@types/prismjs": "^1.26.0", - "@vitejs/plugin-react": "^3.1.0", + "@vitejs/plugin-react": "^4.0.4", "autoprefixer": "^10.4.13", "babel-plugin-prismjs": "^2.1.0", + "jsdom": "^22.1.0", + "msw": "^1.3.1", "postcss": "^8.4.21", "remark-frontmatter": "^4.0.1", "remark-mdx-frontmatter": "^2.1.1", "tailwindcss": "^3.2.7", "type-fest": "^3.6.1", - "typescript": "^5.1.6", - "vite": "^4.4.4" + "typescript": "^5.2.2", + "vite": "^4.4.9", + "vitest": "^0.34.3", + "vitest-dom": "^0.1.0" }, "volta": { "node": "18.16.1" diff --git a/client/setupTests.ts b/client/setupTests.ts new file mode 100644 index 00000000..d4ca35b2 --- /dev/null +++ b/client/setupTests.ts @@ -0,0 +1,8 @@ +import { beforeAll, afterAll, afterEach } from 'vitest'; +import { server } from './src/mocks/server'; + +import 'vitest-dom/extend-expect'; + +beforeAll(() => server.listen({ onUnhandledRequest: 'error' })); +afterAll(() => server.close()); +afterEach(() => server.resetHandlers()); diff --git a/client/src/__tests__/IndexRoute.test.tsx b/client/src/__tests__/IndexRoute.test.tsx new file mode 100644 index 00000000..210dc6be --- /dev/null +++ b/client/src/__tests__/IndexRoute.test.tsx @@ -0,0 +1,25 @@ +import { expect, test, describe } from 'vitest'; +import { Suspense } from 'react'; +import { render, screen } from '@testing-library/react'; +import { ApolloProvider } from '@apollo/client'; +import * as IndexRoute from '../routes/index'; +import client from '../apollo/client'; +import { BrowserRouter } from 'react-router-dom'; + +describe('IndexRoute', () => { + test('renders', async () => { + render( +