mirror of
https://github.com/pezkuwichain/pwap.git
synced 2026-04-22 04:27:56 +00:00
Fix TypeScript errors and update dependencies
- Fix ReactPortal return types in PopupWindow, Tooltip, Modal - Fix RefObject type compatibility for React 18 - Update extension-dapp dependency to 0.62.19 - Update vanitygen dependency to 1.0.1 - Add eslint-scope resolution for webpack - Remove unused @ts-expect-error directives - Update mobile test snapshots
This commit is contained in:
@@ -942,18 +942,28 @@ exports[`DashboardScreen should match snapshot 1`] = `
|
||||
]
|
||||
}
|
||||
>
|
||||
<Text
|
||||
<View
|
||||
style={
|
||||
{
|
||||
"color": "#000000",
|
||||
"fontSize": 16,
|
||||
"fontWeight": "800",
|
||||
"letterSpacing": 0.5,
|
||||
"alignItems": "center",
|
||||
"flexDirection": "row",
|
||||
"gap": 10,
|
||||
}
|
||||
}
|
||||
>
|
||||
FINANCE 💰
|
||||
</Text>
|
||||
<Text
|
||||
style={
|
||||
{
|
||||
"color": "#000000",
|
||||
"fontSize": 16,
|
||||
"fontWeight": "800",
|
||||
"letterSpacing": 0.5,
|
||||
}
|
||||
}
|
||||
>
|
||||
FINANCE 💰
|
||||
</Text>
|
||||
</View>
|
||||
<View
|
||||
accessibilityState={
|
||||
{
|
||||
|
||||
@@ -25,75 +25,12 @@ exports[`SwapScreen should match snapshot 1`] = `
|
||||
<View
|
||||
style={
|
||||
{
|
||||
"alignItems": "center",
|
||||
"flexDirection": "row",
|
||||
"justifyContent": "space-between",
|
||||
"marginBottom": 20,
|
||||
"justifyContent": "flex-end",
|
||||
"marginBottom": 12,
|
||||
}
|
||||
}
|
||||
>
|
||||
<View
|
||||
accessibilityState={
|
||||
{
|
||||
"busy": undefined,
|
||||
"checked": undefined,
|
||||
"disabled": undefined,
|
||||
"expanded": undefined,
|
||||
"selected": undefined,
|
||||
}
|
||||
}
|
||||
accessibilityValue={
|
||||
{
|
||||
"max": undefined,
|
||||
"min": undefined,
|
||||
"now": undefined,
|
||||
"text": undefined,
|
||||
}
|
||||
}
|
||||
accessible={true}
|
||||
collapsable={false}
|
||||
focusable={true}
|
||||
onClick={[Function]}
|
||||
onResponderGrant={[Function]}
|
||||
onResponderMove={[Function]}
|
||||
onResponderRelease={[Function]}
|
||||
onResponderTerminate={[Function]}
|
||||
onResponderTerminationRequest={[Function]}
|
||||
onStartShouldSetResponder={[Function]}
|
||||
style={
|
||||
{
|
||||
"alignItems": "center",
|
||||
"backgroundColor": "#F5F5F5",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"opacity": 1,
|
||||
"width": 40,
|
||||
}
|
||||
}
|
||||
>
|
||||
<Text
|
||||
style={
|
||||
{
|
||||
"color": "#333",
|
||||
"fontSize": 24,
|
||||
}
|
||||
}
|
||||
>
|
||||
←
|
||||
</Text>
|
||||
</View>
|
||||
<Text
|
||||
style={
|
||||
{
|
||||
"color": "#333",
|
||||
"fontSize": 20,
|
||||
"fontWeight": "bold",
|
||||
}
|
||||
}
|
||||
>
|
||||
Swap Tokens
|
||||
</Text>
|
||||
<View
|
||||
accessibilityState={
|
||||
{
|
||||
|
||||
@@ -67,6 +67,7 @@
|
||||
"test:skipped": "echo 'tests skipped'"
|
||||
},
|
||||
"dependencies": {
|
||||
"@pezkuwi/extension-dapp": "0.62.19",
|
||||
"@pezkuwi/ui-shared": "^3.17.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
@@ -99,6 +100,7 @@
|
||||
"@pezkuwi/api-base": "^16.5.6",
|
||||
"@pezkuwi/api-contract": "^16.5.6",
|
||||
"@pezkuwi/api-derive": "^16.5.6",
|
||||
"@pezkuwi/extension-dapp": "0.62.19",
|
||||
"@pezkuwi/extension-inject": "^0.62.18",
|
||||
"@pezkuwi/hw-ledger": "^14.0.7",
|
||||
"@pezkuwi/keyring": "^14.0.7",
|
||||
@@ -125,6 +127,7 @@
|
||||
"@pezkuwi/x-textencoder": "^14.0.7",
|
||||
"@pezkuwi/x-ws": "^14.0.7",
|
||||
"@zondax/ledger-substrate": "1.1.1",
|
||||
"typescript": "^5.5.4"
|
||||
"typescript": "^5.5.4",
|
||||
"webpack/eslint-scope": "5.1.1"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
"@pezkuwi/react-components": "^0.168.2-0-x",
|
||||
"@pezkuwi/react-hooks": "^0.168.2-0-x",
|
||||
"@pezkuwi/util": "^14.0.5",
|
||||
"@pezkuwi/vanitygen": "^1.0.0",
|
||||
"@pezkuwi/vanitygen": "^1.0.1",
|
||||
"detect-browser": "^5.3.0",
|
||||
"file-saver": "^2.0.5"
|
||||
},
|
||||
|
||||
@@ -259,7 +259,6 @@ function ClaimsApp ({ basePath }: Props): React.ReactElement<Props> {
|
||||
/>
|
||||
)}
|
||||
<div>{t('Copy the following string and sign it with the Ethereum account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below:')}</div>
|
||||
{/* @ts-expect-error React 18 type compatibility */}
|
||||
<CopyToClipboard
|
||||
onCopy={onCopy}
|
||||
text={payload}
|
||||
|
||||
@@ -35,7 +35,7 @@ function TrackDropdown ({ className, exclude, include, onChange, palletReferenda
|
||||
);
|
||||
}
|
||||
|
||||
export default React.memo(styled(TrackDropdown)`
|
||||
const StyledTrackDropdown: React.FC<Props> = styled(TrackDropdown)`
|
||||
.trackOption {
|
||||
.faded {
|
||||
font-size: var(--font-size-small);
|
||||
@@ -44,4 +44,6 @@ export default React.memo(styled(TrackDropdown)`
|
||||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
`);
|
||||
`;
|
||||
|
||||
export default React.memo(StyledTrackDropdown);
|
||||
|
||||
@@ -21,9 +21,9 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@pezkuwi/api": "^16.5.6",
|
||||
"@pezkuwi/extension-compat-metamask": "^0.62.14",
|
||||
"@pezkuwi/extension-dapp": "^0.62.14",
|
||||
"@pezkuwi/extension-inject": "^0.62.14",
|
||||
"@pezkuwi/extension-compat-metamask": "^0.62.19",
|
||||
"@pezkuwi/extension-dapp": "^0.62.19",
|
||||
"@pezkuwi/extension-inject": "^0.62.19",
|
||||
"@pezkuwi/rpc-provider": "^16.5.6",
|
||||
"fflate": "^0.8.1",
|
||||
"rxjs": "^7.8.1"
|
||||
|
||||
@@ -65,8 +65,7 @@ function AddressSection ({ accountIndex, defaultValue, editingName, flags, onCha
|
||||
</div>
|
||||
<div className='ui--AddressSection__CopyColumn'>
|
||||
<div className='ui--AddressMenu-copyaddr'>
|
||||
{/* @ts-expect-error React 18 type compatibility */}
|
||||
<CopyToClipboard
|
||||
<CopyToClipboard
|
||||
text={value}
|
||||
>
|
||||
<span>
|
||||
|
||||
+1
-1
@@ -16,7 +16,7 @@ interface Props {
|
||||
address: string;
|
||||
isBeingEdited: (arg: boolean) => void;
|
||||
onUpdateName?: (() => void) | null;
|
||||
sidebarRef: React.RefObject<HTMLDivElement>;
|
||||
sidebarRef: React.RefObject<HTMLDivElement | null>;
|
||||
}
|
||||
|
||||
function SidebarEditableSection ({ accountIndex, address, isBeingEdited, onUpdateName, sidebarRef }: Props): React.ReactElement<Props> {
|
||||
|
||||
@@ -46,7 +46,6 @@ function CopyButton ({ children, className = '', icon = 'copy', label, type, val
|
||||
|
||||
return (
|
||||
<StyledDiv className={`${className} ui--CopyButton`}>
|
||||
{/* @ts-expect-error React 18 type compatibility */}
|
||||
<CopyToClipboard
|
||||
onCopy={_onCopy}
|
||||
text={value as string}
|
||||
|
||||
@@ -24,7 +24,7 @@ interface Props {
|
||||
testId?: string;
|
||||
}
|
||||
|
||||
function ModalBase ({ children, className = '', header, onClose, size = 'medium', testId = 'modal' }: Props): React.ReactElement<Props> {
|
||||
function ModalBase ({ children, className = '', header, onClose, size = 'medium', testId = 'modal' }: Props): React.ReactPortal {
|
||||
const { themeClassName } = useTheme();
|
||||
|
||||
const listenKeyboard = useCallback((event: KeyboardEvent) => {
|
||||
|
||||
@@ -10,14 +10,14 @@ import { usePopupWindow } from '@pezkuwi/react-hooks/usePopupWindow';
|
||||
|
||||
import { styled } from '../styled.js';
|
||||
|
||||
function PopupWindow ({ children, className = '', position, triggerRef, windowRef }: Props): React.ReactElement<Props> {
|
||||
function PopupWindow ({ children, className = '', position, triggerRef, windowRef }: Props): React.ReactPortal {
|
||||
const { pointerStyle, renderCoords: { x, y } } = usePopupWindow(windowRef, triggerRef, position);
|
||||
|
||||
return createPortal(
|
||||
<StyledDiv
|
||||
className={`${className} ${pointerStyle}Pointer ${position}Position`}
|
||||
data-testid='popup-window'
|
||||
ref={windowRef}
|
||||
ref={windowRef as React.RefObject<HTMLDivElement>}
|
||||
style={
|
||||
(x && y && {
|
||||
transform: `translate3d(${x}px, ${y}px, 0)`,
|
||||
|
||||
@@ -17,8 +17,8 @@ export type VerticalPosition = 'top' | 'bottom'
|
||||
export interface PopupWindowProps {
|
||||
className?: string;
|
||||
children?: React.ReactNode;
|
||||
windowRef: React.RefObject<HTMLDivElement>;
|
||||
triggerRef: React.RefObject<HTMLDivElement>;
|
||||
windowRef: React.RefObject<HTMLDivElement | null>;
|
||||
triggerRef: React.RefObject<HTMLDivElement | null>;
|
||||
position: HorizontalPosition;
|
||||
}
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@ interface Props {
|
||||
offset?: number | string;
|
||||
onClose?: () => void;
|
||||
position: 'left' | 'right';
|
||||
sidebarRef: React.RefObject<HTMLDivElement>;
|
||||
sidebarRef: React.RefObject<HTMLDivElement | null>;
|
||||
}
|
||||
|
||||
function Sidebar ({ buttons, children, className = '', dataTestId = '', onClose, position, sidebarRef }: Props): React.ReactElement<Props> {
|
||||
@@ -22,7 +22,7 @@ function Sidebar ({ buttons, children, className = '', dataTestId = '', onClose,
|
||||
<StyledDiv
|
||||
className={`${className} ui--Sidebar ${position}Position`}
|
||||
data-testid={dataTestId}
|
||||
ref={sidebarRef}
|
||||
ref={sidebarRef as React.RefObject<HTMLDivElement>}
|
||||
>
|
||||
<Button.Group className='ui--Sidebar-buttons'>
|
||||
{buttons}
|
||||
|
||||
@@ -22,7 +22,7 @@ interface Props {
|
||||
trigger: string;
|
||||
}
|
||||
|
||||
function Tooltip ({ children, className = '', isClickable = false, place, text, trigger }: Props): React.ReactElement<Props> | null {
|
||||
function Tooltip ({ children, className = '', isClickable = false, place, text, trigger }: Props): React.ReactPortal {
|
||||
const [tooltipContainer] = useState(
|
||||
typeof document === 'undefined'
|
||||
? {} as HTMLElement // This hack is required for server side rendering
|
||||
|
||||
@@ -7,14 +7,14 @@ import { useCallback, useEffect } from 'react';
|
||||
|
||||
import { createNamedHook } from './createNamedHook.js';
|
||||
|
||||
function isRefClicked (refs: React.RefObject<HTMLDivElement>[], e: MouseEvent): boolean {
|
||||
function isRefClicked (refs: React.RefObject<HTMLDivElement | null>[], e: MouseEvent): boolean {
|
||||
return refs.some((r) =>
|
||||
r.current &&
|
||||
r.current.contains(e.target as HTMLElement)
|
||||
);
|
||||
}
|
||||
|
||||
function useOutsideClickImpl (refs: React.RefObject<HTMLDivElement>[], callback: () => void): void {
|
||||
function useOutsideClickImpl (refs: React.RefObject<HTMLDivElement | null>[], callback: () => void): void {
|
||||
const handleClick = useCallback(
|
||||
(e: MouseEvent): void => {
|
||||
if (refs.length && !isRefClicked(refs, e)) {
|
||||
|
||||
@@ -25,7 +25,7 @@ interface Result {
|
||||
|
||||
const COORD_0: Coord = { x: 0, y: 0 };
|
||||
|
||||
function usePopupWindowImpl (windowRef: React.RefObject<HTMLDivElement>, triggerRef: React.RefObject<HTMLDivElement>, position: HorizontalPosition): Result {
|
||||
function usePopupWindowImpl (windowRef: React.RefObject<HTMLDivElement | null>, triggerRef: React.RefObject<HTMLDivElement | null>, position: HorizontalPosition): Result {
|
||||
const [renderCoords, setRenderCoords] = useState<Coord>(COORD_0);
|
||||
const [pointerStyle, setPointerStyle] = useState<VerticalPosition>('top');
|
||||
const windowCoords = useElementPosition(windowRef);
|
||||
|
||||
Reference in New Issue
Block a user