import React from 'react'
import { Link } from '@freesewing/react/components/Link'
import {
SettingsIcon,
ControlIcon,
NewsletterIcon,
UnitsIcon,
CompareIcon,
DocsIcon,
UserIcon,
ShowcaseIcon,
} from '@freesewing/react/components/Icon'
/*
* A component to display a row of data
*/
export const DisplayRow = ({ title, children, keyWidth = 'tw:w-24' }) => (
)
export const welcomeSteps = {
1: [''],
2: ['', 'newsletter', 'units'],
3: ['', 'newsletter', 'units', 'compare', 'username'],
4: ['', 'newsletter', 'units', 'compare', 'username', 'bio', 'img'],
5: [''],
}
export const WelcomeDoneIcon = ({ href }) => (
)
export const WelcomeTodoIcon = ({ href }) => (
)
const WelcomeTopicIcon = (props) => {
const Icon =
props.href === '' || props.href === 'control'
? ControlIcon
: icons[props.href]
? icons[props.href]
: SettingsIcon
return
}
const WelcomeDoingIcon = ({ href }) => (
)
export const WelcomeIcons = ({ done = [], todo = [], current = '' }) => (
{done.map((href) => (
))}
{todo.map((href) => (
))}
)
const icons = {
newsletter: NewsletterIcon,
units: UnitsIcon,
compare: CompareIcon,
username: UserIcon,
bio: DocsIcon,
img: ShowcaseIcon,
}