Skip to content
This repository was archived by the owner on Oct 26, 2023. It is now read-only.

Commit e1c6d58

Browse files
devrajdevraj
authored
Merge pull request #22 from anomaly/react-query
Migrates to using react-router 6.4 and react-query to manage asynchronous state
2 parents b98b360 + 788cf84 commit e1c6d58

File tree

103 files changed

+3737
-2940
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

103 files changed

+3737
-2940
lines changed

‎.github/workflows/playwright.yml

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
name: Playwright Tests
2+
on:
3+
push:
4+
branches: [ main, master ]
5+
pull_request:
6+
branches: [ main, master ]
7+
jobs:
8+
test:
9+
timeout-minutes: 60
10+
runs-on: ubuntu-latest
11+
steps:
12+
- uses: actions/checkout@v3
13+
- uses: actions/setup-node@v3
14+
with:
15+
node-version: 16
16+
- name: Install dependencies
17+
run: yarn
18+
- name: Install Playwright Browsers
19+
run: npx playwright install --with-deps
20+
- name: Run Playwright tests
21+
run: yarn playwright test
22+
- uses: actions/upload-artifact@v3
23+
if: always()
24+
with:
25+
name: playwright-report
26+
path: playwright-report/
27+
retention-days: 30

‎.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,3 +23,6 @@
2323
npm-debug.log*
2424
yarn-debug.log*
2525
yarn-error.log*
26+
/test-results/
27+
/playwright-report/
28+
/playwright/.cache/

‎README.md

Lines changed: 204 additions & 62 deletions
Large diffs are not rendered by default.

‎orval.config.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
module.exports = {
2+
labs: {
3+
output: {
4+
mode: 'tags-split',
5+
target: 'src/api/labs.ts',
6+
schemas: 'src/api/models',
7+
client: 'react-query',
8+
mock: true,
9+
},
10+
input: {
11+
target: 'http://localhost:8000/openapi.json',
12+
},
13+
},
14+
};

‎package.json

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3,26 +3,27 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6-
"@headlessui/react": "^1.7.3",
7-
"@heroicons/react": "^2.0.12",
8-
"@stripe/react-stripe-js": "^1.14.1",
9-
"@stripe/stripe-js": "^1.42.0",
6+
"@headlessui/react": "^1.7.4",
7+
"@heroicons/react": "^2.0.13",
8+
"@stripe/react-stripe-js": "^1.14.2",
9+
"@stripe/stripe-js": "^1.42.1",
1010
"@testing-library/jest-dom": "^5.16.5",
1111
"@testing-library/react": "^13.4.0",
1212
"@testing-library/user-event": "^14.4.2",
13-
"@types/jest": "^29.2.0",
14-
"@types/node": "^18.11.7",
15-
"@types/react": "^18.0.24",
13+
"@types/jest": "^29.2.2",
14+
"@types/node": "^18.11.9",
15+
"@types/react": "^18.0.25",
1616
"@types/react-dom": "^18.0.8",
17+
"axios": "^1.1.3",
1718
"http-proxy-middleware": "^2.0.6",
1819
"i18next": "^22.0.4",
19-
"labsApi": "file:./src/api/ar",
2020
"react": "^18.2.0",
2121
"react-dom": "^18.2.0",
2222
"react-helmet": "^6.1.0",
23-
"react-hook-form": "^7.38.0",
23+
"react-hook-form": "^7.39.1",
2424
"react-i18next": "^12.0.0",
25-
"react-router-dom": "^6.4.2",
25+
"react-query": "^3.39.2",
26+
"react-router-dom": "^6.4.3",
2627
"react-scripts": "5.0.1",
2728
"typescript": "^4.8.4",
2829
"web-vitals": "^3.0.4"
@@ -32,9 +33,8 @@
3233
"build": "react-scripts build",
3334
"test": "react-scripts test",
3435
"eject": "react-scripts eject",
35-
"fetch-openapi": "curl https://localhost:3000/api/openapi.json -o src/api/openapi.json",
36-
"generate-ar": "autorest --typescript --input-file=src/api/openapi.json --output-folder=src/api/ar",
37-
"generate-otc": "openapi --input http://localhost:8000/openapi.json --output src/api/otc --name LabsApiClient",
36+
"fetch-openapi": "curl https://localhost:3000/api/openapi.json -o openapi.json",
37+
"codegen": "orval",
3838
"sync": "export $(cat .env) && s3cmd --access_key=$ACCESS_KEY --secret_key=$SECRET_KEY --host=$BUCKET_REGION_FQDN --host-bucket=$BUCKET_FQDN sync --no-mime-magic --acl-public --delete-removed --delete-after build/* s3://$BUCKET_NAME/"
3939
},
4040
"eslintConfig": {
@@ -56,9 +56,13 @@
5656
]
5757
},
5858
"devDependencies": {
59+
"@faker-js/faker": "^7.6.0",
60+
"@playwright/test": "^1.27.1",
61+
"@types/react-helmet": "^6.1.5",
5962
"autoprefixer": "^10.4.13",
63+
"msw": "^0.47.4",
6064
"openapi-typescript-codegen": "^0.23.0",
6165
"postcss": "^8.4.18",
62-
"tailwindcss": "^3.2.1"
66+
"tailwindcss": "^3.2.2"
6367
}
6468
}

‎playwright.config.ts

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
import type { PlaywrightTestConfig } from '@playwright/test';
2+
import { devices } from '@playwright/test';
3+
4+
/**
5+
* Read environment variables from file.
6+
* https://github.com/motdotla/dotenv
7+
*/
8+
// require('dotenv').config();
9+
10+
/**
11+
* See https://playwright.dev/docs/test-configuration.
12+
*/
13+
const config: PlaywrightTestConfig = {
14+
testDir: './tests',
15+
/* Maximum time one test can run for. */
16+
timeout: 30 * 1000,
17+
expect: {
18+
/**
19+
* Maximum time expect() should wait for the condition to be met.
20+
* For example in `await expect(locator).toHaveText();`
21+
*/
22+
timeout: 5000
23+
},
24+
/* Run tests in files in parallel */
25+
fullyParallel: true,
26+
/* Fail the build on CI if you accidentally left test.only in the source code. */
27+
forbidOnly: !!process.env.CI,
28+
/* Retry on CI only */
29+
retries: process.env.CI ? 2 : 0,
30+
/* Opt out of parallel tests on CI. */
31+
workers: process.env.CI ? 1 : undefined,
32+
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
33+
reporter: 'html',
34+
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
35+
use: {
36+
/* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
37+
actionTimeout: 0,
38+
/* Base URL to use in actions like `await page.goto('/')`. */
39+
// baseURL: 'http://localhost:3000',
40+
41+
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
42+
trace: 'on-first-retry',
43+
},
44+
45+
/* Configure projects for major browsers */
46+
projects: [
47+
{
48+
name: 'chromium',
49+
use: {
50+
...devices['Desktop Chrome'],
51+
},
52+
},
53+
54+
{
55+
name: 'firefox',
56+
use: {
57+
...devices['Desktop Firefox'],
58+
},
59+
},
60+
61+
{
62+
name: 'webkit',
63+
use: {
64+
...devices['Desktop Safari'],
65+
},
66+
},
67+
68+
/* Test against mobile viewports. */
69+
// {
70+
// name: 'Mobile Chrome',
71+
// use: {
72+
// ...devices['Pixel 5'],
73+
// },
74+
// },
75+
// {
76+
// name: 'Mobile Safari',
77+
// use: {
78+
// ...devices['iPhone 12'],
79+
// },
80+
// },
81+
82+
/* Test against branded browsers. */
83+
// {
84+
// name: 'Microsoft Edge',
85+
// use: {
86+
// channel: 'msedge',
87+
// },
88+
// },
89+
// {
90+
// name: 'Google Chrome',
91+
// use: {
92+
// channel: 'chrome',
93+
// },
94+
// },
95+
],
96+
97+
/* Folder for test artifacts such as screenshots, videos, traces, etc. */
98+
// outputDir: 'test-results/',
99+
100+
/* Run your local dev server before starting the tests */
101+
// webServer: {
102+
// command: 'npm run start',
103+
// port: 3000,
104+
// },
105+
};
106+
107+
export default config;

‎src/App.tsx

Lines changed: 8 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,21 @@
11
import React from 'react';
22
import { Link as RouterLink } from 'react-router-dom';
3-
import { LabsApiClient } from 'api/otc';
4-
// TODO: see if we can import this as a module
5-
import { LabsApi } from 'api/ar/src';
6-
import AnomalyLogo from 'assets/icon-anomaly.png';
7-
8-
function App() {
3+
import { Helmet } from 'react-helmet';
94

10-
// OTC client demo
11-
const otcClient = new LabsApiClient();
12-
// Autoreset client demo
13-
const labsApi: LabsApi = new LabsApi();
5+
import AnomalyLogo from 'assets/icon-anomaly.png';
146

15-
const otcCallMe = async () => {
16-
otcClient.auth.getMeAuthMeGet().then(res => {
17-
console.log(res);
18-
}).catch(err => {
19-
console.log(err);
20-
});
21-
};
227

23-
const arCallme = async () => {
24-
labsApi.get.meAuthMeGet().then(res => {
25-
console.log(res);
26-
}).catch(err => {
27-
console.log(err);
28-
});
29-
};
8+
function App() {
309

3110
return (
3211
<div className="flex flex-col justify-center w-screen h-screen p-20 font-bold text-black app">
12+
<Helmet>
13+
<title>Welcome to labs</title>
14+
<meta name="description" content="Welcome to labs" />
15+
</Helmet>
3316
<img
3417
src={AnomalyLogo}
18+
alt="Anomaly Logo"
3519
width={40}
3620
height={40}/>
3721
<h1 className="my-4 text-3xl font-bold">Anomaly Labs</h1>

‎src/api/ar/README.md

Lines changed: 0 additions & 46 deletions
This file was deleted.

‎src/api/ar/api-extractor.json

Lines changed: 0 additions & 18 deletions
This file was deleted.

0 commit comments

Comments
 (0)