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

Grouped basic components in 'create' form in its own card

Browse Source
This commit is contained in:
Alejandro Celaya
2020-12-08 19:21:31 +01:00
parent 2017ee7456
commit 60282281a3
1 changed files with 16 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/short-urls/CreateShortUrl.tsx
View File

@@ -95,14 +95,8 @@ const CreateShortUrl = (
/> />
</div> </div>
); );
const basicComponents = (
const currentServerVersion = isReachableServer(selectedServer) ? selectedServer.version : ''; <>
const disableDomain = !versionMatch(currentServerVersion, { minVersion: '1.19.0-beta.1' });
const showDomainSelector = versionMatch(currentServerVersion, { minVersion: '2.4.0' });
const disableShortCodeLength = !versionMatch(currentServerVersion, { minVersion: '2.1.0' });
return (
<form className="create-short-url" onSubmit={save}>
<FormGroup> <FormGroup>
<Input <Input
bsSize="lg" bsSize="lg"
@@ -117,16 +111,26 @@ const CreateShortUrl = (
<FormGroup> <FormGroup>
<TagsSelector tags={shortUrlCreation.tags ?? []} onChange={changeTags} /> <TagsSelector tags={shortUrlCreation.tags ?? []} onChange={changeTags} />
</FormGroup> </FormGroup>
</>
);
const currentServerVersion = isReachableServer(selectedServer) ? selectedServer.version : '';
const disableDomain = !versionMatch(currentServerVersion, { minVersion: '1.19.0-beta.1' });
const showDomainSelector = versionMatch(currentServerVersion, { minVersion: '2.4.0' });
const disableShortCodeLength = !versionMatch(currentServerVersion, { minVersion: '2.1.0' });
return (
<form className="create-short-url" onSubmit={save}>
{basicMode && basicComponents}
{!basicMode && ( {!basicMode && (
<> <>
<SimpleCard title="Basic options" className="mb-3">
{basicComponents}
</SimpleCard>
<div className="row"> <div className="row">
<div className="col-sm-6 mb-3"> <div className="col-sm-6 mb-3">
<SimpleCard title="Customize the short URL"> <SimpleCard title="Customize the short URL">
<p>
Use a custom slug for your marketing campaigns, change the domain or set a specific length for
the auto-generated short code.
</p>
{renderOptionalInput('customSlug', 'Custom slug', 'text', { {renderOptionalInput('customSlug', 'Custom slug', 'text', {
disabled: hasValue(shortUrlCreation.shortCodeLength), disabled: hasValue(shortUrlCreation.shortCodeLength),
})} })}
@@ -154,7 +158,6 @@ const CreateShortUrl = (
<div className="col-sm-6 mb-3"> <div className="col-sm-6 mb-3">
<SimpleCard title="Limit access to the short URL"> <SimpleCard title="Limit access to the short URL">
<p>Determine when and how many times your short URL can be accessed.</p>
{renderOptionalInput('maxVisits', 'Maximum number of visits allowed', 'number', { min: 1 })} {renderOptionalInput('maxVisits', 'Maximum number of visits allowed', 'number', { min: 1 })}
{renderDateInput('validSince', 'Enabled since...', { maxDate: shortUrlCreation.validUntil as m.Moment | undefined })} {renderDateInput('validSince', 'Enabled since...', { maxDate: shortUrlCreation.validUntil as m.Moment | undefined })}
{renderDateInput('validUntil', 'Enabled until...', { minDate: shortUrlCreation.validSince as m.Moment | undefined })} {renderDateInput('validUntil', 'Enabled until...', { minDate: shortUrlCreation.validSince as m.Moment | undefined })}