Skip to content

Workspace Feed - Limit card name #51948

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mountiny merged 4 commits into from
Nov 4, 2024
Merged

Workspace Feed - Limit card name #51948

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
4aeb78a
Workspace Feed - Limit card name
narefyev91 Nov 4, 2024
78f96ba
updates after c+ review
narefyev91 Nov 4, 2024
582af72
add some more fixes for the same places
narefyev91 Nov 4, 2024
f7d7a47
add standard length limit
narefyev91 Nov 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/CONST.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2736,7 +2736,6 @@ const CONST = {
DAILY: 'daily',
MONTHLY: 'monthly',
},
CARD_TITLE_INPUT_LIMIT: 255,
MANAGE_EXPENSIFY_CARDS_ARTICLE_LINK: 'https://help.expensify.com/articles/new-expensify/expensify-card/Manage-Expensify-Cards',
},
COMPANY_CARDS: {
Expand Down
12 changes: 9 additions & 3 deletions src/pages/workspace/companyCards/WorkspaceCompanyCardEditCardNamePage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import TextInput from '@components/TextInput';
import useAutoFocusInput from '@hooks/useAutoFocusInput';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
import * as ErrorUtils from '@libs/ErrorUtils';
import * as PolicyUtils from '@libs/PolicyUtils';
import * as ValidationUtils from '@libs/ValidationUtils';
import Navigation from '@navigation/Navigation';
Expand Down Expand Up @@ -39,8 +40,14 @@ function WorkspaceCompanyCardEditCardNamePage({route}: WorkspaceCompanyCardEditC
Navigation.goBack();
};

const validate = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.EDIT_WORKSPACE_COMPANY_CARD_NAME_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.EDIT_WORKSPACE_COMPANY_CARD_NAME_FORM> =>
ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.NAME]);
const validate = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.EDIT_WORKSPACE_COMPANY_CARD_NAME_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.EDIT_WORKSPACE_COMPANY_CARD_NAME_FORM> => {
const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.NAME]);
const length = values.name.length;
if (length > CONST.STANDARD_LENGTH_LIMIT) {
ErrorUtils.addErrorMessage(errors, INPUT_IDS.NAME, translate('common.error.characterLimitExceedCounter', {length, limit: CONST.STANDARD_LENGTH_LIMIT}));
}
return errors;
};

return (
<AccessOrNotFoundWrapper
Expand Down Expand Up @@ -72,7 +79,6 @@ function WorkspaceCompanyCardEditCardNamePage({route}: WorkspaceCompanyCardEditC
aria-label={translate('workspace.moreFeatures.companyCards.cardName')}
role={CONST.ROLE.PRESENTATION}
defaultValue={defaultValue}
maxLength={CONST.EXPENSIFY_CARD.CARD_TITLE_INPUT_LIMIT}
ref={inputCallbackRef}
/>
</FormProvider>
Expand Down
9 changes: 7 additions & 2 deletions src/pages/workspace/companyCards/addNew/CardNameStep.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import TextInput from '@components/TextInput';
import useAutoFocusInput from '@hooks/useAutoFocusInput';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
import * as ErrorUtils from '@libs/ErrorUtils';
import * as ValidationUtils from '@libs/ValidationUtils';
import * as CompanyCards from '@userActions/CompanyCards';
import CONST from '@src/CONST';
Expand All @@ -23,7 +24,12 @@ function CardNameStep() {
const [addNewCard] = useOnyx(ONYXKEYS.ADD_NEW_COMPANY_CARD);

const validate = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.ADD_NEW_CARD_FEED_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.ADD_NEW_CARD_FEED_FORM> => {
return ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.CARD_TITLE]);
const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.CARD_TITLE]);
const length = values.cardTitle.length;
if (length > CONST.STANDARD_LENGTH_LIMIT) {
ErrorUtils.addErrorMessage(errors, INPUT_IDS.CARD_TITLE, translate('common.error.characterLimitExceedCounter', {length, limit: CONST.STANDARD_LENGTH_LIMIT}));
}
return errors;
};

const submit = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.ADD_NEW_CARD_FEED_FORM>) => {
Expand Down Expand Up @@ -67,7 +73,6 @@ function CardNameStep() {
role={CONST.ROLE.PRESENTATION}
defaultValue={addNewCard?.data?.bankName}
containerStyles={[styles.mb6]}
maxLength={CONST.STANDARD_LENGTH_LIMIT}
ref={inputCallbackRef}
/>
</FormProvider>
Expand Down
12 changes: 9 additions & 3 deletions src/pages/workspace/expensifyCard/WorkspaceEditCardNamePage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import TextInput from '@components/TextInput';
import useAutoFocusInput from '@hooks/useAutoFocusInput';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
import * as ErrorUtils from '@libs/ErrorUtils';
import * as PolicyUtils from '@libs/PolicyUtils';
import * as ValidationUtils from '@libs/ValidationUtils';
import Navigation from '@navigation/Navigation';
Expand Down Expand Up @@ -40,8 +41,14 @@ function WorkspaceEditCardNamePage({route}: WorkspaceEditCardNamePageProps) {
Navigation.goBack();
};

const validate = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.EDIT_EXPENSIFY_CARD_NAME_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.EDIT_EXPENSIFY_CARD_NAME_FORM> =>
ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.NAME]);
const validate = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.EDIT_EXPENSIFY_CARD_NAME_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.EDIT_EXPENSIFY_CARD_NAME_FORM> => {
const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.NAME]);
const length = values.name.length;
if (length > CONST.STANDARD_LENGTH_LIMIT) {
ErrorUtils.addErrorMessage(errors, INPUT_IDS.NAME, translate('common.error.characterLimitExceedCounter', {length, limit: CONST.STANDARD_LENGTH_LIMIT}));
}
return errors;
Comment on lines +45 to +50

@mountiny mountiny Nov 4, 2024

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

its getting a bit repetitive, we might want to consider if there is a nice way to dry this up

@DylanDylann DylanDylann Nov 4, 2024

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ahh great point

@DylanDylann DylanDylann Nov 4, 2024

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cc @narefyev91

};

return (
<AccessOrNotFoundWrapper
Expand Down Expand Up @@ -74,7 +81,6 @@ function WorkspaceEditCardNamePage({route}: WorkspaceEditCardNamePageProps) {
aria-label={translate('workspace.card.issueNewCard.cardName')}
role={CONST.ROLE.PRESENTATION}
defaultValue={card?.nameValuePairs?.cardTitle}
maxLength={CONST.EXPENSIFY_CARD.CARD_TITLE_INPUT_LIMIT}
ref={inputCallbackRef}
/>
</FormProvider>
Expand Down
19 changes: 9 additions & 10 deletions src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import TextInput from '@components/TextInput';
import useAutoFocusInput from '@hooks/useAutoFocusInput';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
import * as ErrorUtils from '@libs/ErrorUtils';
import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils';
import * as ValidationUtils from '@libs/ValidationUtils';
import * as Card from '@userActions/Card';
Expand All @@ -28,16 +29,14 @@ function CardNameStep() {
const userName = PersonalDetailsUtils.getUserNameByEmail(data?.assigneeEmail ?? '', 'firstName');
const defaultCardTitle = data?.cardType !== CONST.EXPENSIFY_CARD.CARD_TYPE.VIRTUAL ? `${userName}'s Card` : '';

const validate = useCallback(
(values: FormOnyxValues<typeof ONYXKEYS.FORMS.ISSUE_NEW_EXPENSIFY_CARD_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.ISSUE_NEW_EXPENSIFY_CARD_FORM> => {
const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.CARD_TITLE]);
if (!values.cardTitle) {
errors.cardTitle = translate('common.error.fieldRequired');
}
return errors;
},
[translate],
);
const validate = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.ISSUE_NEW_EXPENSIFY_CARD_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.ISSUE_NEW_EXPENSIFY_CARD_FORM> => {
const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.CARD_TITLE]);
const length = values.cardTitle.length;
if (length > CONST.STANDARD_LENGTH_LIMIT) {
ErrorUtils.addErrorMessage(errors, INPUT_IDS.CARD_TITLE, translate('common.error.characterLimitExceedCounter', {length, limit: CONST.STANDARD_LENGTH_LIMIT}));
}
return errors;
};

const submit = useCallback((values: FormOnyxValues<typeof ONYXKEYS.FORMS.ISSUE_NEW_EXPENSIFY_CARD_FORM>) => {
Card.setIssueNewCardStepAndData({
Expand Down