- get path of snapshot

- no tooltip if no OID - disable / improve wrapping of tooltip - disable clicking on current breadcrumb item
kopia · Jun 11, 2023 · 0ff2663 · 0ff2663
1 parent d931998
commit 0ff2663
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 20 deletions.
diff --git a/src/App.css b/src/App.css
@@ -212,4 +212,8 @@ nav.navbar {
   color: #000080;
   font-weight: bold;
   padding-right: 10px;
-}
+}
+
+.wide-tooltip .tooltip-inner {
+  max-width: none;
+}
diff --git a/src/DirectoryBreadcrumbs.jsx b/src/DirectoryBreadcrumbs.jsx
@@ -12,26 +12,25 @@ export function DirectoryBreadcrumbs() {
         breadcrumbs.unshift(state)
     }
 
-    // TODO: get name of "snapshot"!!?? #####
-    // TODO: no tooltip if no OID #####
     // TODO: enable copying of OID to clipboard #####
-    // TODO: disable / improve wrapping of tooltip #####
-    // TODO: there is some flickering if hovering changes #####
-    // TODO: disable clicking on current breadcrumb item #####
     return (
         <Breadcrumb>
-            <Breadcrumb.Item size="sm" variant="secondary" onClick={history.goBack}>Snapshots #####</Breadcrumb.Item>
             {
                 breadcrumbs.map((state, i) => {
                     const index = breadcrumbs.length - i - 1 // revert index
+                    let item = <Breadcrumb.Item key={index} size="sm" variant="outline-secondary"
+                                                onClick={() => {
+                                                    if (index) history.go(-index);
+                                                }}
+                                                active={!index}>
+                        {state.label}
+                    </Breadcrumb.Item>;
                     return (
-                        <OverlayTrigger key={index} placement="top" overlay={<Tooltip>OID: {state.oid}</Tooltip>}>
-                            <Breadcrumb.Item size="sm" variant="outline-secondary"
-                                             onClick={() => history.go(-index)}
-                                             active={!index}>
-                                {state.label}
-                            </Breadcrumb.Item>
-                        </OverlayTrigger>
+                        state.oid
+                            ? <OverlayTrigger key={index} placement="top" overlay={<Tooltip className={"wide-tooltip"}>OID: {state.oid}</Tooltip>}>
+                                {item}
+                            </OverlayTrigger>
+                            : item
                     );
                 })
             }

diff --git a/src/SnapshotsTable.jsx b/src/SnapshotsTable.jsx
@@ -248,8 +248,8 @@ export class SnapshotsTable extends Component {
                 originalSnapshotDescription: x.description,
             })
         }}
-            title={x.description + " - Click to update snapshot description."}
-            className={x.description ? "text-warning" : "text-muted"}><b><FontAwesomeIcon icon={faFileAlt} /></b></a>;
+                  title={x.description + " - Click to update snapshot description."}
+                  className={x.description ? "text-warning" : "text-muted"}><b><FontAwesomeIcon icon={faFileAlt} /></b></a>;
     }
 
     newPinFor(x) {
@@ -321,6 +321,9 @@ export class SnapshotsTable extends Component {
         if (isLoading && !snapshots) {
             return <Spinner animation="border" variant="primary" />;
         }
+        const searchParams = new URLSearchParams(window.location.search);
+        const path = searchParams.get("path");
+
 
         snapshots.sort((a, b) => -compare(a.startTime, b.startTime));
 
@@ -336,7 +339,7 @@ export class SnapshotsTable extends Component {
             width: 200,
             accessor: x => {
                 let timestamp = rfc3339TimestampForDisplay(x.startTime);
-                return <Link to={objectLink(x.rootID, timestamp)}>{timestamp}</Link>;
+                return <Link to={objectLink(x.rootID, timestamp, { label: path })}>{timestamp}</Link>;
             },
         }, {
             id: 'description',
@@ -466,9 +469,9 @@ export class SnapshotsTable extends Component {
                     <Form.Group>
                         <Form.Label>Enter new description</Form.Label>
                         <Form.Control as="textarea"
-                            size="sm"
-                            value={this.state.updatedSnapshotDescription}
-                            onChange={e => this.setState({ updatedSnapshotDescription: e.target.value })} />
+                                      size="sm"
+                                      value={this.state.updatedSnapshotDescription}
+                                      onChange={e => this.setState({ updatedSnapshotDescription: e.target.value })} />
                     </Form.Group>
                 </Modal.Body>