Edit file and add to package (#3070)

quiltdata · Sep 12, 2022 · 6ec1877 · 6ec1877
1 parent e7b5eeb
commit 6ec1877
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 2 deletions.
diff --git a/catalog/app/containers/Bucket/PackageTree/PackageTree.tsx b/catalog/app/containers/Bucket/PackageTree/PackageTree.tsx
@@ -1,4 +1,4 @@
-import { basename } from 'path'
+import { basename, join } from 'path'
 
 import dedent from 'dedent'
 import * as R from 'ramda'
@@ -10,6 +10,7 @@ import * as M from '@material-ui/core'
 import * as Lab from '@material-ui/lab'
 
 import { Crumb, copyWithoutSpaces, render as renderCrumbs } from 'components/BreadCrumbs'
+import { detect } from 'components/FileEditor/loader'
 import Message from 'components/Message'
 import Placeholder from 'components/Placeholder'
 import * as Preview from 'components/Preview'
@@ -558,6 +559,17 @@ function FileDisplay({
     [bucket, history, name, path, hashOrTag, urls],
   )
 
+  const isEditable = detect(path) && hashOrTag === 'latest'
+  const handleEdit = React.useCallback(() => {
+    const next = urls.bucketPackageDetail(bucket, name, { action: 'revisePackage' })
+    const editUrl = urls.bucketFile(bucket, join(name, path), {
+      add: true,
+      edit: true,
+      next,
+    })
+    history.push(editUrl)
+  }, [bucket, history, name, path, urls])
+
   const renderProgress = () => (
     // TODO: skeleton placeholder
     <>
@@ -628,6 +640,14 @@ function FileDisplay({
                       lastModified={lastModified}
                       size={size}
                     />
+                    {isEditable && (
+                      <FileView.AdaptiveButtonLayout
+                        className={classes.button}
+                        icon="edit"
+                        label="Edit"
+                        onClick={handleEdit}
+                      />
+                    )}
                     {!!viewModes.modes.length && (
                       <FileView.ViewModeSelector
                         className={classes.button}

diff --git a/catalog/app/containers/Bucket/Summary.js b/catalog/app/containers/Bucket/Summary.js
@@ -77,7 +77,9 @@ function SplitButton({ onClick, children, onChange, options }) {
       </M.ButtonGroup>
       <M.Menu open={!!anchorEl} anchorEl={anchorEl} onClose={() => setAnchorEl(null)}>
         {options.map((option, i) => (
-          <M.MenuItem onClick={handleSelect(i)}>{option}</M.MenuItem>
+          <M.MenuItem key={`${option}_${i}`} onClick={handleSelect(i)}>
+            {option}
+          </M.MenuItem>
         ))}
       </M.Menu>
     </>

diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
@@ -31,6 +31,7 @@
 * [Added] Redirect to last selected Athena workgroup ([#3067](https://github.com/quiltdata/quilt/pull/3067))
 * [Added] `status_reports` lambda ([#2989](https://github.com/quiltdata/quilt/pull/2989))
 * [Added] Stack Status Admin UI: reports ([#3068](https://github.com/quiltdata/quilt/pull/3068))
+* [Added] Edit button for text files in packages ([#3070](https://github.com/quiltdata/quilt/pull/3070))
 * [Fixed] Fix package creation in S3 buckets with SSE-KMS enabled ([#2754](https://github.com/quiltdata/quilt/pull/2754))
 * [Fixed] Fix creation of packages with large (4+ GiB) files ([#2933](https://github.com/quiltdata/quilt/pull/2933))
 * [Fixed] Fix pre-popullation of default dates when using "dateformat" + {"format": "date"} ([3082](https://github.com/quiltdata/quilt/pull/3082))