Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/develop' into PE-7068-reassign-name
Browse files Browse the repository at this point in the history
  • Loading branch information
atticusofsparta committed Dec 13, 2024
2 parents a32e2e2 + 3f36b2f commit 1b5b343
Show file tree
Hide file tree
Showing 21 changed files with 824 additions and 135 deletions.
2 changes: 1 addition & 1 deletion assets/ant-changelog.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).

## [Unreleased]

## [9] - [ezS3Z57rq_0skoG0WYmIqJ33mJiu0HbYNn9vEu12Mc4] - (2024-12-4)
## [9] - [16_FyX-V2QU0RPSh1GIaEETSaUjNb0oVjCFpVbAfQq4] - (2024-12-4)

### Changed

Expand Down
45 changes: 45 additions & 0 deletions src/components/data-display/Pill.tsx
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>
);
}
119 changes: 119 additions & 0 deletions src/components/forms/DomainSettings/DescriptionRow.tsx
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>
</>
}
/>
)}
</>
);
}
80 changes: 80 additions & 0 deletions src/components/forms/DomainSettings/DomainSettings.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,10 @@ import { useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';

import ControllersRow from './ControllersRow';
import DescriptionRow from './DescriptionRow';
import DomainSettingsRow from './DomainSettingsRow';
import IOCompatibleRow from './IOCompatibleRow';
import KeywordsRow from './KeywordRow';
import LogoRow from './LogoRow';
import NicknameRow from './NicknameRow';
import OwnerRow from './OwnerRow';
Expand All @@ -58,6 +60,8 @@ export enum DomainSettingsRowTypes {
TTL = 'TTL Seconds',
UNDERNAMES = 'Undernames',
LOGO_TX_ID = 'Logo TX ID',
DESCRIPTION = 'Description',
KEYWORDS = 'Keywords',
}

function DomainSettings({
Expand Down Expand Up @@ -493,6 +497,82 @@ function DomainSettings({
}
/>
),
[DomainSettingsRowTypes.DESCRIPTION]: (
<DescriptionRow
key={DomainSettingsRowTypes.DESCRIPTION}
description={data?.info.Description}
editable={isAuthorized}
confirm={(description: string) =>
dispatchANTInteraction({
payload: {
description,
},
workflowName: ANT_INTERACTION_TYPES.SET_DESCRIPTION,
signer: wallet!.contractSigner!,
owner: walletAddress!.toString(),
processId: data?.processId,
dispatch,
})
}
/>
),
[DomainSettingsRowTypes.KEYWORDS]: (
<KeywordsRow
key={DomainSettingsRowTypes.KEYWORDS}
keywords={data?.info.Keywords}
editable={isAuthorized}
confirm={(keywords: string[]) =>
dispatchANTInteraction({
payload: {
keywords,
},
workflowName: ANT_INTERACTION_TYPES.SET_KEYWORDS,
signer: wallet!.contractSigner!,
owner: walletAddress!.toString(),
processId: data?.processId,
dispatch,
})
}
/>
),
[DomainSettingsRowTypes.DESCRIPTION]: (
<DescriptionRow
key={DomainSettingsRowTypes.DESCRIPTION}
description={data?.info.Description}
editable={isAuthorized}
confirm={(description: string) =>
dispatchANTInteraction({
payload: {
description,
},
workflowName: ANT_INTERACTION_TYPES.SET_DESCRIPTION,
signer: wallet!.contractSigner!,
owner: walletAddress!.toString(),
processId: data?.processId,
dispatch,
})
}
/>
),
[DomainSettingsRowTypes.KEYWORDS]: (
<KeywordsRow
key={DomainSettingsRowTypes.KEYWORDS}
keywords={data?.info.Keywords}
editable={isAuthorized}
confirm={(keywords: string[]) =>
dispatchANTInteraction({
payload: {
keywords,
},
workflowName: ANT_INTERACTION_TYPES.SET_KEYWORDS,
signer: wallet!.contractSigner!,
owner: walletAddress!.toString(),
processId: data?.processId,
dispatch,
})
}
/>
),
}).map(([rowName, row]) =>
rowFilter.includes(rowName as DomainSettingsRowTypes) ? <></> : row,
)}
Expand Down
4 changes: 4 additions & 0 deletions src/components/forms/DomainSettings/DomainSettingsRow.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { PencilIcon } from '@src/components/icons';
import { List } from 'antd';
import { CSSProperties } from 'react';

import './styles.css';

Expand All @@ -9,6 +10,7 @@ export default function DomainSettingsRow({
action = [],
editable,
editing = false,
customStyle = {},
onCancel,
onSave,
setEditing,
Expand All @@ -18,6 +20,7 @@ export default function DomainSettingsRow({
action?: React.ReactNode[] | React.ReactNode;
editable?: boolean;
editing?: boolean;
customStyle?: CSSProperties;
onCancel?: () => void;
onSave?: () => void;
setEditing?: () => void;
Expand All @@ -28,6 +31,7 @@ export default function DomainSettingsRow({
style={{
borderColor: editing ? 'var(--text-grey)' : undefined,
overflow: 'hidden',
...customStyle,
}}
actions={
editable
Expand Down
Loading

0 comments on commit 1b5b343

Please sign in to comment.