-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge remote-tracking branch 'origin/develop' into PE-7068-reassign-name
- Loading branch information
Showing
21 changed files
with
824 additions
and
135 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
import { XIcon } from 'lucide-react'; | ||
import { ReactNode } from 'react'; | ||
|
||
export function Pill({ | ||
children = <></>, | ||
className, | ||
closeIcon = ( | ||
<XIcon | ||
className="bg-error rounded-full text-black" | ||
height={'0.75rem'} | ||
width={'0.75rem'} | ||
/> | ||
), | ||
closeButtonClass, | ||
onClose, | ||
}: { | ||
children: ReactNode; | ||
className?: string; | ||
closeIcon?: ReactNode; | ||
closeButtonClass?: string; | ||
onClose?: () => void; | ||
}) { | ||
return ( | ||
<div | ||
className={ | ||
(className ?? '') + | ||
` flex flex-row rounded-full bg-grey-gradient py-[0.125rem] items-center justify-center px-[0.625rem] max-w-fit h-fit shadow backdrop-blur-[0.199375rem]` | ||
} | ||
style={{ gap: '0rem' }} | ||
> | ||
{children} | ||
{onClose && ( | ||
<button | ||
onClick={onClose} | ||
className={ | ||
(closeButtonClass ?? '') + | ||
` flex flex-row w-fit h-fit pl-[0.425rem]` | ||
} | ||
> | ||
{closeIcon} | ||
</button> | ||
)} | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,119 @@ | ||
import ValidationInput from '@src/components/inputs/text/ValidationInput/ValidationInput'; | ||
import ConfirmTransactionModal from '@src/components/modals/ConfirmTransactionModal/ConfirmTransactionModal'; | ||
import { useGlobalState } from '@src/state/contexts/GlobalState'; | ||
import { | ||
ANT_INTERACTION_TYPES, | ||
ContractInteraction, | ||
VALIDATION_INPUT_TYPES, | ||
} from '@src/types'; | ||
import eventEmitter from '@src/utils/events'; | ||
import { Skeleton } from 'antd'; | ||
import { useEffect, useState } from 'react'; | ||
|
||
import DomainSettingsRow from './DomainSettingsRow'; | ||
|
||
export default function DescriptionRow({ | ||
description, | ||
confirm, | ||
editable = false, | ||
}: { | ||
description?: string; | ||
confirm: (logo: string) => Promise<ContractInteraction>; | ||
editable?: boolean; | ||
}) { | ||
const [editing, setEditing] = useState<boolean>(false); | ||
const [newDescription, setNewDescription] = useState<string>( | ||
description ?? '', | ||
); | ||
const [{ arweaveDataProvider }] = useGlobalState(); | ||
const [showModal, setShowModal] = useState<boolean>(false); | ||
|
||
useEffect(() => { | ||
setNewDescription(description ?? ''); | ||
}, [description]); | ||
|
||
async function handleSave(transactionId: string) { | ||
try { | ||
await confirm(transactionId); | ||
} catch (error) { | ||
eventEmitter.emit('error', error); | ||
} finally { | ||
setEditing(false); | ||
setNewDescription(description ?? ''); | ||
setShowModal(false); | ||
} | ||
} | ||
return ( | ||
<> | ||
<DomainSettingsRow | ||
label="Description:" | ||
editable={editable} | ||
value={ | ||
typeof description == 'string' ? ( | ||
!editing ? ( | ||
description | ||
) : ( | ||
<ValidationInput | ||
showValidationIcon={false} | ||
onPressEnter={() => setShowModal(true)} | ||
inputClassName={'domain-settings-input'} | ||
inputCustomStyle={ | ||
editing | ||
? { | ||
background: 'var(--card-bg)', | ||
borderRadius: 'var(--corner-radius)', | ||
border: '1px solid var(--text-faded)', | ||
padding: '3px', | ||
} | ||
: { | ||
border: 'none', | ||
background: 'transparent', | ||
} | ||
} | ||
disabled={!editing} | ||
placeholder={editing ? `Enter a Description` : description} | ||
value={newDescription} | ||
setValue={(e) => setNewDescription(e)} | ||
validationPredicates={{ | ||
[VALIDATION_INPUT_TYPES.ARWEAVE_ID]: { | ||
fn: (id: string) => | ||
arweaveDataProvider.validateArweaveId(id), | ||
}, | ||
}} | ||
maxCharLength={(str) => str.length <= 512} | ||
/> | ||
) | ||
) : ( | ||
<Skeleton.Input active /> | ||
) | ||
} | ||
editing={editing} | ||
setEditing={() => setEditing(true)} | ||
onSave={() => setShowModal(true)} | ||
onCancel={() => { | ||
setEditing(false); | ||
setNewDescription(description ?? ''); | ||
}} | ||
/> | ||
{showModal && ( | ||
<ConfirmTransactionModal | ||
cancel={() => setShowModal(false)} | ||
confirm={() => handleSave(newDescription)} | ||
interactionType={ANT_INTERACTION_TYPES.SET_DESCRIPTION} | ||
content={ | ||
<> | ||
<span className="max-w-[32rem]"> | ||
By completing this action, you are going to change the | ||
Description of this token to <br /> | ||
<span className="text-color-warning break-all max-w-[32rem]"> | ||
{`"${newDescription}"`}. | ||
</span> | ||
</span> | ||
<span>Are you sure you want to continue?</span> | ||
</> | ||
} | ||
/> | ||
)} | ||
</> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.