forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-03-15 20:13:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixed short URL creation and modal close buttons

Browse Source
This commit is contained in:
Alejandro Celaya
2022-03-06 11:16:31 +01:00
parent 6a739b7a25
commit 27e3b6f0d0
6 changed files with 22 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/short-urls/ShortUrlForm.tsx
View File

@@ -86,15 +86,13 @@ export const ShortUrlForm = (
</FormGroup>
);
const renderDateInput = (id: DateFields, placeholder: string, props: Partial<DateInputProps> = {}) => (
<div className="form-group">
<DateInput
selected={shortUrlData[id] ? toDate(shortUrlData[id] as string | Date) : null}
placeholderText={placeholder}
isClearable
onChange={(date) => setShortUrlData({ ...shortUrlData, [id]: date })}
{...props}
/>
</div>
<DateInput
selected={shortUrlData[id] ? toDate(shortUrlData[id] as string | Date) : null}
placeholderText={placeholder}
isClearable
onChange={(date) => setShortUrlData({ ...shortUrlData, [id]: date })}
{...props}
/>
);
const basicComponents = (
<>
@@ -110,9 +108,9 @@ export const ShortUrlForm = (
</FormGroup>
<Row>
{isBasicMode && renderOptionalInput('customSlug', 'Custom slug', 'text', { bsSize: 'lg' }, { className: 'col-lg-6' })}
<FormGroup className={isBasicMode ? 'col-lg-6' : 'col-12 mb-0'}>
<div className={isBasicMode ? 'col-lg-6' : 'col-12 mb-0'}>
<TagsSelector selectedTags={shortUrlData.tags ?? []} onChange={changeTags} />
</FormGroup>
</div>
</Row>
</>
);
@@ -154,12 +152,10 @@ export const ShortUrlForm = (
})}
</div>
</Row>
<FormGroup>
<DomainSelector
value={shortUrlData.domain}
onChange={(domain?: string) => setShortUrlData({ ...shortUrlData, domain })}
/>
</FormGroup>
<DomainSelector
value={shortUrlData.domain}
onChange={(domain?: string) => setShortUrlData({ ...shortUrlData, domain })}
/>
</>
)}
</SimpleCard>
@@ -169,7 +165,9 @@ export const ShortUrlForm = (
<div className={limitAccessCardClasses}>
<SimpleCard title="Limit access to the short URL">
{renderOptionalInput('maxVisits', 'Maximum number of visits allowed', 'number', { min: 1 })}
{renderDateInput('validSince', 'Enabled since...', { maxDate: shortUrlData.validUntil ? toDate(shortUrlData.validUntil) : undefined })}
<div className="mb-3">
{renderDateInput('validSince', 'Enabled since...', { maxDate: shortUrlData.validUntil ? toDate(shortUrlData.validUntil) : undefined })}
</div>
{renderDateInput('validUntil', 'Enabled until...', { minDate: shortUrlData.validSince ? toDate(shortUrlData.validSince) : undefined })}
</SimpleCard>
</div>