chore(shared): Consolidate tab components
This commit is contained in:
parent
44a3b194cc
commit
c98a67885c
6 changed files with 50 additions and 43 deletions
|
@ -1,6 +1,6 @@
|
|||
import Markdown from 'react-markdown'
|
||||
import { formatMm } from 'shared/utils.mjs'
|
||||
import { Tab, Tabs } from '../mdx/tabs.mjs'
|
||||
import { Tab, Tabs } from '../tabs.mjs'
|
||||
|
||||
export const Error = ({ err }) => {
|
||||
// Include the error name and message info if it isn't already at the top
|
||||
|
|
|
@ -7,7 +7,7 @@ import { useTranslation } from 'next-i18next'
|
|||
import { useLoadingStatus } from 'shared/hooks/use-loading-status.mjs'
|
||||
// Components
|
||||
import { SetPicker, ns as setsNs } from 'shared/components/account/sets.mjs'
|
||||
import { Tabs, Tab } from 'shared/components/mdx/tabs.mjs'
|
||||
import { Tabs, Tab } from 'shared/components/tabs.mjs'
|
||||
import { MeasiesEditor } from './editor.mjs'
|
||||
import { Popout } from 'shared/components/popout/index.mjs'
|
||||
|
||||
|
@ -33,22 +33,24 @@ export const MeasiesView = ({ design, Design, settings, update, missingMeasureme
|
|||
return (
|
||||
<div className="max-w-7xl mx-auto my-6">
|
||||
<LoadingStatus />
|
||||
<h1 className="m-auto text-center">{t('account:measurements')}</h1>
|
||||
{missingMeasurements ? (
|
||||
<Popout note dense noP>
|
||||
<h5>{t('weLackSomeMeasies', { nr: missingMeasurements.length })}</h5>
|
||||
<ol className="list list-inside ml-4 list-decimal">
|
||||
{missingMeasurements.map((m, i) => (
|
||||
<li key={i}>{t(`measurements:${m}`)}</li>
|
||||
))}
|
||||
</ol>
|
||||
<p className="text-lg">{t('youCanPickOrEnter')}</p>
|
||||
</Popout>
|
||||
) : (
|
||||
<Popout note compact ense oP>
|
||||
<span className="text-lg">{t('measiesOk')}</span>
|
||||
</Popout>
|
||||
)}
|
||||
<div className="max-w-xl m-auto">
|
||||
<h2>{t('account:measurements')}</h2>
|
||||
{missingMeasurements ? (
|
||||
<Popout note dense noP>
|
||||
<h5>{t('weLackSomeMeasies', { nr: missingMeasurements.length })}</h5>
|
||||
<ol className="list list-inside ml-4 list-decimal">
|
||||
{missingMeasurements.map((m, i) => (
|
||||
<li key={i}>{t(`measurements:${m}`)}</li>
|
||||
))}
|
||||
</ol>
|
||||
<p className="text-lg">{t('youCanPickOrEnter')}</p>
|
||||
</Popout>
|
||||
) : (
|
||||
<Popout note compact ense oP>
|
||||
<span className="text-lg">{t('measiesOk')}</span>
|
||||
</Popout>
|
||||
)}
|
||||
</div>
|
||||
<Tabs tabs={tabs}>
|
||||
<Tab key="choose">
|
||||
<SetPicker design={design} clickHandler={loadMeasurements} />
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue