feat(refactor): ui-structure to ui-core, handle multiple exports (#…

…2411)

packages/app/package.json

@@ -56,8 +56,8 @@
     "styles": "workspace:*",
     "types": "workspace:*",
     "ui-buttons": "workspace:*",
+    "ui-core": "workspace:*",
     "ui-overlay": "workspace:*",
-    "ui-structure": "workspace:*",
     "usehooks-ts": "^3.0.2",
     "utils": "workspace:*",
     "viem": "^2.22.1",

packages/app/src/Router.tsx

@@ -30,7 +30,7 @@ import {
   useLocation,
 } from 'react-router-dom'
 import { StakingApi } from 'StakingApi'
-import { Body, Main } from 'ui-structure'
+import { Body, Main } from 'ui-core/base'
 
 const RouterInner = () => {
   const { network } = useNetwork()

packages/app/src/Themes.tsx

@@ -6,7 +6,7 @@ import { useNetwork } from 'contexts/Network'
 import { useTheme } from 'contexts/Themes'
 import { useEffect } from 'react'
 import { ThemeProvider } from 'styled-components'
-import { Entry } from 'ui-structure'
+import { Entry } from 'ui-core/base'
 
 // light / dark `mode` added to styled-components provider
 export const ThemedRouter = () => {

packages/app/src/library/Help/index.tsx

@@ -16,11 +16,7 @@ import { DefaultLocale } from 'locales'
 import { useCallback, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonPrimaryInvert } from 'ui-buttons'
-import {
-  CanvasContainer,
-  CanvasScroll,
-  ModalContent,
-} from 'ui-overlay/structure'
+import { CanvasContainer, CanvasScroll, ModalContent } from 'ui-core/overlay'
 import { ActiveDefinition } from './Items/ActiveDefinition'
 import { Definition } from './Items/Definition'
 import { External } from './Items/External'

packages/app/src/library/MainFooter/index.tsx

@@ -14,7 +14,7 @@ import { usePlugins } from 'contexts/Plugins'
 import { isCustomEvent } from 'controllers/utils'
 import { useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Footer } from 'ui-structure'
+import { Footer } from 'ui-core/base'
 import { useEventListener } from 'usehooks-ts'
 import { Status } from './Status'
 import { TokenPrice } from './TokenPrice'

packages/app/src/library/Modal/Title.tsx

@@ -9,8 +9,8 @@ import { useHelp } from 'contexts/Help'
 import type { FunctionComponent, SVGProps } from 'react'
 import type { CSSProperties } from 'styled-components'
 import { ButtonHelp } from 'ui-buttons'
+import { ModalTitle } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalTitle } from 'ui-overlay/structure'
 import { TitleWrapper } from './Wrappers'
 
 interface TitleProps {

packages/app/src/library/PageWithTitle/index.tsx

@@ -4,7 +4,7 @@
 import type { PageItem } from 'common-types'
 import { Helmet } from 'react-helmet'
 import { useTranslation } from 'react-i18next'
-import { Page } from 'ui-structure'
+import { Page } from 'ui-core/base'
 
 export const PageWithTitle = ({ page }: { page: PageItem }) => {
   const { t } = useTranslation()

packages/app/src/library/SideMenu/index.tsx

@@ -23,8 +23,8 @@ import { useUi } from 'contexts/UI'
 import type { UIContextInterface } from 'contexts/UI/types'
 import { useRef } from 'react'
 import { useTranslation } from 'react-i18next'
+import { Side } from 'ui-core/base'
 import { useOverlay } from 'ui-overlay'
-import { Side } from 'ui-structure'
 import { Heading } from './Heading/Heading'
 import { Main } from './Main'
 import { Secondary } from './Secondary'

packages/app/src/library/StatBoxList/index.tsx

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: GPL-3.0-only
 
 import type { ReactNode } from 'react'
-import { StatBoxRow } from 'ui-structure'
+import { StatBoxRow } from 'ui-core/base'
 import { ListWrapper } from './Wrapper'
 
 export const StatBoxList = ({ children }: { children: ReactNode }) => (

packages/app/src/library/WithdrawPrompt/index.tsx

@@ -15,8 +15,8 @@ import { CardWrapper } from 'library/Card/Wrappers'
 import { useTranslation } from 'react-i18next'
 import type { BondFor } from 'types'
 import { ButtonPrimary } from 'ui-buttons'
+import { ButtonRow, PageRow } from 'ui-core/base'
 import { useOverlay } from 'ui-overlay'
-import { ButtonRow, PageRow } from 'ui-structure'
 import { timeleftAsString } from 'utils'
 
 export const WithdrawPrompt = ({ bondFor }: { bondFor: BondFor }) => {

packages/app/src/overlay/canvas/JoinPool/Header.tsx

@@ -12,8 +12,8 @@ import { determinePoolDisplay } from 'contexts/Pools/util'
 import { CanvasTitleWrapper } from 'overlay/canvas/Wrappers'
 import { useTranslation } from 'react-i18next'
 import { ButtonPrimary, ButtonPrimaryInvert } from 'ui-buttons'
+import { PageTitleTabs } from 'ui-core/base'
 import { useOverlay } from 'ui-overlay'
-import { PageTitleTabs } from 'ui-structure'
 import type { JoinPoolHeaderProps } from './types'
 
 export const Header = ({

packages/app/src/overlay/canvas/PoolMembers/Prompts/UnbondMember.tsx

@@ -20,7 +20,7 @@ import { SubmitTx } from 'library/SubmitTx'
 import { StaticNote } from 'overlay/modals/Utils/StaticNote'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { ModalNotes, ModalPadding, ModalWarnings } from 'ui-overlay/structure'
+import { ModalNotes, ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { planckToUnitBn, timeleftAsString } from 'utils'
 
 export const UnbondMember = ({

packages/app/src/overlay/canvas/PoolMembers/Prompts/WithdrawMember.tsx

@@ -19,7 +19,7 @@ import { SubmitTx } from 'library/SubmitTx'
 import type { RefObject } from 'react'
 import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { ModalNotes, ModalPadding, ModalWarnings } from 'ui-overlay/structure'
+import { ModalNotes, ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { planckToUnitBn } from 'utils'
 
 export const WithdrawMember = ({

packages/app/src/overlay/modals/Accounts/index.tsx

@@ -14,8 +14,8 @@ import { Fragment, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import type { MaybeAddress } from 'types'
 import { ButtonPrimaryInvert, ButtonText } from 'ui-buttons'
+import { ModalCustomHeader, ModalPadding } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalCustomHeader, ModalPadding } from 'ui-overlay/structure'
 import { AccountButton } from './Account'
 import { Delegates } from './Delegates'
 import { AccountSeparator, AccountWrapper } from './Wrappers'

packages/app/src/overlay/modals/BalanceTest/index.tsx

@@ -9,8 +9,8 @@ import { useBatchCall } from 'hooks/useBatchCall'
 import { useSubmitExtrinsic } from 'hooks/useSubmitExtrinsic'
 import { Close } from 'library/Modal/Close'
 import { SubmitTx } from 'library/SubmitTx'
+import { ModalPadding, ModalTitle } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalTitle } from 'ui-overlay/structure'
 
 export const BalanceTest = () => {
   const {

packages/app/src/overlay/modals/Bio/index.tsx

@@ -2,8 +2,8 @@
 // SPDX-License-Identifier: GPL-3.0-only
 
 import { Title } from 'library/Modal/Title'
+import { ModalPadding } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding } from 'ui-overlay/structure'
 import { Wrapper } from './Wrapper'
 
 export const Bio = () => {

packages/app/src/overlay/modals/Bond/index.tsx

@@ -18,8 +18,8 @@ import { Close } from 'library/Modal/Close'
 import { SubmitTx } from 'library/SubmitTx'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
+import { ModalPadding, ModalTitle, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalTitle, ModalWarnings } from 'ui-overlay/structure'
 import { planckToUnitBn } from 'utils'
 
 export const Bond = () => {

packages/app/src/overlay/modals/ChangePoolRoles/index.tsx

@@ -9,8 +9,8 @@ import { useSubmitExtrinsic } from 'hooks/useSubmitExtrinsic'
 import { Close } from 'library/Modal/Close'
 import { SubmitTx } from 'library/SubmitTx'
 import { useTranslation } from 'react-i18next'
+import { ModalPadding, ModalTitle } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalTitle } from 'ui-overlay/structure'
 import { RoleChange } from './RoleChange'
 import { Wrapper } from './Wrapper'
 

packages/app/src/overlay/modals/ChooseLanguage/index.tsx

@@ -5,8 +5,8 @@ import LanguageSVG from 'assets/svg/language.svg?react'
 import { Title } from 'library/Modal/Title'
 import { changeLanguage, locales } from 'locales'
 import { useTranslation } from 'react-i18next'
+import { ModalPadding } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding } from 'ui-overlay/structure'
 import { ContentWrapper, LocaleButton } from './Wrapper'
 
 export const ChooseLanguage = () => {

packages/app/src/overlay/modals/ClaimPayouts/Forms.tsx

@@ -19,8 +19,8 @@ import type { ForwardedRef } from 'react'
 import { forwardRef, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonSubmitInvert } from 'ui-buttons'
+import { ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalWarnings } from 'ui-overlay/structure'
 import type { ActivePayout, FormProps } from './types'
 import { ContentWrapper } from './Wrappers'
 

packages/app/src/overlay/modals/ClaimPayouts/Overview.tsx

@@ -6,7 +6,7 @@ import { usePayouts } from 'contexts/Payouts'
 import type { Ref } from 'react'
 import { Fragment, forwardRef } from 'react'
 import { useTranslation } from 'react-i18next'
-import { ModalNotes, ModalPadding } from 'ui-overlay/structure'
+import { ModalNotes, ModalPadding } from 'ui-core/overlay'
 import { Item } from './Item'
 import type { OverviewProps } from './types'
 import { ContentWrapper } from './Wrappers'

packages/app/src/overlay/modals/ClaimPayouts/index.tsx

@@ -6,13 +6,13 @@ import { usePayouts } from 'contexts/Payouts'
 import { Title } from 'library/Modal/Title'
 import { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useOverlay } from 'ui-overlay'
 import {
   ModalFixedTitle,
   ModalMulti,
   ModalMultiTwo,
   ModalSection,
-} from 'ui-overlay/structure'
+} from 'ui-core/overlay'
+import { useOverlay } from 'ui-overlay'
 import { Forms } from './Forms'
 import { Overview } from './Overview'
 import type { ActivePayout } from './types'

packages/app/src/overlay/modals/ClaimReward/index.tsx

@@ -15,8 +15,8 @@ import { Close } from 'library/Modal/Close'
 import { SubmitTx } from 'library/SubmitTx'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
+import { ModalPadding, ModalTitle, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalTitle, ModalWarnings } from 'ui-overlay/structure'
 
 export const ClaimReward = () => {
   const { t } = useTranslation('modals')

packages/app/src/overlay/modals/Connect/index.tsx

@@ -13,15 +13,15 @@ import { SelectItems } from 'library/SelectItems'
 import { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonPrimaryInvert, ButtonTab } from 'ui-buttons'
-import { useOverlay } from 'ui-overlay'
 import {
   ModalCustomHeader,
   ModalFixedTitle,
   ModalMulti,
   ModalMultiThree,
   ModalPadding,
   ModalSection,
-} from 'ui-overlay/structure'
+} from 'ui-core/overlay'
+import { useOverlay } from 'ui-overlay'
 import { Extension } from './Extension'
 import { Ledger } from './Ledger'
 import { Proxies } from './Proxies'

packages/app/src/overlay/modals/DiscordSupport/index.tsx

@@ -7,7 +7,7 @@ import DiscordOutlineSvg from 'assets/svg/discordOutline.svg?react'
 import { DiscordSupportUrl } from 'consts'
 import { Title } from 'library/Modal/Title'
 import { useTranslation } from 'react-i18next'
-import { ModalPadding } from 'ui-overlay/structure'
+import { ModalPadding } from 'ui-core/overlay'
 import { SupportWrapper } from './Wrapper'
 
 export const DiscordSupport = () => {

packages/app/src/overlay/modals/DismissTips/index.tsx

@@ -5,9 +5,9 @@ import { usePlugins } from 'contexts/Plugins'
 import { Title } from 'library/Modal/Title'
 import { useTranslation } from 'react-i18next'
 import { ButtonSubmit } from 'ui-buttons'
+import { ButtonRow } from 'ui-core/base'
+import { ModalPadding } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding } from 'ui-overlay/structure'
-import { ButtonRow } from 'ui-structure'
 
 export const DismissTips = () => {
   const { t } = useTranslation('tips')

packages/app/src/overlay/modals/LeavePool/index.tsx

@@ -21,8 +21,8 @@ import { StaticNote } from 'overlay/modals/Utils/StaticNote'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonSubmitInvert } from 'ui-buttons'
+import { ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalWarnings } from 'ui-overlay/structure'
 import { planckToUnitBn, timeleftAsString } from 'utils'
 
 export const LeavePool = ({

packages/app/src/overlay/modals/MailSupport/index.tsx

@@ -5,7 +5,7 @@ import MailSVG from 'assets/svg/mail.svg?react'
 import { MailSupportAddress } from 'consts'
 import { Title } from 'library/Modal/Title'
 import { useTranslation } from 'react-i18next'
-import { ModalPadding } from 'ui-overlay/structure'
+import { ModalPadding } from 'ui-core/overlay'
 import { SupportWrapper } from './Wrapper'
 
 export const MailSupport = () => {

packages/app/src/overlay/modals/ManageFastUnstake/index.tsx

@@ -20,13 +20,13 @@ import { Close } from 'library/Modal/Close'
 import { SubmitTx } from 'library/SubmitTx'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useOverlay } from 'ui-overlay'
 import {
   ModalNotes,
   ModalPadding,
   ModalTitle,
   ModalWarnings,
-} from 'ui-overlay/structure'
+} from 'ui-core/overlay'
+import { useOverlay } from 'ui-overlay'
 import { planckToUnitBn } from 'utils'
 
 export const ManageFastUnstake = () => {

packages/app/src/overlay/modals/ManagePool/Forms/ClaimCommission/index.tsx

@@ -17,8 +17,8 @@ import type { Dispatch, SetStateAction } from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonSubmitInvert } from 'ui-buttons'
+import { ModalNotes, ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalNotes, ModalPadding, ModalWarnings } from 'ui-overlay/structure'
 import { planckToUnitBn } from 'utils'
 
 export const ClaimCommission = ({

packages/app/src/overlay/modals/ManagePool/Forms/ManageCommission/index.tsx

@@ -21,8 +21,8 @@ import 'rc-slider/assets/index.css'
 import { useEffect, useState, type Dispatch, type SetStateAction } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonHelp, ButtonSubmitInvert } from 'ui-buttons'
+import { ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalWarnings } from 'ui-overlay/structure'
 import { ChangeRate } from './ChangeRate'
 import { CommissionCurrent } from './CommissionCurrent'
 import { MaxCommission } from './MaxCommission'

packages/app/src/overlay/modals/ManagePool/Forms/RenamePool/index.tsx

@@ -17,8 +17,8 @@ import type { Dispatch, FormEvent, SetStateAction } from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonSubmitInvert } from 'ui-buttons'
+import { ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalWarnings } from 'ui-overlay/structure'
 
 export const RenamePool = ({
   setSection,

packages/app/src/overlay/modals/ManagePool/Forms/SetClaimPermission/index.tsx

@@ -18,8 +18,8 @@ import type { Dispatch, SetStateAction } from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonSubmitInvert } from 'ui-buttons'
+import { ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalWarnings } from 'ui-overlay/structure'
 
 export const SetClaimPermission = ({
   setSection,

packages/app/src/overlay/modals/ManagePool/Forms/SetPoolState/index.tsx

@@ -16,8 +16,8 @@ import type { Dispatch, SetStateAction } from 'react'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { ButtonSubmitInvert } from 'ui-buttons'
+import { ModalPadding, ModalWarnings } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding, ModalWarnings } from 'ui-overlay/structure'
 
 export const SetPoolState = ({
   setSection,

packages/app/src/overlay/modals/ManagePool/index.tsx

@@ -6,14 +6,14 @@ import { useActivePool } from 'contexts/Pools/ActivePool'
 import { Title } from 'library/Modal/Title'
 import { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useOverlay } from 'ui-overlay'
 import {
   ModalFixedTitle,
   ModalMulti,
   ModalMultiTwo,
   ModalPadding,
   ModalSection,
-} from 'ui-overlay/structure'
+} from 'ui-core/overlay'
+import { useOverlay } from 'ui-overlay'
 import { Forms } from './Forms'
 import { Tasks } from './Tasks'
 

packages/app/src/overlay/modals/Networks/index.tsx

@@ -15,8 +15,8 @@ import { Title } from 'library/Modal/Title'
 import { useEffect } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import { ButtonTertiary } from 'ui-buttons'
+import { ModalPadding } from 'ui-core/overlay'
 import { useOverlay } from 'ui-overlay'
-import { ModalPadding } from 'ui-overlay/structure'
 import { ProvidersPrompt } from './ProvidersPrompt'
 import {
   BraveWarning,

packages/app/src/overlay/modals/Settings/index.tsx

@@ -5,7 +5,7 @@ import { usePlugins } from 'contexts/Plugins'
 import { Title } from 'library/Modal/Title'
 import { StatusButton } from 'library/StatusButton'
 import { useTranslation } from 'react-i18next'
-import { ModalPadding } from 'ui-overlay/structure'
+import { ModalPadding } from 'ui-core/overlay'
 import { ContentWrapper } from '../Networks/Wrapper'
 
 export const Settings = () => {