diff --git a/src/components/pages/Publish/PublishType.tsx b/src/components/pages/Publish/PublishType.tsx index 884c99c5f..0bb8370d8 100644 --- a/src/components/pages/Publish/PublishType.tsx +++ b/src/components/pages/Publish/PublishType.tsx @@ -5,12 +5,13 @@ import Button from '../../atoms/Button' const cx = classNames.bind(styles) -const publishTypes = [ - { display: 'data', value: 'data' }, - { display: 'algorithms', value: 'algorithms' } -] +export const TypeOfPublish = { + dataset: 'dataset', + algorithm: 'algorithm' +} as const +type TypeOfPublish = typeof TypeOfPublish[keyof typeof TypeOfPublish] -export default function PublishType({ +export function PublishType({ type, setType }: { @@ -18,14 +19,14 @@ export default function PublishType({ setType: React.Dispatch> }): ReactElement { useEffect(() => { - setType(publishTypes[0].value) + setType(TypeOfPublish.dataset) }, []) return (
- {publishTypes.map((e, index) => { + {Object.keys(TypeOfPublish).map((key, index) => { const tabElement = cx({ - [styles.selected]: e.value === type, + [styles.selected]: key === type, [styles.tabElement]: true }) return ( @@ -35,10 +36,10 @@ export default function PublishType({ key={index} className={tabElement} onClick={async () => { - setType(e.value) + setType(key) }} > - {e.display} + {key} ) })} diff --git a/src/components/pages/Publish/index.tsx b/src/components/pages/Publish/index.tsx index b78f9fc84..dd65b1531 100644 --- a/src/components/pages/Publish/index.tsx +++ b/src/components/pages/Publish/index.tsx @@ -4,7 +4,7 @@ import { usePublish, useOcean } from '@oceanprotocol/react' import styles from './index.module.css' import FormPublish from './FormPublish' import FormAlgoPublish from './FormAlgoPublish' -import PublishType from './PublishType' +import { PublishType, TypeOfPublish } from './PublishType' import Web3Feedback from '../../molecules/Wallet/Feedback' import { FormContent } from '../../../@types/Form' import { initialValues, validationSchema } from '../../../models/FormPublish' @@ -55,7 +55,7 @@ export default function PublishPage({ const hasFeedback = isLoading || error || success useEffect(() => { - publishType === 'data' + publishType === TypeOfPublish.dataset ? setTitle('Publishing Data Set') : setTitle('Publishing Algorithm') }, [publishType]) @@ -136,17 +136,21 @@ export default function PublishPage({ return isInPurgatory && purgatoryData ? null : ( { // move user's focus to top of screen window.scrollTo({ top: 0, left: 0, behavior: 'smooth' }) // kick off publishing - publishType === 'data' + publishType === TypeOfPublish.dataset ? await handleSubmit(values, resetForm) : await handleAlgorithmSubmit(values, resetForm) }} @@ -176,7 +180,7 @@ export default function PublishPage({ className={styles.alert} />
- {publishType === 'data' ? ( + {publishType === TypeOfPublish.dataset ? ( ) : ( @@ -184,7 +188,7 @@ export default function PublishPage({