Skip to content

Commit d4e1fe6

Browse files
committed
select group and connection to join room
1 parent d64edf4 commit d4e1fe6

File tree

33 files changed

+1108
-294
lines changed

33 files changed

+1108
-294
lines changed

.eslintrc.js

+18-1
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,22 @@
22
* @type {import('eslint').Linter.BaseConfig}
33
*/
44
module.exports = {
5-
extends: 'react-app',
5+
extends: [
6+
'alloy',
7+
'alloy/react',
8+
'alloy/typescript',
9+
'plugin:react-hooks/recommended',
10+
],
11+
settings: {
12+
react: {
13+
version: 'detect',
14+
},
15+
},
16+
rules: {
17+
'no-undef': 'off',
18+
'@typescript-eslint/consistent-type-assertions': 'off',
19+
'@typescript-eslint/no-invalid-void-type': 'off',
20+
'@typescript-eslint/no-inferrable-types': 'off',
21+
'@typescript-eslint/explicit-member-accessibility': 'off',
22+
},
623
};

package.json

+6-1
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,20 @@
1010
"lint": "eslint --ext .js,.jsx,.ts,.tsx ./src"
1111
},
1212
"devDependencies": {
13-
"eslint-config-react-app": "^2.1.0",
13+
"@babel/eslint-parser": "^7.19.1",
1414
"@huolala-tech/page-spy": "file:./page-spy",
1515
"@types/node": "^17.0.16",
1616
"@types/react": "^17.0.39",
1717
"@types/react-dom": "^17.0.11",
1818
"@types/react-transition-group": "^4.4.5",
19+
"@typescript-eslint/eslint-plugin": "^5.54.0",
20+
"@typescript-eslint/parser": "^5.54.0",
1921
"@vitejs/plugin-react": "^1.2.0",
2022
"autoprefixer": "^10.4.2",
2123
"eslint": "^8.34.0",
24+
"eslint-config-alloy": "^4.9.0",
25+
"eslint-plugin-react": "^7.32.2",
26+
"eslint-plugin-react-hooks": "^4.6.0",
2227
"less": "^4.1.2",
2328
"lint-staged": "^12.3.3",
2429
"prettier": "^2.5.1",

src/assets/image/browser.svg

+5-1
Loading

src/assets/image/safari.svg

+46-1
Loading

src/assets/style/initial.css

+11-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
padding: 0;
44
}
55

6-
html, body {
6+
html,
7+
body {
78
height: 100%;
89
}
910

@@ -15,3 +16,12 @@ body {
1516
height: 100%;
1617
min-width: 1200px;
1718
}
19+
20+
pre,
21+
code,
22+
kbd,
23+
samp {
24+
font-size: 1em;
25+
font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier,
26+
monospace;
27+
}

src/contexts/index.ts

-8
This file was deleted.

src/pages/Devtools/BrowserFrame/index.tsx

+16-14
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ import { ElementPanel } from '../ElementPanel';
1212
function getTime() {
1313
const date = new Date();
1414
let hours = String(date.getHours());
15-
hours = +hours >= 10 ? hours : `0${hours}`;
15+
hours = Number(hours) >= 10 ? hours : `0${hours}`;
1616
let mins = String(date.getMinutes());
17-
mins = +mins >= 10 ? mins : `0${mins}`;
17+
mins = Number(mins) >= 10 ? mins : `0${mins}`;
1818
return [hours, mins].join(':');
1919
}
2020

@@ -66,7 +66,9 @@ export const PCFrame = ({
6666
function move(e: MouseEvent) {
6767
e.preventDefault();
6868
const { clientX } = e;
69-
const diffX = +(rightWidth - (clientX - xAxisRef.current)).toFixed(2);
69+
const diffX = Number(
70+
(rightWidth - (clientX - xAxisRef.current)).toFixed(2),
71+
);
7072
if (diffX > MAX_SIZE || diffX < MIN_SIZE) return;
7173
setWidth(diffX);
7274
}
@@ -90,9 +92,9 @@ export const PCFrame = ({
9092
<div className="pc-frame__top">
9193
<div className="pc-frame__top-left">
9294
<Space>
93-
<div className="function-circle close"></div>
94-
<div className="function-circle mini"></div>
95-
<div className="function-circle fullscreen"></div>
95+
<div className="function-circle close" />
96+
<div className="function-circle mini" />
97+
<div className="function-circle fullscreen" />
9698
</Space>
9799
</div>
98100
<div className="pc-frame__top-right">
@@ -144,16 +146,16 @@ const IOSFrame = ({ children }: PropsWithChildren<unknown>) => {
144146
<div className="ios-frame__top">
145147
<p className="ios-frame__top-left">{time}</p>
146148
<p className="ios-frame__top-hair">
147-
<p className="ios-frame__top-forehead"></p>
149+
<p className="ios-frame__top-forehead" />
148150
</p>
149151
<p className="ios-frame__top-right">
150-
<Icon component={CellularSVG}></Icon>
151-
<Icon component={BatterySVG} className="ios-battery"></Icon>
152+
<Icon component={CellularSVG} />
153+
<Icon component={BatterySVG} className="ios-battery" />
152154
</p>
153155
</div>
154156
<div className="ios-frame__content">{children}</div>
155157
<div className="ios-frame__bottom">
156-
<div className="ios-home"></div>
158+
<div className="ios-home" />
157159
</div>
158160
</div>
159161
);
@@ -163,17 +165,17 @@ const AndroidFrame = ({ children }: PropsWithChildren<unknown>) => {
163165
const time = getTime();
164166
return (
165167
<div className="android-frame">
166-
<div className="android-frame__camera"></div>
168+
<div className="android-frame__camera" />
167169
<div className="android-frame__top">
168170
<p className="android-frame__top-left">{time}</p>
169171
<p className="android-frame__top-right">
170-
<Icon component={CellularSVG}></Icon>
171-
<Icon component={BatterySVG} className="android-battery"></Icon>
172+
<Icon component={CellularSVG} />
173+
<Icon component={BatterySVG} className="android-battery" />
172174
</p>
173175
</div>
174176
<div className="android-frame__content">{children}</div>
175177
<div className="android-frame__bottom">
176-
<div className="android-home"></div>
178+
<div className="android-home" />
177179
</div>
178180
</div>
179181
);

src/pages/Devtools/ConsolePanel/components/ConsoleNode/index.tsx

+9-23
Original file line numberDiff line numberDiff line change
@@ -61,18 +61,10 @@ function GetterNode({
6161

6262
const PropertyValueContent = useMemo(() => {
6363
if (descriptor.value) {
64-
return (
65-
<span data-i18n-skip className="property-value">
66-
{descriptor.value}
67-
</span>
68-
);
64+
return <span className="property-value">{descriptor.value}</span>;
6965
}
7066
return (
71-
<span
72-
data-i18n-skip
73-
className="property-value ellipsis"
74-
onClick={getPropertyValue}
75-
>
67+
<span className="property-value ellipsis" onClick={getPropertyValue}>
7668
(...)
7769
</span>
7870
);
@@ -140,13 +132,12 @@ function AtomNode({ id, value, showArrow = true }: AtomNodeProps) {
140132
content = (
141133
<>
142134
<span
143-
data-i18n-skip
144135
className="property-key"
145136
style={{ fontStyle: 'normal' }}
146137
>
147138
{key}:{' '}
148139
</span>
149-
<span data-i18n-skip className="property-value">
140+
<span className="property-value">
150141
<CopyContent content={propertyContent} />
151142
</span>
152143
</>
@@ -178,13 +169,12 @@ function AtomNode({ id, value, showArrow = true }: AtomNodeProps) {
178169
value: (
179170
<>
180171
<span
181-
data-i18n-skip
182172
className="property-key"
183173
style={{ fontStyle: 'normal' }}
184174
>
185175
{key}:{' '}
186176
</span>
187-
<span data-i18n-skip className="property-value">
177+
<span className="property-value">
188178
<CopyContent
189179
content={
190180
propertyContent.value.value ||
@@ -212,10 +202,10 @@ function AtomNode({ id, value, showArrow = true }: AtomNodeProps) {
212202
return (
213203
<div key={key}>
214204
<code>
215-
<span data-i18n-skip className="property-key">
205+
<span className="property-key">
216206
{key === '___proto___' ? '__proto__' : key}:{' '}
217207
</span>
218-
<span data-i18n-skip className="property-value">
208+
<span className="property-value">
219209
<ConsoleNode data={{ ...propVal }} />
220210
</span>
221211
</code>
@@ -245,7 +235,7 @@ function AtomNode({ id, value, showArrow = true }: AtomNodeProps) {
245235
className={clsx(['spread-controller', spread && 'spread'])}
246236
/>
247237
)}
248-
<i data-i18n-skip>{value}</i>
238+
<i>{value}</i>
249239
</code>
250240
<PropertyPanel />
251241
</div>
@@ -268,7 +258,7 @@ function ConsoleNode({ data }: ConsoleNodeProps) {
268258
return (
269259
<code className="console-node object">
270260
<CaretRightOutlined />
271-
<i data-i18n-skip>
261+
<i>
272262
{`${superName} {`}
273263
<ConsoleNode
274264
data={{
@@ -297,11 +287,7 @@ function ConsoleNode({ data }: ConsoleNodeProps) {
297287
}
298288
}
299289

300-
return (
301-
<code data-i18n-skip className={`console-node ${className}`}>
302-
{node || '""'}
303-
</code>
304-
);
290+
return <code className={`console-node ${className}`}>{node || '""'}</code>;
305291
}
306292

307293
export default ConsoleNode;

src/pages/Devtools/ConsolePanel/components/CopyContent/index.tsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { message, Tooltip } from 'antd';
22
import { CopyOutlined } from '@ant-design/icons';
3-
import { useCallback, useMemo } from 'react';
3+
import { Fragment, useCallback, useMemo } from 'react';
44
import copy from 'copy-to-clipboard';
55
import React from 'react';
66
import './index.less';
@@ -33,7 +33,8 @@ const CopyContent: React.FC<Props> = ({ content, rows = 3, length = 120 }) => {
3333
}
3434
}, [content]);
3535

36-
if (computedContent === content) return <>{content}</>;
36+
if (computedContent === content)
37+
return React.createElement(Fragment, null, content);
3738

3839
return (
3940
<span className="copyable">

src/pages/Devtools/ConsolePanel/index.less

-1
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,6 @@
7171
background-color: #fff;
7272
// box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
7373
.icon {
74-
margin-top: 8px;
7574
font-size: 12px;
7675
font-weight: 700;
7776
color: #3d6fe9;

src/pages/Devtools/ConsolePanel/index.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ const ConsolePanel = () => {
6565
}, [code, socket]);
6666

6767
const onTextareaKeyDown = useCallback(
68+
// eslint-disable-next-line complexity
6869
(evt: KeyboardEvent<HTMLTextAreaElement>) => {
6970
evt.stopPropagation();
7071
const { key, keyCode, shiftKey, metaKey, ctrlKey, target: ta } = evt;

src/pages/Devtools/ElementPanel/index.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import React from 'react';
12
import { unified } from 'unified';
23
import domParse from 'rehype-dom-parse';
34
import domStringify from 'rehype-dom-stringify';

src/pages/Devtools/NetworkPanel/comps.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import React from 'react';
12
import {
23
Alert,
34
Button,

src/pages/Devtools/NetworkPanel/index.tsx

+14-20
Original file line numberDiff line numberDiff line change
@@ -245,11 +245,7 @@ const NetworkPanel = () => {
245245
<thead>
246246
<tr>
247247
{networkTitle.map((t) => {
248-
return (
249-
<td key={t} data-i18n-skip>
250-
{t}
251-
</td>
252-
);
248+
return <td key={t}>{t}</td>;
253249
})}
254250
</tr>
255251
</thead>
@@ -261,21 +257,19 @@ const NetworkPanel = () => {
261257
return (
262258
<Dropdown
263259
key={row.id}
264-
overlay={
265-
<Menu
266-
onClick={({ key }) => {
267-
onMenuClick(key, row);
268-
}}
269-
>
270-
<Menu.Item key="open-in-new-tab">
271-
Open in new tab
272-
</Menu.Item>
273-
<Menu.Item key="copy-link">
274-
Copy link address
275-
</Menu.Item>
276-
<Menu.Item key="copy-cURL">Copy as cURL</Menu.Item>
277-
</Menu>
278-
}
260+
menu={{
261+
items: [
262+
{
263+
key: 'open-in-new-tab',
264+
label: 'Open in new tab',
265+
},
266+
{ key: 'copy-link', label: 'Copy link address' },
267+
{ key: 'copy-cURL', label: 'Copy as cURL' },
268+
],
269+
onClick: ({ key }) => {
270+
onMenuClick(key, row);
271+
},
272+
}}
279273
trigger={['contextMenu']}
280274
>
281275
<tr

src/pages/Devtools/PagePanel/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ const PagePanel = () => {
9191
height="100%"
9292
sandbox="allow-same-origin"
9393
referrerPolicy="strict-origin-when-cross-origin"
94-
></iframe>
94+
/>
9595
</FrameWrapper>
9696
</div>
9797
</div>

src/pages/Devtools/SystemPanel/FeatureItem/index.tsx

+1-3
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,7 @@ export const FeatureItem: React.FC<SpySystem.FeatureDescriptor> = ({
2626
return (
2727
<Tooltip title={TitleOverlay} color="#fff" placement="topLeft">
2828
<div className="feature-item">
29-
<div className="feature-item__label" data-i18n-skip>
30-
{title}
31-
</div>
29+
<div className="feature-item__label">{title}</div>
3230
<div className="feature-item__value">
3331
<Icon component={icon} style={{ fontSize: 14, fontWeight: 700 }} />
3432
</div>

src/pages/Devtools/SystemPanel/index.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,6 @@ const SystemPanel = () => {
5050
<Col className="system-info__value">{system.ua}</Col>
5151
</Row>
5252
</Col>
53-
<Col></Col>
5453
</Row>
5554
</Card>
5655
</div>

0 commit comments

Comments
 (0)