react-intl#defineMessages JavaScript Examples

messages = defineMessages({
  browse: {
    id: 'Browse',
    defaultMessage: 'Browse',
  },
  back: {
    id: 'Back',
    defaultMessage: 'Back',
  },
  select: {
    id: 'Select',
    defaultMessage: 'Select',
  },
})

messages = defineMessages({
    setupIntentModalTitle: {
        id: 'StripeCheckoutModal.setupIntent.title',
        defaultMessage: 'Add Card',
    },
    paymentIntentModalTitle: {
        id: 'StripeCheckoutModal.paymentIntent.title',
        defaultMessage: 'Pay With',
    },
    errorMessage: {
        id: 'StripeCheckoutModal.errorMessage',
        defaultMessage: 'Upps! Something went wrong',
    },
    inputNameLabel: {
        id: 'StripeCheckoutModal.cardholderLabel',
        defaultMessage: 'Cardholder Name',
    },
    inputNamePlaceholder: {
        id: 'StripeCheckoutModal.cardholderPlaceholder',
        defaultMessage: 'Enter the name on your card',
    },
    cardLabel: {
        id: 'StripeCheckoutModal.cardInformationLabel',
        defaultMessage: 'Card Information',
    },
    cancelButtonLabel: {
        id: 'StripeCheckoutModal.cancelButtonLabel',
        defaultMessage: 'Cancel',
    },
    setupIntentOkButtonLabel: {
        id: 'StripeCheckoutModal.setupIntent.okButtonLabel',
        defaultMessage: 'Save',
    },
    paymentIntentOkButtonLabel: {
        id: 'StripeCheckoutModal.paymentIntent.okButtonLabel',
        defaultMessage: 'Pay',
    },
})

messages = defineMessages({
    confirmationModalHeader: {
        id: 'CreditCardPicker.ConfirmationModal.header',
        defaultMessage: 'Are you sure you want delete this credit card?',
        description: 'Header text of the confirmation modal when remove a card',
    },
    confirmationModalQuestion: {
        id: 'CreditCardPicker.ConfirmationModal.question',
        defaultMessage: "This card will be deleted immediately. You can't undo this action.",
        description: 'Question text of the confirmation modal when remove a card',
    },
    confirmationModalOkButtonLabel: {
        id: 'CreditCardPicker.ConfirmationModal.okButtonLabel',
        defaultMessage: 'Delete',
        description: 'Ok button label of the confirmation modal when remove a card',
    },
    confirmationModalCancelButtonLabel: {
        id: 'CreditCardPicker.ConfirmationModal.cancelButtonLabel',
        defaultMessage: 'Cancel',
        description: 'Cancel button label of the confirmation modal when remove a card',
    },
})

messages = defineMessages({
    clickToCopy: {
        id: 'CopyToClipboardButton.clickToCopy',
        defaultMessage: 'Click to copy',
        description: 'Text for the tooltip that describes the action of copy to clipboard',
    },
    copied: {
        id: 'CopyToClipboardButton.copied',
        defaultMessage: 'Copied',
        description:
            'Text for the tooltip that describes that the text was copied to the clipboard',
    },
})

messages = defineMessages({
  currentLocation: {
    id: 'addressTypeAhead.currentLocation',
    defaultMessage: 'Current location',
    description: '',
  },
  addressPrompt: {
    id: 'addressTypeAhead.addressPrompt',
    defaultMessage: 'Enter an address, city, or ZIP code',
    description: '',
  },
})

messages = defineMessages({
    namePlaceholder: {
        id: 'EmailPasswordSignUpForm.namePlaceholder',
        defaultMessage: 'Enter your name',
        description: 'Placeholder for the name input in the sign up form',
    },
    emailPlaceholder: {
        id: 'EmailPasswordSignUpForm.emailPlaceholder',
        defaultMessage: 'Enter your email',
        description: 'Placeholder for the email input in the sign up form',
    },
    passwordPlaceholder: {
        id: 'EmailPasswordSignUpForm.passwordPlaceholder',
        defaultMessage: 'Enter your password',
        description: 'Placeholder for the password input in the sign up form',
    },
})

messages = defineMessages({
    emailPlaceholder: {
        id: 'EmailPasswordSignUpForm.emailPlaceholder',
        defaultMessage: 'Enter your email',
        description: 'Placeholder for the email input in the sign up form',
    },
    passwordPlaceholder: {
        id: 'EmailPasswordSignUpForm.passwordPlaceholder',
        defaultMessage: 'Enter your password',
        description: 'Placeholder for the password input in the sign up form',
    },
})

Messages = defineMessages({
  HOURS: {
    defaultMessage: 'Hours:',
    description: 'Title for hours the facility is open',
    id: 'search.facility.hours',
  },
  CLOSED: {
    defaultMessage: 'Closed',
    description: 'Label indicating that a facility is closed',
    id: 'search.facility.closed',
  },
  SHOW_MORE: {
    defaultMessage: 'Show more',
    description: 'Toggle to display the hours of operation',
    id: 'search.facility.showMore',
  },
  SHOW_LESS: {
    defaultMessage: 'Show less',
    description: 'Toggle to hide the hours of operation',
    id: 'search.facility.showLess',
  },
  UNABLE_TO_DETERMINE: {
    defaultMessage: 'Unable to determine availability',
    description:
      'Label indicating that we are currently unable to determine if the facility is available',
    id: 'search.facility.unableToDetermine',
  },
})

describe('<ToggleOption />', () => {
  it('should render default language messages', () => {
    const defaultEnMessage = 'someContent';
    const message = defineMessages({
      enMessage: {
        id: 'boilerplate.containers.LocaleToggle.en',
        defaultMessage: defaultEnMessage,
      },
    });
    const { container } = render(
      <IntlProvider locale="en">
        <ToggleOption value="en" message={message.enMessage} />
      </IntlProvider>,
    );
    expect(container.firstChild).toMatchSnapshot();
  });

  it('should display `value`(two letter language code) when `message` is absent', () => {
    const { queryByText } = render(
      <IntlProvider locale="de">
        <ToggleOption value="de" />
      </IntlProvider>,
    );
    expect(queryByText('de')).toBeDefined();
  });
});

describe('<Toggle />', () => {
  it('should contain default text', () => {
    const defaultEnMessage = 'someContent';
    const defaultDeMessage = 'someOtherContent';
    const messages = defineMessages({
      en: {
        id: 'boilerplate.containers.LocaleToggle.en',
        defaultMessage: defaultEnMessage,
      },
      de: {
        id: 'boilerplate.containers.LocaleToggle.en',
        defaultMessage: defaultDeMessage,
      },
    });
    const { container } = render(
      <IntlProvider locale="en">
        <Toggle values={['en', 'de']} messages={messages} />
      </IntlProvider>,
    );
    expect(container.firstChild).toMatchSnapshot();
  });

  it('should not have ToggleOptions if props.values is not defined', () => {
    const { container } = render(<Toggle />);
    const elements = container.querySelectorAll('option');
    expect(elements).toHaveLength(1);
    expect(container.firstChild.value).toEqual('--');
  });
});

describe('<Toggle />', () => {
  it('should contain default text', () => {
    const defaultEnMessage = 'someContent';
    const messages = defineMessages({
      en: {
        id: 'boilerplate.containers.LocaleToggle.en',
        defaultMessage: defaultEnMessage,
      },
    });
    const { container } = render(
      <IntlProvider locale={DEFAULT_LOCALE}>
        <Toggle values={['en']} messages={messages} />
      </IntlProvider>,
    );
    expect(container.firstChild).toMatchSnapshot();
  });

  //   it('should not have ToggleOptions if props.values is not defined', () => {
  //     const { container } = render(<Toggle />);
  //     const elements = container.querySelectorAll('option');
  //     expect(elements).toHaveLength(1);
  //     expect(container.firstChild).toHaveTextContent('--');
  //   });
});

messages = defineMessages({
  placeholder: {
    id: 'No items selected',
    defaultMessage: 'No items selected',
  },
  edit: {
    id: 'Edit',
    defaultMessage: 'Edit',
  },
  delete: {
    id: 'Delete',
    defaultMessage: 'Delete',
  },
  openObjectBrowser: {
    id: 'Open object browser',
    defaultMessage: 'Open object browser',
  },
})

messages = defineMessages({
  deleteTable: {
    id: 'Delete table',
    defaultMessage: 'Delete table',
  },
  insertRowBefore: {
    id: 'Insert row before',
    defaultMessage: 'Insert row before',
  },
  insertRowAfter: {
    id: 'Insert row after',
    defaultMessage: 'Insert row after',
  },
  deleteRow: {
    id: 'Delete row',
    defaultMessage: 'Delete row',
  },
  insertColBefore: {
    id: 'Insert col before',
    defaultMessage: 'Insert col before',
  },
  insertColAfter: {
    id: 'Insert col after',
    defaultMessage: 'Insert col after',
  },
  deleteCol: {
    id: 'Delete col',
    defaultMessage: 'Delete col',
  },
})

messages = defineMessages({
  allStylesApplied: {
    id: 'All Styles Applied',
    defaultMessage: 'All Styles Applied',
  },
  noStyle: {
    id: 'No Style',
    defaultMessage: 'No Style',
  },
  fontStyle: {
    id: 'Font Style',
    defaultMessage: 'Font Style',
  },
  paragraphStyle: {
    id: 'Paragraph Style',
    defaultMessage: 'Paragraph Style',
  },
})

messages = defineMessages({
  add: {
    id: 'Add link',
    defaultMessage: 'Add link',
  },
  edit: {
    id: 'Edit link',
    defaultMessage: 'Edit link',
  },
})

messages = defineMessages({
  edit: {
    id: 'Edit link',
    defaultMessage: 'Edit link',
  },
  delete: {
    id: 'Remove link',
    defaultMessage: 'Remove link',
  },
})

messages = defineMessages({
  edit: {
    id: 'Edit element',
    defaultMessage: 'Edit element',
  },
  delete: {
    id: 'Remove element',
    defaultMessage: 'Remove element',
  },
})

messages = defineMessages({
  description: {
    id: 'Add a description…',
    defaultMessage: 'Add a description…',
  },
  title: {
    id: 'Type the title…',
    defaultMessage: 'Type the title…',
  },
})

messages = defineMessages({
  insertRowBefore: {
    id: 'Insert row before',
    defaultMessage: 'Insert row before',
  },
  insertRowAfter: {
    id: 'Insert row after',
    defaultMessage: 'Insert row after',
  },
  deleteRow: {
    id: 'Delete row',
    defaultMessage: 'Delete row',
  },
  insertColBefore: {
    id: 'Insert col before',
    defaultMessage: 'Insert col before',
  },
  insertColAfter: {
    id: 'Insert col after',
    defaultMessage: 'Insert col after',
  },
  deleteCol: {
    id: 'Delete col',
    defaultMessage: 'Delete col',
  },
})

messages = defineMessages({
  someMessage: {
    id: 'some.id',
    defaultMessage: 'This is some default message',
    en: 'This is some en message',
  },
})

Messages = defineMessages({
  HEADER: {
    defaultMessage:
      'There are currently no COVID-19 testing sites in your search area.',
    description: 'Header for when there are no testings sites near you',
    id: 'search.noResults.title',
  },
})

messages = defineMessages({
  someMessage: {
    id: 'some.id',
    defaultMessage: 'This is some default message',
    en: 'This is some en message',
  },
})

labels = defineMessages({
  unknown: { id: 'label.unknown', defaultMessage: 'Unknown' },
})

devices = defineMessages({
  desktop: { id: 'metrics.device.desktop', defaultMessage: 'Desktop' },
  laptop: { id: 'metrics.device.laptop', defaultMessage: 'Laptop' },
  tablet: { id: 'metrics.device.tablet', defaultMessage: 'Tablet' },
  mobile: { id: 'metrics.device.mobile', defaultMessage: 'Mobile' },
})

messages = defineMessages({
  unknown: { id: 'label.unknown', defaultMessage: 'Unknown' },
  countries: { id: 'metrics.countries', defaultMessage: 'Countries' },
  visitors: { id: 'metrics.visitors', defaultMessage: 'Visitors' },
})

messages = defineMessages({
  someMessage: {
    id: 'some.id',
    defaultMessage: 'This is some default message',
    en: 'This is some en message',
  },
})

messages = defineMessages({
    filterButton: {
        id: 'FloatingSearchButtonIcon.filterButton.label',
        defaultMessage: 'Filter',
        description: 'Label of the FloatingSearchButtonIcon',
    },
})

messages = defineMessages({
    clearButton: {
        id: 'FloatingSearch.clearButton.text',
        defaultMessage: 'Clear',
        description: 'Text of the button to clear the FloatingSearch',
    },
})

messages = defineMessages({
  someMessage: {
    id: 'some.id',
    defaultMessage: 'This is some default message',
    en: 'This is some en message',
  },
})