Refactored intl messages.

components/pages/settings/teams/TeamAddForm.js

@@ -1,8 +1,19 @@
 import { useRef } from 'react';
-import { Form, FormRow, FormInput, FormButtons, TextField, Button } from 'react-basics';
+import { useIntl } from 'react-intl';
+import {
+  Form,
+  FormRow,
+  FormInput,
+  FormButtons,
+  TextField,
+  Button,
+  SubmitButton,
+} from 'react-basics';
 import useApi from 'hooks/useApi';
+import { labels } from 'components/messages';
 
 export default function TeamAddForm({ onSave, onClose }) {
+  const { formatMessage } = useIntl();
   const { post, useMutation } = useApi();
   const { mutate, error, isLoading } = useMutation(data => post('/teams', data));
   const ref = useRef(null);
@@ -17,17 +28,17 @@ export default function TeamAddForm({ onSave, onClose }) {
 
   return (
     <Form ref={ref} onSubmit={handleSubmit} error={error}>
-      <FormRow label="Name">
+      <FormRow label={formatMessage(labels.name)}>
         <FormInput name="name" rules={{ required: 'Required' }}>
           <TextField autoComplete="off" />
         </FormInput>
       </FormRow>
       <FormButtons flex>
-        <Button type="submit" variant="primary" disabled={isLoading}>
-          Save
-        </Button>
+        <SubmitButton variant="primary" disabled={isLoading}>
+          {formatMessage(labels.save)}
+        </SubmitButton>
         <Button disabled={isLoading} onClick={onClose}>
-          Cancel
+          {formatMessage(labels.cancel)}
         </Button>
       </FormButtons>
     </Form>