Merge remote-tracking branch 'origin/_tasks'

client/src/containers/Expenses/ExpenseDataTable.js

@@ -39,10 +39,10 @@ function ExpensesDataTable({
   changeCurrentView,
   changePageSubtitle,
   setTopbarEditView,
-  
+
   // #withView
   viewMeta,
-  
+
   // #ownProps
   loading,
   onFetchData,
@@ -99,10 +99,9 @@ function ExpensesDataTable({
   const actionMenuList = useCallback(
     (expense) => (
       <Menu>
-        <MenuItem
-          text={formatMessage({ id: 'view_details' })} />
+        <MenuItem text={formatMessage({ id: 'view_details' })} />
         <MenuDivider />
-        <If condition={expense.published}>
+        <If condition={!expense.published}>
           <MenuItem
             text={formatMessage({ id: 'publish_expense' })}
             onClick={handlePublishExpense(expense)}
@@ -120,23 +119,35 @@ function ExpensesDataTable({
         />
       </Menu>
     ),
-    [handleEditExpense, handleDeleteExpense, handlePublishExpense, formatMessage],
+    [
+      handleEditExpense,
+      handleDeleteExpense,
+      handlePublishExpense,
+      formatMessage,
+    ],
   );
 
-  const onRowContextMenu = useCallback((cell) => {
-    return actionMenuList(cell.row.original);
-  }, [actionMenuList]);
+  const onRowContextMenu = useCallback(
+    (cell) => {
+      return actionMenuList(cell.row.original);
+    },
+    [actionMenuList],
+  );
 
-  const expenseAccountAccessor = (expense) => {
-    if (expense.categories.length === 1) {
-      return expense.categories[0].expense_account.name;
-    } else if (expense.categories.length > 1) {
-      const mutliCategories = expense.categories.map(category =>
-        (<div>- {category.expense_account.name}  ${ category.amount }</div>)
+  const expenseAccountAccessor = (_expense) => {
+    if (_expense.categories.length === 1) {
+      return _expense.categories[0].expense_account.name;
+    } else if (_expense.categories.length > 1) {
+      const mutliCategories = _expense.categories.map((category) => (
+        <div>
+          - {category.expense_account.name} ${category.amount}
+        </div>
+      ));
+      return (
+        <Tooltip content={mutliCategories}>{'- Multi Categories -'}</Tooltip>
       );
-      return <Tooltip content={mutliCategories}>{ '- Multi Categories -' }</Tooltip>;
     }
-  }
+  };
 
   const columns = useMemo(
     () => [
@@ -180,7 +191,7 @@ function ExpensesDataTable({
         id: 'publish',
         Header: formatMessage({ id: 'publish' }),
         accessor: (r) => {
-          return !r.published ? (
+          return r.published ? (
             <Tag minimal={true}>
               <T id={'published'} />
             </Tag>
@@ -279,5 +290,5 @@ export default compose(
     expensesLoading,
     expensesPagination,
   })),
-  withViewDetails,
+  withViewDetails(),
 )(ExpensesDataTable);