WIP Toasts localizations.

client/src/containers/Items/ItemForm.js

@@ -12,6 +12,7 @@ import {
   Checkbox,
 } from '@blueprintjs/core';
 import { Row, Col } from 'react-grid-system';
+import { useIntl } from 'react-intl';
 import { Select } from '@blueprintjs/select';
 import AppToaster from 'components/AppToaster';
 import AccountsConnect from 'connectors/Accounts.connector';
@@ -27,6 +28,7 @@ import Dragzone from 'components/Dragzone';
 import MediaConnect from 'connectors/Media.connect';
 import useMedia from 'hooks/useMedia';
 
+
 const ItemForm = ({
   requestSubmitItem,
   
@@ -38,6 +40,7 @@ const ItemForm = ({
 }) => {
   const [selectedAccounts, setSelectedAccounts] = useState({});
   const history = useHistory();
+  const { formatMessage } = useIntl();
 
   const {
     files,
@@ -49,7 +52,7 @@ const ItemForm = ({
   } = useMedia({
     saveCallback: requestSubmitMedia,
     deleteCallback: requestDeleteMedia,
-  })
+  });
 
   const ItemTypeDisplay = useMemo(() => ([
     { value: null, label: 'Select Item Type' },
@@ -97,6 +100,7 @@ const ItemForm = ({
     touched,
     errors,
     handleSubmit,
+    isSubmitting,
   } = useFormik({
     enableReinitialize: true,
     validationSchema: validationSchema,
@@ -109,7 +113,13 @@ const ItemForm = ({
 
         return requestSubmitItem(formValues).then((response) => {
           AppToaster.show({
-            message: 'The_Items_has_been_submit'
+            message: formatMessage({
+              id: 'service_has_been_successful_created',
+            }, {
+              name: values.name,
+              service: formatMessage({ id: 'item' }),
+            }),
+            intent: Intent.SUCCESS,
           });
           setSubmitting(false);
           history.push('/dashboard/items');
@@ -439,11 +449,11 @@ const ItemForm = ({
         </Row>
 
         <div class='form__floating-footer'>
-          <Button intent={Intent.PRIMARY} type='submit'>
+          <Button intent={Intent.PRIMARY} disabled={isSubmitting} type='submit'>
             Save
           </Button>
 
-          <Button className={'ml1'}>Save as Draft</Button>
+          <Button className={'ml1'} disabled={isSubmitting}>Save as Draft</Button>
           <Button className={'ml1'} onClick={handleCancelClickBtn}>Close</Button>
         </div>
       </form>

client/src/containers/Items/ItemsList.js

@@ -8,6 +8,7 @@ import {
   Alert,
 } from '@blueprintjs/core';
 import { useQuery } from 'react-query';
+import { FormattedHTMLMessage, useIntl } from 'react-intl';
 
 import DashboardInsider from 'components/Dashboard/DashboardInsider';
 import ItemsActionsBar from 'containers/Items/ItemsActionsBar';
@@ -26,6 +27,7 @@ import withItemsActions from 'containers/Items/withItemsActions';
 import withViewsActions from 'containers/Views/withViewsActions';
 
 
+
 function ItemsList({
   // #withDashboard
   changePageTitle,
@@ -46,6 +48,8 @@ function ItemsList({
   const [selectedRows, setSelectedRows] = useState([]);
   const [tableLoading, setTableLoading] = useState(false);
 
+  const { formatMessage } = useIntl();
+
   useEffect(() => {
     changePageTitle('Items List');
   }, [changePageTitle]);
@@ -75,7 +79,12 @@ function ItemsList({
   // handle confirm delete item.
   const handleConfirmDeleteItem = useCallback(() => {
     requestDeleteItem(deleteItem.id).then(() => {
-      AppToaster.show({ message: 'the_item_has_been_deleted' });
+      AppToaster.show({
+        message: formatMessage({
+          id: 'the_item_has_been_successfully_deleted',
+        }),
+        intent: Intent.SUCCESS,
+      });
       setDeleteItem(false);
     });
   }, [requestDeleteItem, deleteItem]);
@@ -142,15 +151,15 @@ function ItemsList({
 
             <Alert
               cancelButtonText="Cancel"
-              confirmButtonText="Move to Trash"
+              confirmButtonText="Delete"
               icon="trash"
               intent={Intent.DANGER}
               isOpen={deleteItem}
               onCancel={handleCancelDeleteItem}
               onConfirm={handleConfirmDeleteItem}>
               <p>
-              Are you sure you want to move <b>filename</b> to Trash? You will be able to restore it later,
-              but it will become private to you.
+                <FormattedHTMLMessage
+                  id={'once_delete_this_item_you_will_able_to_restore_it'} />
               </p>
             </Alert>
           </Route>