Skip to content

Commit 7d5952e

Browse files
tjmtmmnktjmtmmnk
authored
Merge pull request #102 from tjmtmmnk/param
update parameter flow
2 parents 5dfad9e + 633cce2 commit 7d5952e

14 files changed

Lines changed: 341 additions & 370 deletions

‎docs/parameter_flow.md‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
## Begin from ContentScript
2+
3+
```mermaid
4+
sequenceDiagram
5+
participant ContentScript
6+
Note right of ContentScript: CS only knows paramKey
7+
participant Popup
8+
participant Background
9+
Note right of Popup: Popup must keep the same parameter with CS
10+
ContentScript ->> Background: get parameter by paramKey
11+
Background ->> ContentScript: return parameter
12+
Background ->> Popup: return parameter
13+
ContentScript ->> ContentScript: set parameter
14+
Popup ->> Popup: set parameter
15+
```
16+
17+
## Begin from Popup
18+
19+
```mermaid
20+
sequenceDiagram
21+
participant ContentScript
22+
Note right of ContentScript: CS only knows paramKey
23+
participant Popup
24+
participant Background
25+
Note right of Popup: Popup must keep the same parameter with CS
26+
Popup ->> Popup: open popup
27+
Popup ->> ContentScript: get parameter
28+
Note right of Popup: Popup doesn't know paramKey
29+
ContentScript ->> Background: get parameter
30+
Background ->> Popup: return parameter
31+
Popup ->> Popup: set parameter
32+
```
33+
34+
## Change parameter in Popup
35+
36+
```mermaid
37+
sequenceDiagram
38+
participant ContentScript
39+
Note right of ContentScript: CS only knows paramKey
40+
participant Popup
41+
participant Background
42+
Note right of Popup: Popup must keep the same parameter with CS
43+
Popup ->> Popup: change parameter
44+
Popup ->> ContentScript: update parameter
45+
ContentScript ->> ContentScript: set parameter
46+
ContentScript ->> Background: save parameter
47+
```
48+
49+
## Change location in ContentScript
50+
51+
same with _Begin from ContentScript_

‎src/api.ts‎

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

‎src/background.ts‎

Lines changed: 41 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,48 @@
1-
import { Message } from "./message";
1+
import { Message, sendRequest, sendRequestToContent } from "./message";
22
import { defaultParamsV2, IParameterV2 } from "./config";
33
import { get, set } from "./storage";
44

5-
let paramKey: string;
6-
7-
chrome.runtime.onConnect.addListener((port) => {
8-
console.assert(port.name === "modekun");
9-
port.onMessage.addListener(async (req: Message) => {
5+
chrome.runtime.onMessage.addListener(
6+
async (req: Message, sender, sendResponse) => {
107
if (req.from === "BACKGROUND" || req.to !== "BACKGROUND") return;
11-
switch (req.type) {
12-
case "UPDATE_PARAM": {
13-
if (req.from === "CONTENT_SCRIPT") return;
14-
if (!req?.data?.param) return;
15-
paramKey && (await set(paramKey, req.data.param));
16-
break;
17-
}
18-
case "UPDATE_PARAM_KEY": {
19-
if (req.from === "POPUP") return;
20-
if (!req?.data?.key) return;
21-
paramKey = req.data.key;
22-
break;
8+
if (req.type === "GET_PARAM" && req.from === "CONTENT_SCRIPT") {
9+
if (!req.data) throw new Error("no data");
10+
if (!req.data.key) throw new Error("no key");
11+
const key: string = req.data.key;
12+
let param: IParameterV2;
13+
try {
14+
const _param = await get<IParameterV2 | undefined>(key);
15+
param = _param ?? defaultParamsV2;
16+
if (!_param) {
17+
await set<IParameterV2>(key, defaultParamsV2);
18+
}
19+
} catch (e) {
20+
console.error(e);
21+
param = defaultParamsV2;
2322
}
24-
case "GET_PARAM": {
25-
const param = paramKey
26-
? (await get<IParameterV2 | undefined>(paramKey)) ?? defaultParamsV2
27-
: defaultParamsV2;
28-
29-
const res: Message = {
30-
type: "RECEIVE_PARAM",
31-
from: "BACKGROUND",
32-
to: "POPUP",
33-
data: {
34-
param: param,
35-
},
36-
};
37-
port.postMessage(res);
38-
break;
23+
sendRequestToContent({
24+
type: "UPDATE_PARAM",
25+
from: "BACKGROUND",
26+
to: "CONTENT_SCRIPT",
27+
data: { param },
28+
});
29+
sendRequest({
30+
type: "UPDATE_PARAM",
31+
from: "BACKGROUND",
32+
to: "POPUP",
33+
data: { param },
34+
});
35+
} else if (req.type === "UPDATE_PARAM" && req.from === "CONTENT_SCRIPT") {
36+
if (!req.data) throw new Error("no data");
37+
if (!req.data.key) throw new Error("no key");
38+
if (!req.data.param) throw new Error("no param");
39+
const key: string = req.data.key;
40+
const param: IParameterV2 = req.data.param;
41+
try {
42+
await set<IParameterV2>(key, param);
43+
} catch (e) {
44+
console.error(e);
3945
}
4046
}
41-
});
42-
});
47+
}
48+
);

‎src/components/popup/HomePage.tsx‎

Lines changed: 37 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import { RangeSlider } from "./RangeSlider";
22
import { IParameterV2 } from "../../config";
3-
import React from "react";
3+
import React, { useEffect } from "react";
44
import styled from "styled-components";
5-
import { useParams } from "../../popup";
6-
import { sendRequest } from "../../message";
5+
import { PopupDispatch, updateParam } from "../../popup";
6+
import { sendRequestToContent } from "../../message";
77

88
const StyledContainer = styled.div`
99
width: 320px;
@@ -14,13 +14,23 @@ const StyledContainer = styled.div`
1414
font-size: 12px;
1515
`;
1616

17-
export const HomePage = () => {
18-
const params = useParams();
19-
return <>{params && <HomePageChild params={params} />}</>;
20-
};
17+
interface HomePageProps {
18+
param: IParameterV2;
19+
dispatch: PopupDispatch;
20+
}
2121

22-
export const HomePageChild = (props: { params: IParameterV2 }) => {
23-
const { params } = props;
22+
export const HomePage = (props: HomePageProps) => {
23+
const { param, dispatch } = props;
24+
useEffect(() => {
25+
updateParam(param);
26+
}, [
27+
param.repeatPostThreshold,
28+
param.repeatWordThreshold,
29+
param.postFrequencyThreshold,
30+
param.lengthThreshold,
31+
param.lookChats,
32+
param.executionInterval,
33+
]);
2434
return (
2535
<StyledContainer>
2636
<RangeSlider
@@ -29,20 +39,13 @@ export const HomePageChild = (props: { params: IParameterV2 }) => {
2939
min={1}
3040
max={10}
3141
step={1}
32-
defaultValue={params.repeatPostThreshold}
42+
defaultValue={param.repeatPostThreshold}
3343
updateParam={(value: number) => {
3444
const newParam: IParameterV2 = {
35-
...params,
45+
...param,
3646
repeatPostThreshold: value,
3747
};
38-
sendRequest({
39-
type: "UPDATE_PARAM",
40-
from: "POPUP",
41-
to: "BACKGROUND",
42-
data: {
43-
param: newParam,
44-
},
45-
});
48+
dispatch({ t: "update", param: newParam });
4649
}}
4750
/>
4851
<RangeSlider
@@ -51,20 +54,13 @@ export const HomePageChild = (props: { params: IParameterV2 }) => {
5154
min={1}
5255
max={20}
5356
step={1}
54-
defaultValue={params.repeatWordThreshold}
57+
defaultValue={param.repeatWordThreshold}
5558
updateParam={(value: number) => {
5659
const newParam: IParameterV2 = {
57-
...params,
60+
...param,
5861
repeatWordThreshold: value,
5962
};
60-
sendRequest({
61-
type: "UPDATE_PARAM",
62-
from: "POPUP",
63-
to: "BACKGROUND",
64-
data: {
65-
param: newParam,
66-
},
67-
});
63+
dispatch({ t: "update", param: newParam });
6864
}}
6965
/>
7066
<RangeSlider
@@ -73,20 +69,13 @@ export const HomePageChild = (props: { params: IParameterV2 }) => {
7369
min={1}
7470
max={50}
7571
step={1}
76-
defaultValue={params.postFrequencyThreshold}
72+
defaultValue={param.postFrequencyThreshold}
7773
updateParam={(value: number) => {
7874
const newParam: IParameterV2 = {
79-
...params,
75+
...param,
8076
postFrequencyThreshold: value,
8177
};
82-
sendRequest({
83-
type: "UPDATE_PARAM",
84-
from: "POPUP",
85-
to: "BACKGROUND",
86-
data: {
87-
param: newParam,
88-
},
89-
});
78+
dispatch({ t: "update", param: newParam });
9079
}}
9180
/>
9281
<RangeSlider
@@ -95,20 +84,13 @@ export const HomePageChild = (props: { params: IParameterV2 }) => {
9584
min={1}
9685
max={200}
9786
step={1}
98-
defaultValue={params.lengthThreshold}
87+
defaultValue={param.lengthThreshold}
9988
updateParam={(value: number) => {
10089
const newParam: IParameterV2 = {
101-
...params,
90+
...param,
10291
lengthThreshold: value,
10392
};
104-
sendRequest({
105-
type: "UPDATE_PARAM",
106-
from: "POPUP",
107-
to: "BACKGROUND",
108-
data: {
109-
param: newParam,
110-
},
111-
});
93+
dispatch({ t: "update", param: newParam });
11294
}}
11395
/>
11496
<RangeSlider
@@ -117,20 +99,13 @@ export const HomePageChild = (props: { params: IParameterV2 }) => {
11799
min={1}
118100
max={250}
119101
step={1}
120-
defaultValue={params.lookChats}
102+
defaultValue={param.lookChats}
121103
updateParam={(value: number) => {
122104
const newParam: IParameterV2 = {
123-
...params,
105+
...param,
124106
lookChats: value,
125107
};
126-
sendRequest({
127-
type: "UPDATE_PARAM",
128-
from: "POPUP",
129-
to: "BACKGROUND",
130-
data: {
131-
param: newParam,
132-
},
133-
});
108+
dispatch({ t: "update", param: newParam });
134109
}}
135110
/>
136111
<RangeSlider
@@ -139,20 +114,13 @@ export const HomePageChild = (props: { params: IParameterV2 }) => {
139114
min={50}
140115
max={10000}
141116
step={100}
142-
defaultValue={params.executionInterval}
117+
defaultValue={param.executionInterval}
143118
updateParam={(value: number) => {
144119
const newParam: IParameterV2 = {
145-
...params,
120+
...param,
146121
executionInterval: value,
147122
};
148-
sendRequest({
149-
type: "UPDATE_PARAM",
150-
from: "POPUP",
151-
to: "BACKGROUND",
152-
data: {
153-
param: newParam,
154-
},
155-
});
123+
dispatch({ t: "update", param: newParam });
156124
}}
157125
/>
158126
</StyledContainer>

0 commit comments

Comments
 (0)