Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor(wallet): improve component imports #1743

Merged
merged 14 commits into from
Aug 14, 2024
Merged
Show file tree
Hide file tree
Changes from 10 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions apps/wallet/configs/ts/tsconfig.common.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@
"_hooks": ["./src/ui/app/hooks/"],
"_helpers": ["./src/ui/app/helpers/"],
"_pages/*": ["./src/ui/app/pages/*"],
"_components": ["./src/ui/app/components"],
"_components/*": ["./src/ui/app/components/*"],
"_messaging/*": ["./src/shared/messaging/*"],
"_messages": ["./src/shared/messaging/messages/"],
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import { toast } from 'react-hot-toast';
import { useNavigate } from 'react-router-dom';
import { object, string as YupString } from 'yup';

import Alert from './alert';
import { Alert } from '_components';
begonaalvarezd marked this conversation as resolved.
Show resolved Hide resolved

const validation = object({
password: YupString().ensure().required().label('Password'),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { Copy12 } from '@iota/icons';
import { Text } from '_src/ui/app/shared/text';
import { formatAddress } from '@iota/iota-sdk/utils';
import { useCopyToClipboard } from '../../hooks/useCopyToClipboard';
import { IconButton } from '../IconButton';
import { IconButton } from '_components';
import { type SerializedUIAccount } from '_src/background/accounts/Account';
import { useBalance, useFormatCoin } from '@iota/core';

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,7 @@ import { forwardRef, type ReactNode } from 'react';
import { useAccounts } from '../../hooks/useAccounts';
import { useCopyToClipboard } from '../../hooks/useCopyToClipboard';
import { useExplorerLink } from '../../hooks/useExplorerLink';
import { ExplorerLinkType } from '../explorer-link/ExplorerLinkType';
import { IconButton } from '../IconButton';
import { ExplorerLinkType, IconButton } from '_components';
import { EditableAccountName } from './EditableAccountName';

interface AccountItemProps {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,7 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import { AccountIcon } from '_components/accounts/AccountIcon';
import { LockUnlockButton } from '_components/accounts/LockUnlockButton';
import { useUnlockAccount } from '_components/accounts/UnlockAccountContext';
import { AccountIcon, LockUnlockButton, useUnlockAccount } from '_components';
import { type SerializedUIAccount } from '_src/background/accounts/Account';
import { useResolveIotaNSName } from '@iota/core';
import { CheckFill16 } from '@iota/icons';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,11 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import { AccountItemApproveConnection } from '_components/accounts/AccountItemApproveConnection';
import { AccountItemApproveConnection, SelectAllButton } from '_components';
import { type SerializedUIAccount } from '_src/background/accounts/Account';
import * as ToggleGroup from '@radix-ui/react-toggle-group';
import { useState } from 'react';

import { SelectAllButton } from '_components/accounts/SelectAllButton';

interface AccountMultiSelectProps {
accounts: SerializedUIAccount[];
selectedAccountIDs: string[];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { LockLocked16, LockUnlocked16 } from '@iota/icons';
import { type ComponentPropsWithoutRef } from 'react';

import { Tooltip } from '../../shared/tooltip';
import LoadingIndicator from '../loading/LoadingIndicator';
import { LoadingIndicator } from '_components';

interface LockUnlockButtonProps extends ComponentPropsWithoutRef<'button'> {
isLocked: boolean;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ const formSchema = z
})
.merge(zodSchema);

export type FormValues = z.infer<typeof formSchema>;
type FormValues = z.infer<typeof formSchema>;

interface ProtectAccountFormProps {
submitButtonText: string;
Expand Down
27 changes: 27 additions & 0 deletions apps/wallet/src/ui/app/components/accounts/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
// Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

export * from './AccountBalanceItem';
export * from './AccountIcon';
export * from './AccountItem';
export * from './AccountItemApproveConnection';
export * from './AccountListItem';
export * from './AccountMultiSelect';
export * from './AccountsFormContext';
export * from './AccountsList';
export * from './AutoLockSelector';
export * from './EditableAccountName';
export * from './FooterLink';
export * from './ImportPrivateKeyForm';
export * from './ImportRecoveryPhraseForm';
export * from './ImportSeedForm';
export * from './LockUnlockButton';
export * from './NicknameDialog';
export * from './PasswordInputDialog';
export * from './ProtectAccountForm';
export * from './RecoverAccountsGroup';
export * from './SelectAllButton';
export * from './UnlockAccountButton';
export * from './UnlockAccountContext';
export * from './UnlockAccountModal';
export * from './VerifyPasswordModal';
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
// SPDX-License-Identifier: Apache-2.0

import { Text } from '_app/shared/text';
import { CoinIcon } from '_components/coin-icon';
import { CoinIcon } from '_components';
import { useFormatCoin } from '@iota/core';
import { type ReactNode } from 'react';

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
// SPDX-License-Identifier: Apache-2.0

import { useActiveAddress } from '_app/hooks/useActiveAddress';
import Loading from '_components/loading';
import { Loading } from '_components';
import { useCoinsReFetchingConfig } from '_hooks';
import { useIotaClientQuery } from '@iota/dapp-kit';
import { IOTA_TYPE_ARG } from '@iota/iota-sdk/utils';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
// SPDX-License-Identifier: Apache-2.0

import { Text } from '_app/shared/text';
import Alert from '_src/ui/app/components/alert';
import { Alert } from '_components';
import { useIotaClient } from '@iota/dapp-kit';
import { QrCode, X12 } from '@iota/icons';
import { isValidIotaAddress } from '@iota/iota-sdk/utils';
Expand Down
6 changes: 3 additions & 3 deletions apps/wallet/src/ui/app/components/alert/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import LoadingIndicator from '_components/loading/LoadingIndicator';
import { LoadingIndicator } from '_components/loading/LoadingIndicator';
import { CheckStroke16, Info16 } from '@iota/icons';
import { cva, type VariantProps } from 'class-variance-authority';
import type { ReactNode } from 'react';
Expand Down Expand Up @@ -49,10 +49,10 @@ const MODE_TO_ICON = {
warning: <Info16 className="h-3.5 w-3.5" />,
issue: <Info16 className="h-3.5 w-3.5" />,
success: <CheckStroke16 className="h-3 w-3" />,
loading: <LoadingIndicator color="inherit" />,
loading: <LoadingIndicator color="inherit" />, // Note: Import LoadingIndicator using the exact file path, not just '_components' to avoid module resolution issues.
};

export default function Alert({
export function Alert({
children,
noBorder,
rounded,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import Alert from '_components/alert';
import { Alert } from '_components';
import type { ReactNode } from 'react';
import { ErrorBoundary as ReactErrorBoundary } from 'react-error-boundary';
import type { FallbackProps } from 'react-error-boundary';
Expand Down
6 changes: 4 additions & 2 deletions apps/wallet/src/ui/app/components/explorer-link/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import ExternalLink from '_components/external-link';
import { ExternalLink } from '_components';
import { ArrowUpRight16 } from '@iota/icons';
import { formatAddress } from '@iota/iota-sdk/utils';
import type { ReactNode } from 'react';
Expand All @@ -20,7 +20,7 @@ export type ExplorerLinkProps = ExplorerLinkConfig & {
showIcon?: boolean;
};

function ExplorerLink({
export function ExplorerLink({
track,
children,
className,
Expand Down Expand Up @@ -56,4 +56,6 @@ export function AddressLink({ address }: { address: string }) {
);
}

export * from './ExplorerLinkType';

export default ExplorerLink;
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export interface ExternalLinkProps {
onClick?(): void;
}

function ExternalLink({ href, className, children, title, onClick }: ExternalLinkProps) {
export function ExternalLink({ href, className, children, title, onClick }: ExternalLinkProps) {
return (
<a
href={href}
Expand Down
45 changes: 45 additions & 0 deletions apps/wallet/src/ui/app/components/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
// Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

export * from './DAppInfoCard';
export * from './DAppPermissionsList';
export * from './HideShowDisplayBox';
export * from './IconButton';
export * from './LabelValueItem';
export * from './LabelValuesContainer';
export * from './PageTemplate';
export * from './PasswordInputDialog';
export * from './SectionHeader';
export * from './SummaryCard';
export * from './WalletListSelect';
export * from './accounts';
export * from './active-coins-card';
export * from './active-coins-card/CoinItem';
export * from './address-input';
export * from './alert';
export * from './coin-icon';
export * from './error-boundary';
export * from './explorer-link';
export * from './explorer-link/Explorer';
export * from './explorer-link/ExplorerLinkType';
export * from './external-link';
export * from './iota-apps';
export * from './iota-apps/IotaApp';
export * from './ledger';
export * from './loading';
export * from './loading/LoadingIndicator';
export * from './logo';
export * from './menu';
export * from './navigation';
export * from './network-selector';
export * from './nft-display';
export * from './nft-display/NftImage';
export * from './number-input';
export * from './overlay';
export * from './receipt-card';
export * from './receipt-card/TxnAddress';
export * from './receipt-card/TxnAmount';
export * from './transactions-card';
export * from './transactions-card/NoActivityCard';
export * from './user-approve-container';
export { default as FiltersPortal } from './filters-tags';
2 changes: 1 addition & 1 deletion apps/wallet/src/ui/app/components/iota-apps/Banner.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { ampli } from '_src/shared/analytics/ampli';
import { Feature } from '_src/shared/experimentation/features';
import { useFeature } from '@growthbook/growthbook-react';

import ExternalLink from '../external-link';
import { ExternalLink } from '_components';

export type BannerProps = {
enabled: boolean;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { useEffect, useMemo } from 'react';

import { useBackgroundClient } from '../../hooks/useBackgroundClient';
import { permissionsSelectors } from '../../redux/slices/permissions';
import Loading from '../loading';
import { Loading } from '_components';
import { IotaApp, type DAppEntry } from './IotaApp';
import { IotaAppEmpty } from './IotaAppEmpty';

Expand Down
12 changes: 7 additions & 5 deletions apps/wallet/src/ui/app/components/iota-apps/DisconnectApp.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,13 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import Overlay from '_components/overlay';
import {
Overlay,
DAppInfoCard,
DAppPermissionsList,
SummaryCard,
WalletListSelect,
} from '_components';
import { useAppSelector } from '_hooks';
import { permissionsSelectors } from '_redux/slices/permissions';
import { ampli } from '_src/shared/analytics/ampli';
Expand All @@ -14,10 +20,6 @@ import { toast } from 'react-hot-toast';
import { useBackgroundClient } from '../../hooks/useBackgroundClient';
import { Button } from '../../shared/ButtonUI';
import { Text } from '../../shared/text';
import { DAppInfoCard } from '../DAppInfoCard';
import { DAppPermissionsList } from '../DAppPermissionsList';
import { SummaryCard } from '../SummaryCard';
import { WalletListSelect } from '../WalletListSelect';
import { type DAppEntry } from './IotaApp';

export interface DisconnectAppProps extends Omit<DAppEntry, 'description' | 'tags'> {
Expand Down
2 changes: 1 addition & 1 deletion apps/wallet/src/ui/app/components/iota-apps/IotaApp.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
// SPDX-License-Identifier: Apache-2.0

import { ImageIcon } from '_app/shared/image-icon';
import ExternalLink from '_components/external-link';
import { ExternalLink } from '_components';
import { ampli } from '_src/shared/analytics/ampli';
import { getDAppUrl } from '_src/shared/utils';
import { Text } from '_src/ui/app/shared/text';
Expand Down
2 changes: 1 addition & 1 deletion apps/wallet/src/ui/app/components/iota-apps/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { AppsPageBanner } from './Banner';
import { IotaApp, type DAppEntry } from './IotaApp';
import { IotaAppEmpty } from './IotaAppEmpty';

function AppsPlayGround() {
export function AppsPlayGround() {
const ecosystemApps = useFeature<DAppEntry[]>(Feature.WalletDapps).value;
const { tagName } = useParams();

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
// SPDX-License-Identifier: Apache-2.0

import { ampli } from '_src/shared/analytics/ampli';
import { useIotaLedgerClient } from '_src/ui/app/components/ledger/IotaLedgerClientProvider';
import { useIotaLedgerClient } from '_components';
import { Button } from '_src/ui/app/shared/ButtonUI';
import {
Dialog,
Expand Down
9 changes: 9 additions & 0 deletions apps/wallet/src/ui/app/components/ledger/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
// Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

export * from './ConnectLedgerModal';
export * from './IotaLedgerClientProvider';
export * from './LedgerAccountList';
export * from './LedgerAccountRow';
export * from './ledgerErrors';
export * from './useDeriveLedgerAccounts';
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const styles = cva('', {

export type LoadingIndicatorProps = VariantProps<typeof styles>;

function LoadingIndicator({ color = 'iota' }: LoadingIndicatorProps) {
export function LoadingIndicator({ color = 'iota' }: LoadingIndicatorProps) {
return <Spinner16 className={styles({ className: 'animate-spin', color })} />;
}

Expand Down
2 changes: 1 addition & 1 deletion apps/wallet/src/ui/app/components/loading/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ interface LoadingProps extends LoadingIndicatorProps {
children: ReactNode | ReactNode[];
}

function Loading({ loading, children, ...indicatorProps }: LoadingProps) {
export function Loading({ loading, children, ...indicatorProps }: LoadingProps) {
return loading ? (
<div className="flex h-full items-center justify-center">
<LoadingIndicator {...indicatorProps} />
Expand Down
2 changes: 1 addition & 1 deletion apps/wallet/src/ui/app/components/logo/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ const NETWORK_LOGOS = {
[Network.Custom]: IotaCustomRpc,
};

function Logo({ network }: LogoProps) {
export function Logo({ network }: LogoProps) {
let LogoComponent = NETWORK_LOGOS[Network.Custom];

if (network && NETWORK_LOGOS[network]) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { ButtonOrLink } from '_src/ui/app/shared/utils/ButtonOrLink';
import { HamburgerOpen24 as HamburgerOpenIcon, Settings24 as SettingsIcon } from '@iota/icons';
import { cx } from 'class-variance-authority';

import { useMenuIsOpen, useNextMenuUrl } from '../hooks';
import { useMenuIsOpen, useNextMenuUrl } from '_components';

export function WalletSettingsButton() {
const isOpen = useMenuIsOpen();
Expand Down
2 changes: 1 addition & 1 deletion apps/wallet/src/ui/app/components/menu/button/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import { useMenuIsOpen, useNextMenuUrl } from '_components/menu/hooks';
import { useMenuIsOpen, useNextMenuUrl } from '_components';
import cl from 'clsx';
import { memo } from 'react';
import { Link } from 'react-router-dom';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
// Modifications Copyright (c) 2024 IOTA Stiftung
// SPDX-License-Identifier: Apache-2.0

import { useNextMenuUrl } from '_components/menu/hooks';
import { useNextMenuUrl, Loading, Overlay, AutoLockSelector, zodSchema } from '_components';
import {
autoLockDataToMinutes,
parseAutoLock,
Expand All @@ -15,10 +15,6 @@ import { useZodForm } from '@iota/core';
import toast from 'react-hot-toast';
import { useNavigate } from 'react-router-dom';

import { AutoLockSelector, zodSchema } from '../../accounts/AutoLockSelector';
import Loading from '../../loading';
import Overlay from '../../overlay';

export function AutoLockAccounts() {
const mainMenuUrl = useNextMenuUrl(true, '/');
const navigate = useNavigate();
Expand Down
Loading
Loading