FIREFLY-2012: When UWS job fails, display (i) icon to popu job info dialog

src/firefly/js/tables/TableRequestUtil.js

@@ -2,7 +2,7 @@
  * License information at https://github.com/Caltech-IPAC/firefly/blob/master/License.txt
  */
 
-import {get, set, unset, cloneDeep, omit, omitBy, isNil, pickBy, uniqueId, merge} from 'lodash';
+import {set, unset, cloneDeep, omit, omitBy, isNil, pickBy, uniqueId, merge} from 'lodash';
 
 import {getTblById, uniqueTblId} from './TableUtil.js';
 import {SelectInfo} from './SelectInfo.js';
@@ -394,3 +394,10 @@ export function getJobIdFromTblId(tbl_id) {
     return request?.META_INFO?.[ServerParams.JOB_ID];
 }
 
+/**
+ * @param {string} jobId
+ * @param {Object} tableModel
+ */
+export function setJobIdToTbl(jobId, tableModel) {
+    set(tableModel, ['request', 'META_INFO', ServerParams.JOB_ID], jobId);
+}

src/firefly/js/tables/TablesCntlr.js

@@ -5,7 +5,7 @@ import {get, set, omitBy, pickBy, pick, isNil, cloneDeep, findKey, unset, merge}
 
 import {flux} from '../core/ReduxFlux.js';
 import * as TblUtil from './TableUtil.js';
-import {MAX_ROW} from './TableRequestUtil.js';
+import {MAX_ROW, setJobIdToTbl} from './TableRequestUtil.js';
 import shallowequal from 'shallowequal';
 import {dataReducer} from './reducer/TableDataReducer.js';
 import {uiReducer} from './reducer/TableUiReducer.js';
@@ -18,7 +18,7 @@ import {trackBackgroundJob, isSuccess, isDone, getErrMsg, handleJobResult} from
 import {REINIT_APP, getAppOptions} from '../core/AppDataCntlr.js';
 import {dispatchComponentStateChange} from '../core/ComponentCntlr.js';
 import {dispatchJobAdd} from '../core/background/BackgroundCntlr.js';
-import {ensureEnumVals, fixPageSize} from './TableUtil.js';
+import {ensureEnumVals, fixPageSize, getTblById} from './TableUtil.js';
 import {SelectInfo} from 'firefly/tables/SelectInfo';
 
 
@@ -686,6 +686,7 @@ export function asyncFetch(request, hlRowIdx, dispatch, tbl_id) {
         .then ( (jobInfo) => {
             const jobId = jobInfo?.meta?.jobId;
             dispatchJobAdd(jobInfo);
+            setJobIdToTbl(jobId, getTblById(tbl_id));  // update table inflight, because the real table may not be created yet.
 
             const inProgress = !isDone(jobInfo);
             dispatchComponentStateChange(bgKey, {inProgress, jobId});

src/firefly/js/tables/ui/TablePanel.jsx

@@ -30,8 +30,9 @@ import {Logger} from '../../util/Logger.js';
 import {AddColumnBtn} from './AddOrUpdateColumn.jsx';
 import WarningIcon from '@mui/icons-material/WarningAmberRounded';
 import {PropertySheetAsTable} from 'firefly/tables/ui/PropertySheet';
-import {META} from '../TableRequestUtil.js';
+import {getJobIdFromTblId, META} from '../TableRequestUtil.js';
 import {TableMask} from 'firefly/ui/panel/MaskPanel.jsx';
+import {showJobInfo} from 'firefly/core/background/JobInfo';
 
 const logger = Logger('Tables').tag('TablePanel');
 
@@ -41,6 +42,7 @@ const TT_SAVE = 'Save the table';
 const TT_CLEAR_FILTER = 'Remove all filters';
 const TT_EXPAND = 'Expand this panel to take up a larger area';
 const TT_PROPERTY_SHEET = 'Show details for the selected row';
+const TT_JOB_INFO = 'Show job info for this table';
 
 const defaultOptions = {
     showMetaInfo: false,
@@ -432,18 +434,21 @@ function NotReady({showTitle, tbl_id, title, removable, backgroundable, error})
             dispatchTableFetch(JSON.parse(prevReq));
         };
         if (error) {
-            return <TableErrorMsg {...{error, prevReq, reloadTable}}/>;
+            return <TableErrorMsg {...{error, prevReq, reloadTable, tbl_id}}/>;
         } else {
             return <TableMask/>;
         }
     }
 }
 
-export function TableErrorMsg({error, prevReq, reloadTable, ...props}) {
+export function TableErrorMsg({error, prevReq, reloadTable, tbl_id, ...props}) {
     const {message, type, cause} = parseError(error);
     return (
         <Stack spacing={1} m='auto' width={.8} height={1} justifyContent='center' {...props}>
-            <Typography level='title-lg' color='danger'>{message}</Typography>
+            <Stack direction='row' spacing={1} alignItems='center'>
+                <Typography level='title-lg' color='danger'>{message}</Typography>
+                {!prevReq && <JobInfoPopup tbl_id={tbl_id}/>}
+            </Stack>
             { cause && (
                 <Stack>
                     <Stack direction='row'>
@@ -457,3 +462,11 @@ export function TableErrorMsg({error, prevReq, reloadTable, ...props}) {
         </Stack>
     );
 }
+
+function JobInfoPopup({tbl_id}) {
+    const jobId = getJobIdFromTblId(tbl_id);
+    if (!jobId) return null;
+
+    const showInfo = () => showJobInfo(jobId);
+    return <InfoButton tip={TT_JOB_INFO}  onClick={showInfo}/>;
+}