Simplify React import in preparation from using a version from CDN

This commit is contained in:
Kuba Orlik 2022-01-29 20:50:44 +01:00
parent 9c1eb31224
commit 46e6c448b2
10 changed files with 47 additions and 50 deletions

View File

@ -1,5 +1,4 @@
import React from 'react';
import { useState } from 'react';
import { RequestCluster } from '../request-cluster';
import { StolenDataEntry } from '../stolen-data-entry';
import { getDate, toBase64 } from '../util';
@ -15,12 +14,13 @@ export default function EmailTemplate1({
clusters: Record<string, RequestCluster>;
version: number;
}): JSX.Element {
const [popupState, setPopupState] = useState<PopupState>('not_clicked');
const [acceptAllName, setAcceptAllName] = useState<string>(
const [popupState, setPopupState] =
React.useState<PopupState>('not_clicked');
const [acceptAllName, setAcceptAllName] = React.useState<string>(
'Zaakceptuj wszystkie'
);
const [popupScreenshotBase64, setPopupScreenshotBase64] =
useState<string>(null);
React.useState<string>(null);
return (
<div>

View File

@ -1,5 +1,4 @@
import React from 'react';
import { Dispatch, SetStateAction } from 'react';
import { toBase64 } from '../util';
import { EmailTemplate2Config } from './email-template-2';
@ -8,7 +7,7 @@ export default function EmailTemplate2Controls({
setConfig,
}: {
config: EmailTemplate2Config;
setConfig: Dispatch<SetStateAction<EmailTemplate2Config>>;
setConfig: React.Dispatch<React.SetStateAction<EmailTemplate2Config>>;
}): JSX.Element {
return (
<div>

View File

@ -1,4 +1,4 @@
import React, { useState } from 'react';
import React from 'react';
import { RequestCluster } from '../request-cluster';
import { StolenDataEntry } from '../stolen-data-entry';
import { getDate, unique } from '../util';
@ -75,7 +75,7 @@ export default function EmailTemplate2({
clusters: Record<string, RequestCluster>;
version: number;
}): JSX.Element {
const [config, setConfig] = useState<EmailTemplate2Config>({
const [config, setConfig] = React.useState<EmailTemplate2Config>({
popup_type: 'none',
popup_action: 'ignored',
popup_screenshot_base64: null,

View File

@ -1,4 +1,4 @@
import React, { useState } from 'react';
import React from 'react';
import { RequestCluster } from '../request-cluster';
import { StolenDataEntry } from '../stolen-data-entry';
import EmailTemplate1 from './email-template-1';
@ -13,7 +13,7 @@ export default function EmailTemplate({
clusters: Record<string, RequestCluster>;
version: number;
}) {
const [templateVersion, setTemplateVersion] = useState('2');
const [templateVersion, setTemplateVersion] = React.useState('2');
return (
<div>
<select

View File

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import React from 'react';
import { HAREntry } from '../extended-request';
import { StolenDataEntry } from '../stolen-data-entry';
import { getshorthost, unique } from '../util';
@ -80,11 +80,11 @@ export default function HARConverter({
}: {
entries: StolenDataEntry[];
}) {
const [filtered, setFiltered] = useState<Blob | null>(null);
const [filename, setFilename] = useState('');
const [filtered, setFiltered] = React.useState<Blob | null>(null);
const [filename, setFilename] = React.useState('');
const [fakeHAR, setFakeHAR] =
useState<ReturnType<typeof generateFakeHAR>>();
useEffect(() => {
React.useState<ReturnType<typeof generateFakeHAR>>();
React.useEffect(() => {
setFakeHAR(generateFakeHAR(entries));
}, []);

View File

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import React from 'react';
import ReactDOM from 'react-dom';
import { getMemory } from '../memory';
import { Classifications, StolenDataEntry } from '../stolen-data-entry';
@ -88,15 +88,12 @@ function Report() {
console.time('useMemory');
const [counter, setCounter] = useEmitter(getMemory());
console.timeEnd('useMemory');
function refresh() {
setCounter((c) => c + 1);
}
console.time('getClustersForOrigin');
const clusters = getMemory().getClustersForOrigin(origin);
console.timeEnd('getClustersForOrigin');
const [entries, setEntries] = useState<StolenDataEntry[]>([]);
const [entries, setEntries] = React.useState<StolenDataEntry[]>([]);
console.time('useEffect report-window');
useEffect(() => {
React.useEffect(() => {
setEntries(
Object.values(clusters)
.map((cluster) => {

View File

@ -1,4 +1,4 @@
import React, { Fragment, useEffect, useState } from 'react';
import React from 'react';
import ReactDOM from 'react-dom';
import Options from '../options';
import { StolenData } from './stolen-data';
@ -17,26 +17,28 @@ import './global.scss';
import './sidebar.scss';
const Sidebar = () => {
const [origin, setOrigin] = useState<string | null>(null);
const [minValueLength, setMinValueLength] = useState<number | null>(
const [origin, setOrigin] = React.useState<string | null>(null);
const [minValueLength, setMinValueLength] = React.useState<number | null>(
localStorage.getItem('minValueLength') === null
? 7
: (localStorage.getItem('minValueLength') as unknown as number)
);
const [cookiesOnly, setCookiesOnly] = useState<boolean>(false);
const [stolenDataView, setStolenDataView] = useState<boolean>(true);
const [cookiesOnly, setCookiesOnly] = React.useState<boolean>(false);
const [stolenDataView, setStolenDataView] = React.useState<boolean>(true);
const [cookiesOrOriginOnly, setCookiesOrOriginOnly] =
useState<boolean>(false);
React.useState<boolean>(false);
const [counter, setCounter] = useEmitter(getMemory());
const [marksOccurrence, setMarksOccurrence] = useState<boolean>(false);
const [warningDataDialogAck, setWarningDataDialogAck] = useState<boolean>(
localStorage.getItem('warningDataDialogAck') === null
? true
: localStorage.getItem('warningDataDialogAck') == 'true'
? true
: false
);
const [logoVisibility, setLogoVisibility] = useState<boolean>(
const [marksOccurrence, setMarksOccurrence] =
React.useState<boolean>(false);
const [warningDataDialogAck, setWarningDataDialogAck] =
React.useState<boolean>(
localStorage.getItem('warningDataDialogAck') === null
? true
: localStorage.getItem('warningDataDialogAck') == 'true'
? true
: false
);
const [logoVisibility, setLogoVisibility] = React.useState<boolean>(
localStorage.getItem('logoVisibility') === null
? false
: localStorage.getItem('logoVisibility') == 'true'
@ -44,7 +46,7 @@ const Sidebar = () => {
: false
);
useEffect(() => {
React.useEffect(() => {
const listener = async (data: any) => {
console.log('tab change!');
const tab = await getCurrentTab();
@ -60,7 +62,7 @@ const Sidebar = () => {
};
});
useEffect(() => {
React.useEffect(() => {
for (const cluster of Object.values(
getMemory().getClustersForOrigin(origin)
)) {
@ -91,12 +93,12 @@ const Sidebar = () => {
}
>
{origin ? (
<Fragment>
<>
<span>Analiza strony</span>
<span className="webpage-metadata--hyperlink">
{origin}
</span>
</Fragment>
</>
) : (
<span>Przejdź do wybranej strony internetowej</span>
)}
@ -190,7 +192,7 @@ const Sidebar = () => {
<section>
{stolenDataView ? (
<Fragment>
<>
{warningDataDialogAck ? (
<section className="warning-container">
<span>
@ -225,7 +227,7 @@ const Sidebar = () => {
cookiesOnly={cookiesOnly}
cookiesOrOriginOnly={cookiesOrOriginOnly}
/>
</Fragment>
</>
) : (
<Options
minValueLength={minValueLength}

View File

@ -1,5 +1,4 @@
import React from 'react';
import { useEffect, useState } from 'react';
export default function TabDropdown({
setPickedTab,
@ -8,8 +7,8 @@ export default function TabDropdown({
setPickedTab: (tab_id: number) => void;
pickedTab: number;
}) {
const [tabs, setTabs] = useState([]);
useEffect(() => {
const [tabs, setTabs] = React.useState([]);
React.useEffect(() => {
browser.tabs.query({ currentWindow: true }).then(setTabs);
}, []);
return (

View File

@ -1,6 +1,6 @@
{
"compilerOptions": {
"jsx": "react",
"jsx": "react-jsx",
"noImplicitAny": true,
"esModuleInterop": true,
"lib": ["es2017", "dom", "es2019"],

View File

@ -1,5 +1,5 @@
import { EventEmitter } from 'events';
import { Dispatch, SetStateAction, useEffect, useState } from 'react';
import React from 'react';
export type Unpromisify<T> = T extends Promise<infer R> ? R : T;
export type Unarray<T> = T extends Array<infer R> ? R : T;
@ -47,9 +47,9 @@ export function getshorthost(host: string) {
export function useEmitter(
e: EventEmitter
): [number, Dispatch<SetStateAction<number>>] {
const [counter, setCounter] = useState<number>(0);
useEffect(() => {
): [number, React.Dispatch<React.SetStateAction<number>>] {
const [counter, setCounter] = React.useState<number>(0);
React.useEffect(() => {
const callback = () => {
setCounter((counter) => counter + 1);
};