fix: do not do type-only imports of React

This commit is contained in:
Zephyr Lykos 2024-03-05 10:28:07 +08:00
parent e6665a3977
commit 643f73c752
No known key found for this signature in database
GPG Key ID: D3E9D31E2F77F04D
42 changed files with 163 additions and 173 deletions

View File

@ -1,4 +1,3 @@
import type React from 'react';
type AlertType = 'success' | 'info' | 'warning' | 'danger';

View File

@ -1,4 +1,3 @@
import type React from 'react';
type Properties = {
readonly title?: string;

View File

@ -1,4 +1,4 @@
import React, {useState} from 'react';
import {useState} from 'react';
import * as fetch from '@/scripts/net';
type Properties = {

View File

@ -1,5 +1,5 @@
/** @jsxImportSource @emotion/react */
import type React from 'react';
import {useState, useEffect} from 'react';
import Autosuggest from 'react-autosuggest';
import {css} from '@emotion/react';

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect, useRef} from 'react';
import {useState, useEffect, useRef} from 'react';
import $ from 'jquery';
import 'bootstrap';
import {t} from '../scripts/i18n';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import ModalContent, {type Props as ContentProperties} from './ModalContent';
import ModalInput, {
type

View File

@ -1,4 +1,3 @@
import type React from 'react';
export type Props = {
readonly text?: string;

View File

@ -1,4 +1,3 @@
import type React from 'react';
export type Props = {
readonly flexFooter?: boolean;

View File

@ -1,4 +1,3 @@
import type React from 'react';
export type Props = {
readonly title?: string;

View File

@ -1,4 +1,3 @@
import type React from 'react';
export type Props = {
readonly inputType?: string;

View File

@ -1,4 +1,4 @@
import type React from 'react';
import PaginationItem from './PaginationItem';
import {t} from '@/scripts/i18n';

View File

@ -1,4 +1,3 @@
import type React from 'react';
type Properties = {
readonly disabled?: boolean;

View File

@ -1,5 +1,5 @@
/** @jsxImportSource @emotion/react */
import type React from 'react';
import {useState, useEffect} from 'react';
import {css} from '@emotion/react';

View File

@ -1,5 +1,5 @@
/** @jsxImportSource @emotion/react */
import type React from 'react';
import {useState, useEffect, useRef} from 'react';
import {useMeasure} from 'react-use';
import {css} from '@emotion/react';

View File

@ -1,4 +1,4 @@
import React, {useEffect, useRef} from 'react';
import {useEffect, useRef} from 'react';
import ReactDOM from 'react-dom';
import styled from '@emotion/styled';
import {Terminal} from 'xterm';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import clsx from 'clsx';
import {Box} from './styles';
import {t} from '@/scripts/i18n';

View File

@ -1,4 +1,4 @@
import React, {useState} from 'react';
import {useState} from 'react';
import {t} from '@/scripts/i18n';
import {TextureType} from '@/scripts/types';
import Modal from '@/components/Modal';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import {t} from '@/scripts/i18n';
import type {Player} from '@/scripts/types';
import ButtonEdit from '@/components/ButtonEdit';

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect, useLayoutEffect} from 'react';
import {useState, useEffect, useLayoutEffect} from 'react';
import {useImmer} from 'use-immer';
import Header from '../UsersManagement/Header';
import Card from './Card';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import styled from '@emotion/styled';
import clsx from 'clsx';
import type {Plugin} from './types';

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect} from 'react';
import {useState, useEffect} from 'react';
import {useImmer} from 'use-immer';
import InfoBox from './InfoBox';
import type {Plugin} from './types';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import type {Plugin} from './types';
import {t} from '@/scripts/i18n';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import styled from '@emotion/styled';
import {type Report, Status} from './types';
import {t} from '@/scripts/i18n';

View File

@ -1,5 +1,4 @@
import styled from '@emotion/styled';
import type React from 'react';
import type {Line} from './types';
import {t} from '@/scripts/i18n';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import clsx from 'clsx';
import {Box, Icon, InfoTable} from './styles';
import {

View File

@ -1,4 +1,4 @@
import type React from 'react';
import {
humanizePermission,
verificationStatusText,

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect, useLayoutEffect} from 'react';
import {useState, useEffect, useLayoutEffect} from 'react';
import {useImmer} from 'use-immer';
import Header from './Header';
import Card from './Card';

View File

@ -1,4 +1,4 @@
import React, {useState, useRef, useEffect} from 'react';
import {useState, useRef, useEffect} from 'react';
import useBlessingExtra from '@/scripts/hooks/useBlessingExtra';
import useEmitMounted from '@/scripts/hooks/useEmitMounted';
import {t} from '@/scripts/i18n';

View File

@ -23,7 +23,7 @@ export type Badge = {
const Previewer = React.lazy(async () => import('@/components/Viewer'));
function Show() {
export default function Show() {
const [texture, setTexture] = useState<Texture>({} as Texture);
const [isLoading, setIsLoading] = useState(true);
const [showModalApply, setShowModalApply] = useState(false);
@ -50,14 +50,14 @@ function Show() {
setIsLoading(false);
};
fetchInfo();
void fetchInfo();
}, []);
useEffect(() => {
setLiked(blessing.extra.inCloset as boolean);
}, []);
const handleEditName = async () => {
async function handleEditName() {
let name: string;
try {
const {value} = await showModal({
@ -85,9 +85,9 @@ function Show() {
} else {
toast.error(message);
}
};
}
const handleSwitchType = async () => {
async function handleSwitchType() {
let type: TextureType;
try {
const {value} = await showModal({
@ -116,34 +116,27 @@ function Show() {
} else {
toast.error(message);
}
};
}
const handleAddItemClick = async () => {
async function handleAddItemClick() {
const ok = await addClosetItem(texture);
if (ok) {
setTexture(texture => ({...texture, likes: texture.likes + 1}));
setLiked(true);
}
};
}
const handleRemoveItemClick = async () => {
async function handleRemoveItemClick() {
const ok = await removeClosetItem(texture.tid);
if (ok) {
setTexture(texture => ({...texture, likes: texture.likes - 1}));
setLiked(false);
}
};
}
const handleSetAsAvatar = async () => setAsAvatar(texture.tid);
const handleDownloadClick = () => {
const a = document.createElement('a');
a.href = `${blessing.base_url}/raw/${texture.tid}`;
a.download = `${texture.name}.png`;
a.click();
};
const handleReport = async () => {
async function handleReport() {
const prompt = (() => {
if (reportScore > 0) {
return t('skinlib.report.positive', {score: reportScore.toString()});
@ -181,9 +174,9 @@ function Show() {
} else {
toast.error(message);
}
};
}
const handlePrivacyClick = async () => {
async function handlePrivacyClick() {
try {
await showModal({
text: texture.public
@ -194,35 +187,34 @@ function Show() {
return;
}
type Ok = {code: 0; message: string};
type Error_ = {code: 1; message: string};
type Duplicated = {code: 2; message: string; data: {tid: number}};
type OkResp = {code: 0; message: string};
type ErrorResp = {code: 1; message: string};
type DuplicatedResp = {code: 2; message: string; data: {tid: number}};
const resp = await fetch.put<Ok | Error_ | Duplicated>(
urls.texture.privacy(texture.tid),
);
const {code, message} = resp;
if (code === 0) {
toast.success(message);
setTexture(texture => ({...texture, public: !texture.public}));
} else if (resp.code === 2) {
try {
await showModal({
mode: 'confirm',
text: message,
okButtonText: t('user.viewInSkinlib'),
});
window.location.href
= blessing.base_url + urls.skinlib.show(resp.data.tid);
} catch {
//
}
} else {
toast.error(message);
}
};
const resp = await fetch.put<OkResp | ErrorResp | DuplicatedResp>(
urls.texture.privacy(texture.tid),
);
const {code, message} = resp;
if (code === 0) {
toast.success(message);
setTexture(texture => ({...texture, public: !texture.public}));
} else if (resp.code === 2) {
try {
await showModal({
mode: 'confirm',
text: message,
okButtonText: t('user.viewInSkinlib'),
});
window.location.href = blessing.base_url + urls.skinlib.show(resp.data.tid);
} catch {
void 0;
}
} else {
toast.error(message);
}
}
const handleDeleteTextureClick = async () => {
async function handleDeleteTextureClick() {
try {
await showModal({
text: t('skinlib.deleteNotice'),
@ -243,7 +235,7 @@ function Show() {
} else {
toast.error(message);
}
};
}
const handleOpenModalApply = () => {
setShowModalApply(true);
@ -272,86 +264,94 @@ function Show() {
return (
<>
{container
&& createPortal(
<React.Suspense fallback={<ViewerSkeleton/>}>
<Previewer
{...{
[texture.type === TextureType.Cape ? TextureType.Cape : 'skin']:
textureUrl,
}}
isAlex={texture.type === TextureType.Alex}
initPositionZ={60}
>
{currentUid === 0 ? (
<button
className='btn btn-outline-secondary'
title={t('skinlib.show.anonymous')}
disabled
>
{t('skinlib.addToCloset')}
</button>
) : (
<div className='d-flex justify-content-between align-items-center'>
<div>
{liked && (
<button
className='btn btn-outline-success mr-2'
onClick={handleOpenModalApply}
>
{t('skinlib.apply')}
</button>
)}
{liked ? (
<button
className='btn btn-outline-primary mr-2'
onClick={handleRemoveItemClick}
>
{t('skinlib.removeFromCloset')}
</button>
) : (
<button
className='btn btn-outline-primary mr-2'
onClick={handleAddItemClick}
>
{t('skinlib.addToCloset')}
</button>
)}
{texture.type !== TextureType.Cape && (
<button
className='btn btn-outline-info mr-2'
onClick={handleSetAsAvatar}
>
{t('user.setAsAvatar')}
</button>
)}
{canBeDownloaded && (
<button
className='btn btn-outline-info mr-2'
onClick={handleDownloadClick}
>
{t('skinlib.show.download')}
</button>
)}
<button
className='btn btn-outline-info mr-2'
onClick={handleReport}
>
{t('skinlib.report.title')}
</button>
</div>
<div
className={liked ? 'text-red' : 'text-gray'}
title={t('skinlib.show.likes')}
>
<i className='fas fa-heart mr-1'/>
<span>{texture.likes}</span>
</div>
</div>
)}
</Previewer>
</React.Suspense>,
container,
)}
&& createPortal(
<React.Suspense fallback={<ViewerSkeleton/>}>
<Previewer
{...{
[texture.type === TextureType.Cape ? TextureType.Cape : 'skin']:
textureUrl,
}}
isAlex={texture.type === TextureType.Alex}
initPositionZ={60}
>
{currentUid === 0 ? (
<button
disabled
type='button'
className='btn btn-outline-secondary'
title={t('skinlib.show.anonymous')}
>
{t('skinlib.addToCloset')}
</button>
) : (
<div className='d-flex justify-content-between align-items-center'>
<div>
{liked && (
<button
type='button'
className='btn btn-outline-success mr-2'
onClick={handleOpenModalApply}
>
{t('skinlib.apply')}
</button>
)}
{liked ? (
<button
type='button'
className='btn btn-outline-primary mr-2'
onClick={handleRemoveItemClick}
>
{t('skinlib.removeFromCloset')}
</button>
) : (
<button
type='button'
className='btn btn-outline-primary mr-2'
onClick={handleAddItemClick}
>
{t('skinlib.addToCloset')}
</button>
)}
{texture.type !== TextureType.Cape && (
<button
type='button'
className='btn btn-outline-info mr-2'
onClick={handleSetAsAvatar}
>
{t('user.setAsAvatar')}
</button>
)}
{canBeDownloaded && (
<a
role='button'
className='btn btn-outline-info mr-2'
href={`${blessing.base_url}/raw/${texture.tid}`}
download={`${texture.name}.png`}
>
{t('skinlib.show.download')}
</a>
)}
<button
type='button'
className='btn btn-outline-info mr-2'
onClick={handleReport}
>
{t('skinlib.report.title')}
</button>
</div>
<div
className={liked ? 'text-red' : 'text-gray'}
title={t('skinlib.show.likes')}
>
<i className='fas fa-heart mr-1'/>
<span>{texture.likes}</span>
</div>
</div>
)}
</Previewer>
</React.Suspense>,
container,
)}
<div className='card card-primary'>
<div className='card-header'>
<h3 className='card-title'>{t('skinlib.show.detail')}</h3>
@ -466,12 +466,13 @@ function Show() {
</div>
<div className='card-footer'>
<div className='container d-flex justify-content-between'>
<button className='btn btn-warning' onClick={handlePrivacyClick}>
<button type='button' className='btn btn-warning' onClick={handlePrivacyClick}>
{texture.public
? t('skinlib.setAsPrivate')
: t('skinlib.setAsPublic')}
</button>
<button
type='button'
className='btn btn-danger'
onClick={handleDeleteTextureClick}
>
@ -486,12 +487,10 @@ function Show() {
canAdd={false}
{...{
[texture.type === TextureType.Cape ? TextureType.Cape : 'skin']:
texture.tid,
texture.tid,
}}
onClose={handleCloseModalApply}
/>
</>
);
}
export default Show;

View File

@ -1,4 +1,3 @@
import type React from 'react';
type Properties = {
readonly active?: boolean;

View File

@ -1,4 +1,4 @@
import type React from 'react';
import Button from './Button';
import type {Filter} from './types';
import {humanizeType} from './utils';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import styled from '@emotion/styled';
import type {LibraryItem} from './types';
import {humanizeType} from './utils';

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect} from 'react';
import {useState, useEffect} from 'react';
import addClosetItem from '../Show/addClosetItem';
import FilterSelector from './FilterSelector';
import Button from './Button';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import setAsAvatar from './setAsAvatar';
import {Card, DropdownButton} from './styles';
import {t} from '@/scripts/i18n';

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect} from 'react';
import {useState, useEffect} from 'react';
import $ from 'jquery';
import {t} from '@/scripts/i18n';
import * as fetch from '@/scripts/net';

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect, useRef} from 'react';
import {useState, useEffect, useRef} from 'react';
import debounce from 'lodash-es/debounce';
import ClosetItem from './ClosetItem';
import LoadingClosetItem from './LoadingClosetItem';

View File

@ -1,4 +1,4 @@
import React, {useState} from 'react';
import {useState} from 'react';
import {t} from '@/scripts/i18n';
import Modal from '@/components/Modal';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import type {App} from './types';
import {t} from '@/scripts/i18n';
import ButtonEdit from '@/components/ButtonEdit';

View File

@ -1,4 +1,4 @@
import React, {useState} from 'react';
import {useState} from 'react';
import {t} from '@/scripts/i18n';
import * as fetch from '@/scripts/net';
import {toast} from '@/scripts/notify';

View File

@ -1,4 +1,4 @@
import React, {useState} from 'react';
import {useState} from 'react';
import {t} from '@/scripts/i18n';
import Modal from '@/components/Modal';

View File

@ -1,4 +1,4 @@
import type React from 'react';
import styled from '@emotion/styled';
import {t} from '@/scripts/i18n';

View File

@ -1,4 +1,4 @@
import React, {useState, useEffect} from 'react';
import {useState, useEffect} from 'react';
import Row from './Row';
import LoadingRow from './LoadingRow';
import Previewer from './Previewer';