How to create a custom user interface for the Quilt web-based catalog and data packages page(s)

You can easily modify the look and feel of the Quilt data packages web-catalog, by modifying your configuration YAML file located at s3://<bucket-name>/.quilt/catalog/config.yaml.

By default, the following YAML file is used:

ui:
  nav:
    files: True
    packages: True
    queries: True
  actions:
    copyPackage: True
    createPackage: True
    deleteRevision: False
    revisePackage: True
  blocks:
    analytics: True
    browser: True
    code: True
    meta: True
  package_description:
    .*:
      message: True

In order (and as of writing), these are:

• ui.nav.files : False - hide the Files tab
• ui.nav.packages : False - hide Packages tab
• ui.nav.queries : False - hide Queries tab
• ui.actions.copyPackage : False - hide buttons to push packages across buckets
• ui.actions.createPackage : False - hide buttons to create packages via drag-and-drop or from folders in S3
• ui.actions.deleteRevision : True - show buttons to delete package revision
• ui.actions.revisePackage : False - hide the button to revise packages
• ui.blocks.analytics : False - hide Analytics block on file page
• ui.blocks.browser : False - hide files browser on both Bucket and Packages tab
• ui.blocks.code : False - hide Code block with quilt3 code boilerplate
• ui.blocks.meta : False - hide Metadata block on Package page
• ui.sourceBuckets - a dictionary of S3 bucket names that map to an empty object reserved for future enhancements; buckets in this dictionary are the ones offered when the user clicks Revise Package > Add files from Bucket; if the dictionary is not set or is empty the feature "Add files from Bucket" is disabled
• ui.defaultSourceBucket - source bucket from ui.sourceBuckets that is selected by default; if it doesn't match any bucket then it's ignored
• ui.package_description - a dictionary that maps package handle regular expressions or literals to JSONPath expressions of fields to show from package metadata in the package list view. Strings display as paragraphs. Elements of a list display as tags.
• ui.athena.defaultWorkgroup - default workgroup to select on the Athena search page

Here's a simple ui.package.desciption example:

ui:
  packages:
    # match all packages
    .*:
      # show the message
      message: True
      # show the .labels field
      user_meta:
        - $.labels
    # for any package with a handle prefix of foo
    foo/*:
      # JSONPath expressions to the fields to display
      user_meta:
        - $.key1.key2
        - $.key3
        - $.key4[0]

Note the support for one or more regular expressions in the packages namespace - you can have a different user-experience for specific groups of Quilt data packages (the foo/* operator to apply to all packages with the prefix of foo) and also individual Quilt data packages (such as raw, processing and final).

So, you can easily tailor your user experience to be more simple or more detailed depending on the audience or consumers of your Quilt buckets and/or Quilt data packages!

Note that the syntax also supports JSONPath expressions to drill-down to specific values or concatenate various elements in your metadata, allowing you fine-grained control to display specific metadata values that are pertinent to your users and workflows.

Additionally, if you have administrative permissions for your organization, you can change several other pieces of the Catalog user interface:

The following can be modified:

• Theme: logo and background color:

• Link: A custom navigation bar link to your organization:

• Enable beta features: If you wish to be an earlier adopter of beta features, you can move the slider to on. Note - it's not recommended that you apply this to your production environment, only to your staging environment (if you have one).

Official Quilt Data configuration reference documentation