Skip to content

Commit 47e231d

Browse files
austin-cavanaghaustin-cavanagh
authored
Merge pull request #53 from oslabs-beta/john/link
John/link
2 parents abe6a3c + e1f5f63 commit 47e231d

File tree

23 files changed

+380
-137
lines changed

23 files changed

+380
-137
lines changed

‎.github/workflows/deployChrome.yml

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ name: Publish Chrome Extension
22
on:
33
push:
44
branches:
5-
- main
5+
- OTHER
6+
# This will need to be changed - just making a random branch for now so that it doesn't flag the main branch
67

78
jobs:
89
build-and-publish:

‎.github/workflows/tests.yml

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
name: Run Tests and Build
22
on:
3+
# Updated to only run on pull requests to dev because all pushed to main will go through dev
34
pull_request:
45
branches:
5-
- main
6-
- dev
7-
push:
8-
branches:
9-
- main
6+
# - main
107
- dev
8+
# push:
9+
# branches:
10+
# - main
11+
# - dev
1112
jobs:
1213
unit-testing-extension:
1314
runs-on: ubuntu-latest
@@ -30,7 +31,7 @@ jobs:
3031
run: |
3132
cd extension
3233
npm test
33-
unit-testing-package:
34+
unit-testing-package-react:
3435
runs-on: ubuntu-latest
3536
steps:
3637
- uses: actions/checkout@v4
@@ -41,18 +42,18 @@ jobs:
4142
cache: 'npm'
4243
- name: Install Package dependencies
4344
run: |
44-
cd package
45+
cd package-react
4546
npm ci
4647
- name: Install linux handler for github actions
4748
run: |
48-
cd package
49+
cd package-react
4950
npm i @rollup/rollup-linux-x64-gnu
5051
- name: Build Package
5152
run: |
52-
cd package
53+
cd package-react
5354
npm run build
5455
- name: Test Package
5556
run: |
56-
cd package
57+
cd package-react
5758
npm test
5859

‎extension/build/background.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎extension/build/content.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎extension/build/devtools.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!-- <script src="devtools.js"></script> -->
2+
3+
<!DOCTYPE html>
4+
<html lang="en">
5+
<head>
6+
<meta charset="UTF-8" />
7+
<title>React extension</title>
8+
<meta name="viewport" content="width=device-width,initial-scale=1" />
9+
</head>
10+
<body>
11+
<script src="devtools.js"></script>
12+
</body>
13+
</html>

‎extension/build/devtools.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎extension/build/icon.png

330 KB
Loading

‎extension/build/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<!doctype html><html><head><meta charset="utf-8"><title>React extension</title><meta name="viewport" content="width=device-width,initial-scale=1"><script defer="defer" src="index.js"></script></head><body></body></html>

‎extension/build/index.js

Lines changed: 75 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎extension/build/index.js.LICENSE.txt

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
/**
2+
* @license React
3+
* react-dom.production.min.js
4+
*
5+
* Copyright (c) Facebook, Inc. and its affiliates.
6+
*
7+
* This source code is licensed under the MIT license found in the
8+
* LICENSE file in the root directory of this source tree.
9+
*/
10+
11+
/**
12+
* @license React
13+
* react-is.production.min.js
14+
*
15+
* Copyright (c) Facebook, Inc. and its affiliates.
16+
*
17+
* This source code is licensed under the MIT license found in the
18+
* LICENSE file in the root directory of this source tree.
19+
*/
20+
21+
/**
22+
* @license React
23+
* react-jsx-runtime.production.min.js
24+
*
25+
* Copyright (c) Facebook, Inc. and its affiliates.
26+
*
27+
* This source code is licensed under the MIT license found in the
28+
* LICENSE file in the root directory of this source tree.
29+
*/
30+
31+
/**
32+
* @license React
33+
* react.production.min.js
34+
*
35+
* Copyright (c) Facebook, Inc. and its affiliates.
36+
*
37+
* This source code is licensed under the MIT license found in the
38+
* LICENSE file in the root directory of this source tree.
39+
*/
40+
41+
/**
42+
* @license React
43+
* scheduler.production.min.js
44+
*
45+
* Copyright (c) Facebook, Inc. and its affiliates.
46+
*
47+
* This source code is licensed under the MIT license found in the
48+
* LICENSE file in the root directory of this source tree.
49+
*/
50+
51+
/**
52+
* @mui/styled-engine-sc v6.0.0-alpha.6
53+
*
54+
* @license MIT
55+
* This source code is licensed under the MIT license found in the
56+
* LICENSE file in the root directory of this source tree.
57+
*/

‎extension/build/inject.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎extension/build/manifest.json

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"manifest_version": 3,
3+
"name": "RQRewind",
4+
"version": "1.0.0",
5+
"description": "State management DevTools for React Query",
6+
"devtools_page": "devtools.html",
7+
"icons": {
8+
"16": "icon.png",
9+
"48": "icon.png",
10+
"128": "icon.png"
11+
},
12+
"action": {
13+
"default_icon": "icon.png"
14+
},
15+
"background": {
16+
"service_worker": "background.js"
17+
},
18+
"content_scripts": [
19+
{
20+
"matches": ["http://localhost/*"],
21+
"js": ["content.js"]
22+
}
23+
],
24+
"permissions": [
25+
"activeTab",
26+
"storage"
27+
],
28+
"host_permissions": ["http://localhost/*"],
29+
"web_accessible_resources": [
30+
{
31+
"resources": ["inject.js"],
32+
"matches": ["<all_urls>"]
33+
}
34+
]
35+
}

‎extension/build/panel.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>React extension</title>
6+
<meta name="viewport" content="width=device-width,initial-scale=1" />
7+
</head>
8+
<body>
9+
<script src="index.js"></script>
10+
</body>
11+
</html>

‎extension/src/containers/DiffTab.tsx

Lines changed: 13 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import Typography from '@mui/material/Typography';
2-
import FormGroup from '@mui/material/FormGroup';
3-
import FormControlLabel from '@mui/material/FormControlLabel';
4-
import Switch from '@mui/material/Switch';
5-
import React, { useState } from 'react';
1+
import Typography from "@mui/material/Typography";
2+
import FormGroup from "@mui/material/FormGroup";
3+
import FormControlLabel from "@mui/material/FormControlLabel";
4+
import Switch from "@mui/material/Switch";
5+
import React, { useState } from "react";
66

7-
import JsonDiff from '../components/JsonDiff';
7+
import JsonDiff from "../components/JsonDiff";
88

9-
import { DataTabProps } from '../types';
9+
import { DataTabProps } from "../types";
1010

1111
const DiffTab = ({ queryDisplay, currentIndex }: DataTabProps) => {
1212
// state to determine if unchanged are hidden or closed
@@ -22,21 +22,20 @@ const DiffTab = ({ queryDisplay, currentIndex }: DataTabProps) => {
2222
return (
2323
<>
2424
<FormControlLabel
25-
sx={{ color: 'primary.main', marginLeft: 0 }}
25+
sx={{ color: "primary.main", marginLeft: 0 }}
2626
control={
2727
<Switch checked={isHidden} onChange={toggleChangedProperties} />
2828
}
29-
label={`${isHidden ? 'Show' : 'Hide'} Unchanged Properties `}
29+
label={`${isHidden ? "Show" : "Hide"} Unchanged Properties `}
3030
/>
3131
{queryDisplay.length > 0 && queryDisplay[currentIndex] && (
32-
<div className='data'>
32+
<div className="data">
3333
{queryDisplay[currentIndex].map((queryState, i) => (
34-
<>
35-
<Typography variant='h6' sx={{ color: 'secondary.main' }}>
34+
<React.Fragment key={queryState.queryKey}>
35+
<Typography variant="h6" sx={{ color: "secondary.main" }}>
3636
{queryState.queryKey}
3737
</Typography>
3838
<JsonDiff
39-
key={queryState.queryKey}
4039
currentJson={queryState.queryData}
4140
isHidden={isHidden}
4241
oldJson={
@@ -47,7 +46,7 @@ const DiffTab = ({ queryDisplay, currentIndex }: DataTabProps) => {
4746
: null
4847
}
4948
/>
50-
</>
49+
</React.Fragment>
5150
))}
5251
</div>
5352
)}

‎package-react/DevelopmentSteps.md

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -32,18 +32,21 @@ Download the chrome extension from ***insert url here*** in order to time travel
3232
```
3333

3434
## Set-Up Examples
35-
**From the package directory:**
36-
Run with "1" or "2" depending on which example you'd like to set up
37-
1. `npm run install-all`
38-
1. Installs all dependencies for the package and both example apps
39-
2. `npm run link-dependencies-1` or `npm run link-dependencies-2`
35+
**From the package-react directory:**
36+
Execute `package-setup-1` to run:
37+
1. `npm i`
38+
1. Installs all dependencies for the package
39+
1. `npm run install-example`
40+
1. Installs all dependencies for the example app
41+
2. `npm run link-dependencies`
4042
1. Installs all peer dependencies in our package to ensure there are no duplicates
4143
2. Can see all packages currently linked with *`npm ls -g --depth=0 --link=tr`*
4244
3. `npm run watch`
4345
1. Starts rollup in watch mode and creates dist folder
44-
4. `npm run link-package-1` *or* `npm run link-package-2`
46+
In a new shell (still in the package-react directory), execute `package-setup-2` to run:
47+
1. `npm run link-package`
4548
1. Links React Query Rewind
46-
5. `npm run example-1` *or* `npm run example-2`
49+
2. `npm run example`
4750
1. Starts the example server with webpack. Note: this is a hot reload, but it does not always pick up changes to the npm package
4851

4952
# Publishing

‎package-react/example/client/src/client/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
55
// import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
66
import './styles.css';
77

8-
// import ReactQueryRewind from 'react-query-rewind';
9-
import ReactQueryRewind from './link';
8+
import ReactQueryRewind from 'react-query-rewind';
9+
// import ReactQueryRewind from './link';
1010

1111
const queryClient = new QueryClient({
1212
defaultOptions: {

‎package-react/example/server/models/postsOne.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
{
22
"posts": [
3+
{
4+
"text": "new",
5+
"liked": true,
6+
"comments": [
7+
"yes"
8+
],
9+
"createComment": true,
10+
"timestamp": "5:11 PM"
11+
},
312
{
413
"text": "First Post",
514
"liked": true,

‎package-react/package.json

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -45,13 +45,12 @@
4545
"watch": "rollup -c -w",
4646
"prepublishOnly": "npm run build",
4747
"clean": "rm -rf dist",
48-
"link-package-1": "npm link && (cd examples/example-1 && npm link react-query-rewind)",
49-
"link-dependencies-1": "npm link examples/example-1/node_modules/react examples/example-1/node_modules/react-dom examples/example-1/node_modules/@tanstack/react-query",
50-
"unlink-package-1": "(cd examples/example-1 && npm unlink react-query-rewind) && npm unlink",
51-
"link-package-2": "npm link && (cd examples/example-2/client && npm link react-query-rewind)",
52-
"link-dependencies-2": "npm link examples/example-2/client/node_modules/react examples/example-2/client/node_modules/react-dom examples/example-2/client/node_modules/@tanstack/react-query",
53-
"unlink-package-2": "(cd examples/example-2/client && npm unlink react-query-rewind) && npm unlink",
54-
"website": "cd website && npm start"
48+
"link-package": "npm link && (cd example/client && npm link react-query-rewind)",
49+
"link-dependencies": "npm link example/client/node_modules/react example/client/node_modules/react-dom example/client/node_modules/@tanstack/react-query",
50+
"unlink-package": "(cd example/client && npm unlink react-query-rewind) && npm unlink",
51+
"package-setup-1": "npm i && npm run install-example && npm run link-dependencies && npm run watch",
52+
"package-setup-2": "npm run link-package && npm run example"
53+
5554
},
5655
"license": "MIT",
5756
"peerDependencies": {

0 commit comments

Comments
 (0)