Skip to content

Commit 3690601

Browse files
kaja-osojnikkaja-osojnik
committed
Convert MUI links to Tailwind
1 parent ced3a04 commit 3690601

File tree

19 files changed

+124
-125
lines changed

19 files changed

+124
-125
lines changed

‎src/app/components/Account/ConsensusAccountDetailsView.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { AccountSizeBadge } from '../AccountSizeBadge'
1212
import { ConsensusAccountLink } from './ConsensusAccountLink'
1313
import { CopyToClipboard } from '../CopyToClipboard'
1414
import { Link as RouterLink } from 'react-router-dom'
15-
import Link from '@mui/material/Link'
15+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
1616
import { RouteUtils } from '../../utils/route-utils'
1717
import { transactionsContainerId } from '../../utils/tabAnchors'
1818
import { RoundedBalance } from '../RoundedBalance'
@@ -105,8 +105,8 @@ export const ConsensusAccountDetailsView: FC<ConsensusAccountDetailsViewProps> =
105105
<dt>{t('common.transactions')}</dt>
106106
<dd>
107107
{account.stats.num_txns ? (
108-
<Link component={RouterLink} to={transactionsAnchor!}>
109-
{transactionsLabel}
108+
<Link asChild className="font-medium">
109+
<RouterLink to={transactionsAnchor!}>{transactionsLabel}</RouterLink>
110110
</Link>
111111
) : (
112112
transactionsLabel

‎src/app/components/Account/RuntimeAccountDetailsView.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { EvmToken, type RuntimeAccount } from '../../../oasis-nexus/api'
88
import { TokenPills } from './TokenPills'
99
import { AccountLink } from './AccountLink'
1010
import { RouteUtils } from '../../utils/route-utils'
11-
import Link from '@mui/material/Link'
11+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
1212
import { DashboardLink } from '../../pages/ParatimeDashboardPage/DashboardLink'
1313
import { AllTokenPrices } from '../../../coin-gecko/api'
1414
import { ContractCreatorInfo } from './ContractCreatorInfo'
@@ -150,8 +150,8 @@ export const RuntimeAccountDetailsView: FC<RuntimeAccountDetailsViewProps> = ({
150150
<dt>{t('common.transactions')}</dt>
151151
<dd>
152152
{account.stats.num_txns ? (
153-
<Link component={RouterLink} to={transactionsAnchor!}>
154-
{transactionsLabel}
153+
<Link asChild className="font-medium">
154+
<RouterLink to={transactionsAnchor!}>{transactionsLabel}</RouterLink>
155155
</Link>
156156
) : (
157157
transactionsLabel

‎src/app/components/AnalyticsConsent/AnalyticsIsBlocked.tsx‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { styled } from '@mui/material/styles'
22
import Button from '@mui/material/Button'
3-
import Link from '@mui/material/Link'
3+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
44
import { Trans, useTranslation } from 'react-i18next'
55
import { AnalyticsDialogLayout } from './AnalyticsDialogLayout'
66

@@ -20,11 +20,7 @@ export const AnalyticsIsBlocked = (props: { isOpen: boolean; onReload: () => voi
2020
t={t}
2121
components={{
2222
PrivacyPolicyLink: (
23-
<Link
24-
href={import.meta.env.REACT_APP_PRIVACY_POLICY}
25-
target="_blank"
26-
sx={{ fontWeight: 400, textDecoration: 'underline' }}
27-
/>
23+
<Link href={import.meta.env.REACT_APP_PRIVACY_POLICY} target="_blank" className="underline" />
2824
),
2925
}}
3026
/>

‎src/app/components/CoinGeckoReferral/index.tsx‎

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,12 @@
11
import { FC } from 'react'
22
import { Trans, useTranslation } from 'react-i18next'
3-
import Typography from '@mui/material/Typography'
4-
import Link from '@mui/material/Link'
3+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
54
import { referrals } from '../../utils/externalLinks'
6-
import { COLORS } from '../../../styles/theme/colors'
7-
85
export const CoinGeckoReferral: FC = () => {
96
const { t } = useTranslation()
107

118
return (
12-
<Typography component="span" sx={{ fontSize: '12px', color: COLORS.brandExtraDark }}>
9+
<span className="text-xs">
1310
<Trans
1411
i18nKey="coinGeckoReferral"
1512
t={t}
@@ -19,11 +16,11 @@ export const CoinGeckoReferral: FC = () => {
1916
href={referrals.coinGecko}
2017
rel="noopener noreferrer"
2118
target="_blank"
22-
sx={{ fontWeight: 400, color: 'inherit', textDecoration: 'underline' }}
19+
className="underline text-inherit"
2320
/>
2421
),
2522
}}
2623
/>
27-
</Typography>
24+
</span>
2825
)
2926
}

‎src/app/components/ContractVerificationIcon/AbiPlaygroundLink.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { FC } from 'react'
22
import { Trans, useTranslation } from 'react-i18next'
3-
import Link from '@mui/material/Link'
3+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
44
import { Layer } from '../../../oasis-nexus/api'
55
import { SearchScope } from '../../../types/searchScope'
66
import { Network } from '../../../types/network'
@@ -42,7 +42,7 @@ export const AbiPlaygroundLink: FC<{
4242
t={t}
4343
i18nKey={'contract.verification.openInAbiPlayground'}
4444
components={{
45-
AbiPlaygroundLink: <Link {...abiPlaygroundLinkProps} />,
45+
AbiPlaygroundLink: <Link className="text-inherit" {...abiPlaygroundLinkProps} />,
4646
}}
4747
/>
4848
</div>

‎src/app/components/ContractVerificationIcon/index.tsx‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
import { FC, useState } from 'react'
22
import { Trans, useTranslation } from 'react-i18next'
3-
import { COLORS } from '../../../styles/theme/colors'
4-
import Link from '@mui/material/Link'
5-
import Typography from '@mui/material/Typography'
3+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
64
import { SearchScope } from '../../../types/searchScope'
75
import * as externalLinks from '../../utils/externalLinks'
86
import { isLocalnet } from '../../utils/route-utils'
@@ -45,29 +43,29 @@ export const VerificationIcon: FC<{
4543
</Link>
4644
{!hideLink &&
4745
(verificationLevel ? (
48-
<Typography component="span" sx={{ fontSize: '12px', color: COLORS.brandExtraDark }}>
46+
<span className="text-xs">
4947
&nbsp; &nbsp;
5048
<Trans
5149
t={t}
5250
i18nKey={'contract.verification.openInSourcify'}
5351
components={{
54-
SourcifyLink: <Link {...sourcifyLinkProps} />,
52+
SourcifyLink: <Link className="text-inherit underline" {...sourcifyLinkProps} />,
5553
}}
5654
/>
5755
<AbiPlaygroundLink address_eth={address_eth} scope={scope} />
58-
</Typography>
56+
</span>
5957
) : (
60-
<Typography component="span" sx={{ fontSize: '12px', color: COLORS.brandExtraDark }}>
58+
<span className="text-xs">
6159
&nbsp; &nbsp;
6260
<Trans
6361
t={t}
6462
i18nKey={'contract.verification.verifyInSourcify'}
6563
components={{
66-
SourcifyLink: <Link {...sourcifyLinkProps} />,
64+
SourcifyLink: <Link className="text-inherit underline" {...sourcifyLinkProps} />,
6765
}}
6866
/>{' '}
6967
{explainDelay && t('contract.verification.explainVerificationDelay')}
70-
</Typography>
68+
</span>
7169
))}
7270
</>
7371
)

‎src/app/components/LoadMoreButton/index.tsx‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Link as RouterLink } from 'react-router-dom'
2-
import Link from '@mui/material/Link'
2+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
33
import { styled } from '@mui/material/styles'
44
import Button from '@mui/material/Button'
55
import { COLORS } from '../../../styles/theme/colors'
@@ -20,14 +20,12 @@ export const LoadMoreButton: FC<LoadMoreButtonProps> = ({ isLoading, pagination
2020
const { t } = useTranslation()
2121

2222
return (
23-
<Link
24-
component={RouterLink}
25-
to={pagination.linkToPage(pagination.selectedPage + 1)}
26-
preventScrollReset={true}
27-
>
28-
<StyledLoadMoreButton color="primary" variant="contained" disabled={isLoading}>
29-
{t('common.loadMore')}
30-
</StyledLoadMoreButton>
23+
<Link asChild>
24+
<RouterLink to={pagination.linkToPage(pagination.selectedPage + 1)} preventScrollReset={true}>
25+
<StyledLoadMoreButton color="primary" variant="contained" disabled={isLoading}>
26+
{t('common.loadMore')}
27+
</StyledLoadMoreButton>
28+
</RouterLink>
3129
</Link>
3230
)
3331
}

‎src/app/components/Proposals/ProposalLink.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { FC } from 'react'
22
import { Link as RouterLink } from 'react-router-dom'
3-
import Link from '@mui/material/Link'
3+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
44
import { RouteUtils } from '../../utils/route-utils'
55
import { Network } from '../../../types/network'
66

@@ -11,8 +11,8 @@ export const ProposalLink: FC<{
1111
}> = ({ network, proposalId, label = proposalId }) => {
1212
const to = RouteUtils.getProposalRoute(network, proposalId)
1313
return (
14-
<Link component={RouterLink} to={to}>
15-
{label}
14+
<Link asChild className="font-medium">
15+
<RouterLink to={to}>{label}</RouterLink>
1616
</Link>
1717
)
1818
}

‎src/app/components/Table/GoToFirstPageLink.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { FC } from 'react'
22
import { useTranslation } from 'react-i18next'
33
import { useSearchParams, useHref } from 'react-router-dom'
4-
import Link from '@mui/material/Link'
4+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
55

66
/**
77
* Link to attempt to jump to the first page (in pagination)
@@ -37,7 +37,7 @@ export const GoToFirstPageLink: FC = () => {
3737
// Apparently the solution is to umount and rerender the component outside the error boundary.
3838
// But that's hard to do selectively, so it's easier to just do a full refresh.
3939
return wantedParamName ? (
40-
<Link href={href} sx={{ cursor: 'pointer' }}>
40+
<Link href={href} className="text-inherit underline hover:text-inherit">
4141
{label}
4242
</Link>
4343
) : (

‎src/app/components/Tokens/TokenLink.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { FC } from 'react'
22
import { Link as RouterLink } from 'react-router-dom'
3-
import Link from '@mui/material/Link'
3+
import { Link } from '@oasisprotocol/ui-library/src/components/link'
44

55
import { RouteUtils } from '../../utils/route-utils'
66
import { SearchScope } from '../../../types/searchScope'
@@ -12,8 +12,10 @@ export const TokenLink: FC<{
1212
name: string | undefined
1313
}> = ({ scope, address, name }) => {
1414
return (
15-
<Link component={RouterLink} to={RouteUtils.getTokenRoute(scope, address)}>
16-
{name ? <HighlightedText text={name} /> : address}
15+
<Link asChild className="font-medium">
16+
<RouterLink to={RouteUtils.getTokenRoute(scope, address)}>
17+
{name ? <HighlightedText text={name} /> : address}
18+
</RouterLink>
1719
</Link>
1820
)
1921
}

0 commit comments

Comments
 (0)