Skip to content

Commit 7027bb2

Browse files
authored
Merge pull request #322 from ashapadmashetti/release-1.0-fork
Cherry-picking: Improve from elements across GUI
2 parents f783c40 + ff5c0ca commit 7027bb2

File tree

10 files changed

+172
-123
lines changed

10 files changed

+172
-123
lines changed

src/components/Contribute/AuthorInformation.tsx

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -26,24 +26,30 @@ interface Props {
2626
const AuthorInformation: React.FC<Props> = ({ formType, reset, formData, setDisableAction, email, setEmail, name, setName }) => {
2727
const [validEmail, setValidEmail] = useState<ValidatedOptions>();
2828
const [validName, setValidName] = useState<ValidatedOptions>();
29+
const [validEmailError, setValidEmailError] = useState('Required Field');
2930

30-
const validateEmail = (email: string) => {
31+
const validateEmail = (emailStr: string) => {
32+
const email = emailStr.trim();
3133
const re = /\S+@\S+\.\S+/;
3234
if (re.test(email)) {
3335
setValidEmail(ValidatedOptions.success);
36+
setValidEmailError('');
3437
if (formType === FormType.Knowledge) {
3538
setDisableAction(!checkKnowledgeFormCompletion(formData));
3639
return;
3740
}
3841
setDisableAction(!checkSkillFormCompletion(formData));
3942
return;
4043
}
44+
const errMsg = email ? 'Please enter a valid email address.' : 'Required field';
4145
setDisableAction(true);
4246
setValidEmail(ValidatedOptions.error);
47+
setValidEmailError(errMsg);
4348
return;
4449
};
4550

46-
const validateName = (name: string) => {
51+
const validateName = (nameStr: string) => {
52+
const name = nameStr.trim();
4753
if (name.length > 0) {
4854
setValidName(ValidatedOptions.success);
4955
if (formType === FormType.Knowledge) {
@@ -81,7 +87,7 @@ const AuthorInformation: React.FC<Props> = ({ formType, reset, formData, setDisa
8187
/>
8288
}
8389
>
84-
<FormGroup isRequired key={'author-info-details-id'}>
90+
<FormGroup isRequired key={'author-info-details-email'} label="Email address">
8591
<TextInput
8692
isRequired
8793
type="email"
@@ -96,11 +102,13 @@ const AuthorInformation: React.FC<Props> = ({ formType, reset, formData, setDisa
96102
<FormHelperText>
97103
<HelperText>
98104
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validEmail}>
99-
Please enter a valid email address.
105+
{validEmailError}
100106
</HelperTextItem>
101107
</HelperText>
102108
</FormHelperText>
103109
)}
110+
</FormGroup>
111+
<FormGroup isRequired key={'author-info-details-name'} label="Full name">
104112
<TextInput
105113
isRequired
106114
type="text"
@@ -115,7 +123,7 @@ const AuthorInformation: React.FC<Props> = ({ formType, reset, formData, setDisa
115123
<FormHelperText>
116124
<HelperText>
117125
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validName}>
118-
Name is required.
126+
Required field
119127
</HelperTextItem>
120128
</HelperText>
121129
</FormHelperText>

src/components/Contribute/Knowledge/AttributionInformation/AttributionInformation.tsx

Lines changed: 24 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,8 @@ const AttributionInformation: React.FC<Props> = ({
6666
setValidCreators(ValidatedOptions.success);
6767
}, [isEditForm]);
6868

69-
const validateTitle = (title: string) => {
69+
const validateTitle = (titleStr: string) => {
70+
const title = titleStr.trim();
7071
if (title.length > 0) {
7172
setValidTitle(ValidatedOptions.success);
7273
setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
@@ -77,7 +78,8 @@ const AttributionInformation: React.FC<Props> = ({
7778
return;
7879
};
7980

80-
const validateLink = (link: string) => {
81+
const validateLink = (linkStr: string) => {
82+
const link = linkStr.trim();
8183
if (link.length === 0) {
8284
setDisableAction(true);
8385
setValidLink(ValidatedOptions.error);
@@ -95,7 +97,8 @@ const AttributionInformation: React.FC<Props> = ({
9597
}
9698
};
9799

98-
const validateRevision = (revision: string) => {
100+
const validateRevision = (revisionStr: string) => {
101+
const revision = revisionStr.trim();
99102
if (revision.length > 0) {
100103
setValidRevision(ValidatedOptions.success);
101104
setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
@@ -106,7 +109,8 @@ const AttributionInformation: React.FC<Props> = ({
106109
return;
107110
};
108111

109-
const validateLicense = (license: string) => {
112+
const validateLicense = (licenseStr: string) => {
113+
const license = licenseStr.trim();
110114
if (license.length > 0) {
111115
setValidLicense(ValidatedOptions.success);
112116
setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
@@ -117,7 +121,8 @@ const AttributionInformation: React.FC<Props> = ({
117121
return;
118122
};
119123

120-
const validateCreators = (creators: string) => {
124+
const validateCreators = (creatorsStr: string) => {
125+
const creators = creatorsStr.trim();
121126
if (creators.length > 0) {
122127
setValidCreators(ValidatedOptions.success);
123128
setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
@@ -145,7 +150,7 @@ const AttributionInformation: React.FC<Props> = ({
145150
/>
146151
}
147152
>
148-
<FormGroup isRequired key={'attribution-info-details-id'}>
153+
<FormGroup isRequired key={'attribution-info-details-work_link'} label="Work link or URL">
149154
<TextInput
150155
isRequired
151156
type="url"
@@ -160,7 +165,7 @@ const AttributionInformation: React.FC<Props> = ({
160165
<FormHelperText>
161166
<HelperText>
162167
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validLink}>
163-
Link to title is required.
168+
Required field
164169
</HelperTextItem>
165170
</HelperText>
166171
</FormHelperText>
@@ -174,6 +179,8 @@ const AttributionInformation: React.FC<Props> = ({
174179
</HelperText>
175180
</FormHelperText>
176181
)}
182+
</FormGroup>
183+
<FormGroup isRequired key={'attribution-info-details-title_work'} label="Work title">
177184
<TextInput
178185
isRequired
179186
type="text"
@@ -188,11 +195,13 @@ const AttributionInformation: React.FC<Props> = ({
188195
<FormHelperText>
189196
<HelperText>
190197
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validTitle}>
191-
Title is required.
198+
Required field
192199
</HelperTextItem>
193200
</HelperText>
194201
</FormHelperText>
195202
)}
203+
</FormGroup>
204+
<FormGroup isRequired key={'attribution-info-details-document_revision'} label="Document revision">
196205
<TextInput
197206
isRequired
198207
type="text"
@@ -207,11 +216,13 @@ const AttributionInformation: React.FC<Props> = ({
207216
<FormHelperText>
208217
<HelperText>
209218
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validRevision}>
210-
Revision is required.
219+
Required field
211220
</HelperTextItem>
212221
</HelperText>
213222
</FormHelperText>
214223
)}
224+
</FormGroup>
225+
<FormGroup isRequired key={'attribution-info-details-license'} label="License">
215226
<TextInput
216227
isRequired
217228
type="text"
@@ -226,11 +237,13 @@ const AttributionInformation: React.FC<Props> = ({
226237
<FormHelperText>
227238
<HelperText>
228239
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validLicense}>
229-
License is required.
240+
Required field
230241
</HelperTextItem>
231242
</HelperText>
232243
</FormHelperText>
233244
)}
245+
</FormGroup>
246+
<FormGroup isRequired key={'attribution-info-details-creators'} label="Creators name">
234247
<TextInput
235248
isRequired
236249
type="text"
@@ -245,7 +258,7 @@ const AttributionInformation: React.FC<Props> = ({
245258
<FormHelperText>
246259
<HelperText>
247260
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validCreators}>
248-
Creators is required.
261+
Required field
249262
</HelperTextItem>
250263
</HelperText>
251264
</FormHelperText>

src/components/Contribute/Knowledge/DocumentInformation/DocumentInformation.tsx

Lines changed: 80 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,8 @@ const DocumentInformation: React.FC<Props> = ({
6767
}
6868
}, [isEditForm]);
6969

70-
const validateRepo = (repo: string) => {
70+
const validateRepo = (repoStr: string) => {
71+
const repo = repoStr.trim();
7172
if (repo.length === 0) {
7273
setDisableAction(true);
7374
setValidRepo(ValidatedOptions.error);
@@ -85,7 +86,8 @@ const DocumentInformation: React.FC<Props> = ({
8586
}
8687
};
8788

88-
const validateCommit = (commit: string) => {
89+
const validateCommit = (commitStr: string) => {
90+
const commit = commitStr.trim();
8991
if (commit.length > 0) {
9092
setValidCommit(ValidatedOptions.success);
9193
setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
@@ -96,7 +98,8 @@ const DocumentInformation: React.FC<Props> = ({
9698
return;
9799
};
98100

99-
const validateDocumentName = (documentName: string) => {
101+
const validateDocumentName = (document: string) => {
102+
const documentName = document.trim();
100103
if (documentName.length > 0) {
101104
setValidDocumentName(ValidatedOptions.success);
102105
setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
@@ -257,75 +260,80 @@ const DocumentInformation: React.FC<Props> = ({
257260
<p>{modalText}</p>
258261
</Modal>
259262
{!useFileUpload ? (
260-
<FormGroup key={'doc-info-details-id'}>
261-
<TextInput
262-
isRequired
263-
type="url"
264-
aria-label="repo"
265-
validated={validRepo}
266-
placeholder="Enter repo url where document exists"
267-
value={knowledgeDocumentRepositoryUrl}
268-
onChange={(_event, value) => setKnowledgeDocumentRepositoryUrl(value)}
269-
onBlur={() => validateRepo(knowledgeDocumentRepositoryUrl)}
270-
/>
271-
{validRepo === ValidatedOptions.error && (
272-
<FormHelperText>
273-
<HelperText>
274-
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validRepo}>
275-
Repo URL is required.
276-
</HelperTextItem>
277-
</HelperText>
278-
</FormHelperText>
279-
)}
280-
{validRepo === ValidatedOptions.warning && (
281-
<FormHelperText>
282-
<HelperText>
283-
<HelperTextItem icon={<ExclamationCircleIcon />} variant="error">
284-
Please enter a valid URL.
285-
</HelperTextItem>
286-
</HelperText>
287-
</FormHelperText>
288-
)}
289-
290-
<TextInput
291-
isRequired
292-
type="text"
293-
aria-label="commit"
294-
placeholder="Enter the commit sha of the document in that repo"
295-
value={knowledgeDocumentCommit}
296-
validated={validCommit}
297-
onChange={(_event, value) => setKnowledgeDocumentCommit(value)}
298-
onBlur={() => validateCommit(knowledgeDocumentCommit)}
299-
/>
300-
{validCommit === ValidatedOptions.error && (
301-
<FormHelperText>
302-
<HelperText>
303-
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validCommit}>
304-
Valid commit SHA is required.
305-
</HelperTextItem>
306-
</HelperText>
307-
</FormHelperText>
308-
)}
309-
<TextInput
310-
isRequired
311-
type="text"
312-
aria-label="patterns"
313-
placeholder="Enter the documents name (comma separated)"
314-
value={documentName}
315-
validated={validDocumentName}
316-
onChange={(_event, value) => setDocumentName(value)}
317-
onBlur={() => validateDocumentName(documentName)}
318-
/>
319-
{validDocumentName === ValidatedOptions.error && (
320-
<FormHelperText>
321-
<HelperText>
322-
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validDocumentName}>
323-
Document name is required.
324-
</HelperTextItem>
325-
</HelperText>
326-
</FormHelperText>
327-
)}
328-
</FormGroup>
263+
<>
264+
<FormGroup isRequired key={'doc-info-details-id'} label="Repo URL">
265+
<TextInput
266+
isRequired
267+
type="url"
268+
aria-label="repo"
269+
validated={validRepo}
270+
placeholder="Enter repo url where document exists"
271+
value={knowledgeDocumentRepositoryUrl}
272+
onChange={(_event, value) => setKnowledgeDocumentRepositoryUrl(value)}
273+
onBlur={() => validateRepo(knowledgeDocumentRepositoryUrl)}
274+
/>
275+
{validRepo === ValidatedOptions.error && (
276+
<FormHelperText>
277+
<HelperText>
278+
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validRepo}>
279+
Required field
280+
</HelperTextItem>
281+
</HelperText>
282+
</FormHelperText>
283+
)}
284+
{validRepo === ValidatedOptions.warning && (
285+
<FormHelperText>
286+
<HelperText>
287+
<HelperTextItem icon={<ExclamationCircleIcon />} variant="error">
288+
Please enter a valid URL.
289+
</HelperTextItem>
290+
</HelperText>
291+
</FormHelperText>
292+
)}
293+
</FormGroup>
294+
<FormGroup isRequired key={'doc-info-details-commit_sha'} label="Commit SHA">
295+
<TextInput
296+
isRequired
297+
type="text"
298+
aria-label="commit"
299+
placeholder="Enter the commit sha of the document in that repo"
300+
value={knowledgeDocumentCommit}
301+
validated={validCommit}
302+
onChange={(_event, value) => setKnowledgeDocumentCommit(value)}
303+
onBlur={() => validateCommit(knowledgeDocumentCommit)}
304+
/>
305+
{validCommit === ValidatedOptions.error && (
306+
<FormHelperText>
307+
<HelperText>
308+
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validCommit}>
309+
Valid commit SHA is required.
310+
</HelperTextItem>
311+
</HelperText>
312+
</FormHelperText>
313+
)}
314+
</FormGroup>
315+
<FormGroup isRequired key={'doc-info-details-patterns'} label="Document names">
316+
<TextInput
317+
isRequired
318+
type="text"
319+
aria-label="patterns"
320+
placeholder="Enter the documents name (comma separated)"
321+
value={documentName}
322+
validated={validDocumentName}
323+
onChange={(_event, value) => setDocumentName(value)}
324+
onBlur={() => validateDocumentName(documentName)}
325+
/>
326+
{validDocumentName === ValidatedOptions.error && (
327+
<FormHelperText>
328+
<HelperText>
329+
<HelperTextItem icon={<ExclamationCircleIcon />} variant={validDocumentName}>
330+
Required field
331+
</HelperTextItem>
332+
</HelperText>
333+
</FormHelperText>
334+
)}
335+
</FormGroup>
336+
</>
329337
) : (
330338
<>
331339
<UploadFile onFilesChange={handleFilesChange} />

0 commit comments

Comments
 (0)