Merge branch 'master' of github.com:quiltdata/quilt into bucket-admin…

…-link

api/python/quilt3/packages.py

@@ -700,8 +700,14 @@ def walk(self):
             if isinstance(child, PackageEntry):
                 yield name, child
             else:
-                for key, value in child.walk():
-                    yield name + '/' + key, value
+                yield from child._walk(f'{name}/')
+
+    def _walk(self, prefix):
+        for name, child in sorted(self._children.items()):
+            if isinstance(child, PackageEntry):
+                yield f'{prefix}{name}', child
+            else:
+                yield from child._walk(f'{prefix}{name}/')
 
     def _walk_dir_meta(self):
         """

catalog/app/components/JsonEditor/JsonEditor.js

@@ -3,8 +3,8 @@ import * as R from 'ramda'
 import * as React from 'react'
 import * as M from '@material-ui/core'
 
+import { EMPTY_SCHEMA } from 'utils/json-schema'
 import Column from './Column'
-import Errors from './Errors'
 import State from './State'
 
 const useStyles = M.makeStyles((t) => ({
@@ -22,9 +22,6 @@ const useStyles = M.makeStyles((t) => ({
       zIndex: 1,
     },
   },
-  errors: {
-    marginTop: t.spacing(1),
-  },
   inner: {
     display: 'flex',
     maxHeight: t.spacing(42),
@@ -39,8 +36,6 @@ function JsonEditor({
   disabled,
   columns,
   jsonDict,
-  error,
-  errors,
   fieldPath,
   makeAction,
   onChange,
@@ -87,28 +82,26 @@ function JsonEditor({
           }}
         />
       </div>
-
-      <Errors className={classes.errors} errors={error || errors} />
     </div>
   )
 }
 
 export default function JsonEditorStateWrapper({
   className,
   disabled,
-  error,
   onChange,
-  schema,
+  schema: optSchema,
   value,
 }) {
+  const schema = optSchema || EMPTY_SCHEMA
+
   return (
-    <State obj={value} optSchema={schema}>
+    <State obj={value} schema={schema}>
       {(props) => (
         <JsonEditor
           {...{
             className,
             disabled,
-            error,
             onChange,
           }}
           {...props}

catalog/app/components/JsonEditor/State.js

@@ -1,7 +1,6 @@
 import * as R from 'ramda'
 import * as React from 'react'
 
-import { EMPTY_SCHEMA, makeSchemaValidator } from 'utils/json-schema'
 import pipeThru from 'utils/pipeThru'
 
 export const COLUMN_IDS = {
@@ -304,9 +303,7 @@ function removeFieldReducer(removingFieldPath, { data, jsonDict, rootKeys }) {
   }
 }
 
-export default function JsonEditorState({ children, obj, optSchema }) {
-  const schema = optSchema || EMPTY_SCHEMA
-
+export default function JsonEditorState({ children, obj, schema }) {
   // TODO: use function syntax and Ramda currying for setData((prevState) => RamdaCurryFunc(prevState))
 
   // NOTE: data stores actual JSON object
@@ -316,9 +313,6 @@ export default function JsonEditorState({ children, obj, optSchema }) {
   //       `['a', 0, 'b']` means we are focused to `{ a: [ { b: %HERE% }, ... ], ... }`
   const [fieldPath, setFieldPath] = React.useState([])
 
-  // NOTE: list of JSON Schema validation errors
-  const [errors, setErrors] = React.useState([])
-
   // NOTE: incremented sortIndex counter,
   //       it's required to place new fields below existing ones
   const sortCounter = React.useRef(0)
@@ -341,17 +335,14 @@ export default function JsonEditorState({ children, obj, optSchema }) {
     [data, jsonDict, fieldPath, rootKeys],
   )
 
-  const schemaValidator = React.useMemo(() => makeSchemaValidator(schema), [schema])
-
   const changeType = React.useCallback(
     (contextFieldPath, columnId, typeOf) => {
       const value = R.path(contextFieldPath, data)
       const newData = R.assocPath(contextFieldPath, convertType(value, typeOf), data)
       setData(newData)
-      setErrors(schemaValidator(newData))
       return newData
     },
-    [data, schemaValidator],
+    [data],
   )
 
   const makeAction = React.useCallback(
@@ -378,10 +369,9 @@ export default function JsonEditorState({ children, obj, optSchema }) {
       setRootKeys(newState.rootKeys)
       setJsonDict(newState.jsonDict)
       setData(newState.data)
-      setErrors(schemaValidator(newState.data))
       return newState.data
     },
-    [data, schemaValidator, setRootKeys, rootKeys, jsonDict],
+    [data, setRootKeys, rootKeys, jsonDict],
   )
 
   const changeValue = React.useCallback(
@@ -398,7 +388,6 @@ export default function JsonEditorState({ children, obj, optSchema }) {
         setRootKeys(newState.rootKeys)
         setJsonDict(newState.jsonDict)
         setData(newState.data)
-        setErrors(schemaValidator(newState.data))
         return newState.data
       }
 
@@ -411,13 +400,12 @@ export default function JsonEditorState({ children, obj, optSchema }) {
         setRootKeys(newState.rootKeys)
         setJsonDict(newState.jsonDict)
         setData(newState.data)
-        setErrors(schemaValidator(newState.data))
         return newState.data
       }
 
       return data
     },
-    [data, schemaValidator, setJsonDict, jsonDict, setRootKeys, rootKeys],
+    [data, setJsonDict, jsonDict, setRootKeys, rootKeys],
   )
 
   const addRow = React.useCallback(
@@ -446,7 +434,6 @@ export default function JsonEditorState({ children, obj, optSchema }) {
     changeValue,
     columns,
     jsonDict,
-    errors,
     fieldPath,
     makeAction,
     setFieldPath,

catalog/app/containers/Bucket/PackageDialog/MetaInputErrorHelper.js

@@ -0,0 +1,43 @@
+import * as React from 'react'
+import * as M from '@material-ui/core'
+import * as Lab from '@material-ui/lab'
+
+const useStyles = M.makeStyles((t) => ({
+  code: {
+    backgroundColor: t.palette.error.light,
+    border: `1px solid ${t.palette.error.dark}`,
+    borderRadius: '2px',
+    color: t.palette.error.contrastText,
+    marginRight: '6px',
+    padding: '1px 2px',
+  },
+}))
+
+function SingleError({ error }) {
+  const classes = useStyles()
+
+  return (
+    <Lab.Alert severity="error">
+      {error.dataPath && (
+        <>
+          <code className={classes.code}>{error.dataPath}</code>
+        </>
+      )}
+      {error.message}
+    </Lab.Alert>
+  )
+}
+
+export default function ErrorHelper({ className, error }) {
+  if (!error) return null
+
+  return (
+    <div className={className}>
+      {Array.isArray(error) ? (
+        error.map((e) => <SingleError error={e} key={e.dataPath + e.message} />)
+      ) : (
+        <SingleError error={error} />
+      )}
+    </div>
+  )
+}

catalog/app/containers/Bucket/PackageDialog/PackageDialog.js

@@ -19,6 +19,7 @@ import * as validators from 'utils/validators'
 import * as workflows from 'utils/workflows'
 
 import * as requests from '../requests'
+import MetaInputErrorHelper from './MetaInputErrorHelper'
 import SelectWorkflow from './SelectWorkflow'
 
 export const MAX_SIZE = 1000 * 1000 * 1000 // 1GB
@@ -162,16 +163,14 @@ function mkMetaValidator(schema) {
 
     const jsonObjectErr = validators.jsonObject(value.text)
     if (jsonObjectErr) {
-      return value.mode === 'json'
-        ? jsonObjectErr
-        : [{ message: 'Metadata must be a valid JSON object' }]
+      return new Error('Metadata must be a valid JSON object')
     }
 
     if (schema) {
       const obj = value ? parseJSON(value.text) : {}
       const errors = schemaValidator(obj)
       if (!errors.length) return noError
-      return value.mode === 'json' ? 'schema' : errors
+      return errors
     }
 
     return noError
@@ -285,6 +284,9 @@ const useMetaInputStyles = M.makeStyles((t) => ({
     paddingRight: 7,
     paddingTop: 0,
   },
+  errors: {
+    marginTop: t.spacing(1),
+  },
   jsonInput: {
     fontFamily: t.typography.monospace.fontFamily,
     '&::placeholder': {
@@ -351,7 +353,7 @@ export function MetaInput({
   schema,
 }) {
   const classes = useMetaInputStyles()
-  const error = schemaError ? [schemaError] : meta.submitFailed && meta.error
+  const error = schemaError || ((meta.modified || meta.submitFailed) && meta.error)
   const disabled = meta.submitting || meta.submitSucceeded
 
   const parsedValue = React.useMemo(() => {
@@ -452,7 +454,6 @@ export function MetaInput({
       <div {...getRootProps({ className: classes.dropzone })} tabIndex={undefined}>
         {value.mode === 'kv' ? (
           <JsonEditor
-            error={error}
             disabled={disabled}
             value={parsedValue}
             onChange={onJsonEditor}
@@ -465,23 +466,18 @@ export function MetaInput({
             size="small"
             value={value.text}
             onChange={handleTextChange}
-            placeholder="Enter JSON metadata if necessary"
             error={!!error}
-            helperText={
-              !!error &&
-              {
-                jsonObject: 'Metadata must be a valid JSON object',
-                schema: 'Metadata must conform to the schema',
-              }[error]
-            }
             fullWidth
             multiline
+            placeholder="Enter JSON metadata if necessary"
             rowsMax={10}
             InputProps={{ classes: { input: classes.jsonInput } }}
             disabled={disabled}
           />
         )}
 
+        <MetaInputErrorHelper className={classes.errors} error={error} />
+
         {(isDragActive || locked) && (
           <div className={classes.overlay}>
             {isDragActive ? (

catalog/app/containers/Bucket/PackageList.js

@@ -2,7 +2,7 @@ import * as dateFns from 'date-fns'
 import * as R from 'ramda'
 import * as React from 'react'
 import { FormattedRelative, FormattedPlural } from 'react-intl'
-import { useHistory, Link } from 'react-router-dom'
+import { useHistory, Link, Redirect } from 'react-router-dom'
 import * as M from '@material-ui/core'
 import { fade } from '@material-ui/core/styles'
 
@@ -523,6 +523,10 @@ export default function PackageList({
 
                   const pages = Math.ceil(filteredCount / PER_PAGE)
 
+                  if (computedPage > pages) {
+                    return <Redirect to={makePageUrl(pages)} />
+                  }
+
                   return (
                     <>
                       {packagesData.case({