diff --git a/src/views/submit/submit.module.css b/src/views/submit/submit.module.css index 99c9fa3a..34b7fc42 100644 --- a/src/views/submit/submit.module.css +++ b/src/views/submit/submit.module.css @@ -22,7 +22,7 @@ h1 { width: 520px } -.field { +.box { display: block; position: relative; width: 500px; @@ -39,18 +39,18 @@ h1 { font-size: smaller; } -.fieldTitleRequired::before { +.boxTitleRequired::before { content: "*"; color: red; } -.fieldContent { +.boxContent { margin-top: 5px; border: none; position: relative; } -.fieldSubtitle { +.boxSubtitle { font-size: smaller; } @@ -104,7 +104,7 @@ h1 { width: 100%; } - .field { + .box { width: 100%; box-sizing: border-box; } @@ -134,4 +134,15 @@ h1 { color: #369; font-size: 13px; cursor: pointer; +} + +.rulesTitle { + color: var(--text-primary);; + font-size: 16px; + font-weight: bold; +} + +.rules { + font-size: 13px; + margin-left: 20px; } \ No newline at end of file diff --git a/src/views/submit/submit.tsx b/src/views/submit/submit.tsx index 4e094db0..ad7da2a7 100644 --- a/src/views/submit/submit.tsx +++ b/src/views/submit/submit.tsx @@ -1,9 +1,8 @@ -import { useEffect, useRef, useState } from 'react'; -import { Link, useLocation, useNavigate, useParams } from 'react-router-dom'; +import { ChangeEvent, useEffect, useRef, useState } from 'react'; +import { Link, useNavigate, useParams } from 'react-router-dom'; import { PublishCommentOptions, useAccount, usePublishComment, useSubplebbit } from '@plebbit/plebbit-react-hooks'; import { useTranslation } from 'react-i18next'; import { create } from 'zustand'; -import { isSubplebbitSubmitView } from '../../lib/utils/view-utils'; import { alertChallengeVerificationFailed } from '../../lib/utils/challenge-utils'; import { isValidENS, isValidIPFS, isValidURL } from '../../lib/utils/validation-utils'; import styles from './submit.module.css'; @@ -57,11 +56,11 @@ const useSubmitStore = create((set) => ({ const Submit = () => { const account = useAccount(); const { t } = useTranslation(); - const location = useLocation(); const params = useParams(); - const isSubplebbitSubmit = isSubplebbitSubmitView(location.pathname, params); const paramsSubplebbitAddress = params.subplebbitAddress; - const subplebbit = useSubplebbit({ subplebbitAddress: paramsSubplebbitAddress }); + const [inputAddress, setInputAddress] = useState(''); + const [selectedSubplebbit, setSelectedSubplebbit] = useState(paramsSubplebbitAddress); + const subplebbit = useSubplebbit({ subplebbitAddress: selectedSubplebbit }); const navigate = useNavigate(); const [readyToPublish, setReadyToPublish] = useState(false); @@ -75,8 +74,8 @@ const Submit = () => { const { subscriptions } = account || {}; useEffect(() => { - document.title = t('submit_to_before') + (isSubplebbitSubmit ? subplebbit?.title || subplebbit?.shortAddress : 'seedit') + t('submit_to_after'); - }, [isSubplebbitSubmit, subplebbit, t]); + document.title = t('submit_to_before') + (selectedSubplebbit ? subplebbit?.title || subplebbit?.shortAddress : 'seedit') + t('submit_to_after'); + }, [selectedSubplebbit, subplebbit, t]); const onPublish = () => { if (!titleRef.current?.value) { @@ -147,52 +146,81 @@ const Submit = () => { ) + const handleAddressChange = (e: ChangeEvent) => { + setInputAddress(e.target.value); + } + + useEffect(() => { + if (inputAddress) { + if (isValidENS(inputAddress) || isValidIPFS(inputAddress)) { + setSelectedSubplebbit(inputAddress); + } + } + }, [inputAddress]); + return (

{t('submit_to_before')} - {isSubplebbitSubmit ? subplebbitHeaderLink : 'seedit'} + {selectedSubplebbit ? subplebbitHeaderLink : 'seedit'} {t('submit_to_after')}

-
- url +
+ url ({t('optional')}) -
+
{t('submit_url_description')}
-
- {t('title')} -
+
+ {t('title')} +