Skip to main content

15 posts tagged with "Web apps"

View All Tags

Code search: Find code anywhere in your app

You can now search for all code within a Retool app, from resource queries and component properties to preloaded JavaScript and CSS. Code search can instantly search for case or exact word matches, and supports regular expressions for fine-tuned searches.

Visual refresh of the component library

A visually refreshed component library is currently available as an opt-in beta for cloud-hosted organizations. It contains minor style changes to many components, such as:

  • An updated color palette.
  • Changes to the active and hover state appearance for buttons and inputs.
  • Removing borders on input attachments and buttons.
  • Fixing inconsistencies with component spacing, font weight, border radius, etc.
  • A new look for the Tab and Navigation components.

Any style overrides you've made will still be retained.

Click Get started and leave a comment to request access.

Custom URLs for web apps

You can create custom URLs for web apps to make them more discoverable and easier to share with end users. With a custom URL set, end users can access apps at {domain}/app/{custom-url} or {domain}/p/{custom-url} if it's a public app.

Augment any software with Retool Embed and Retool Portals

We're expanding beyond internal tools so you can build nearly any software for your business with Retool.

With this launch, we're adding two new products to help you:

  • Ship a secure, custom portal: Build and host portals for your customers, partners, and vendors fully on Retool with Retool Portals which manages signup, authentication, and permissions out of the box.
  • Augment existing software: Quickly add data and CRUD functionality to an existing app or portal with Retool Embed.

Both Retool Portals and Retool Embed are now available across Business and Enterprise plans.

To learn more about how Embed and Portals are changing the way you can build with Retool, watch the overview video.

You can read integration details in the docs to embed your first Retool app or build an end-to-end portal on Retool.

Table component and Legacy Table component differences

You don't have to upgrade existing apps that use the legacy Table component. You can continue to configure the legacy Table in your existing apps, and then use the new Table component when you have an app to build.

If you want to migrate an existing app to use the new Table component, use this guide to learn more about the differences before migrating.

Column configuration

The new Table no longer supports the Auto column format. Each column must have an explicit format. Each column can contain an optional source key, which maps the column to a field in the data source. If the source key is omitted, the column is effectively a custom column.

Properties

Some commonly used Table properties have been renamed. Anywhere in your app where you reference these properties, you’ll want to update those references to the new property names.

selectedRow

The property to access the Table’s selected row changed from table1.selectedRow.data to table1.selectedRow.

currentRow

currentRow in a column’s mapped values is now currentSourceRow, to make it explicit that it references the underlying source row’s data.

recordUpdates and changeSet

The legacy Table’s edited fields were exposed in recordUpdates and changeSet. These fields are now changesetArray and changesetObject, respectively. These properties no longer contain the entire row’s data, and instead only contain the modified fields.

Pagination controls

Pagination controls are now nested under table1.pagination. This means referencing a table’s pageSize, for example, is done using table1.pagination.pageSize. Pagination is now accessible in the Table’s Add-ons section in the Inspect tab.

Save and cancel buttons

The new Table exposes the built-in save and cancel buttons for bulk editing in the Add-ons section of the Inspect tab.

Sorting controls

The legacy Table exposed several fields to represent the Table’s sorting state: defaultSortDescending, defaultSortByColumn, sortedColumn, sortedDesc. The new Table exposes the sortArray property, which represents the entire sort state of the table.

Filtering controls

The legacy Table did not support nested filtering. The new Table supports nested filters with the filterStack property.

Feature comparison

See below for a feature-by-feature comparison of the legacy Table and the new Table.

Updated approaches to existing features

CategoryFeatureDescription
Column typeAuto columnThe new Table forces explicit column types.
Column typeButton columnThe new Table has redesigned actions for triggering events.
Column typeUser Email columnThe new Table has an Avatar column that serves the same purpose.
Column typeModal columnModal columns are not supported natively in the new Table, but can be implemented by using a Column event handler to trigger a Modal component open.
ActionsAction button columnsThe new Table floats all action buttons to the right edge of the table when you hover over a row.

Legacy features unsupported in the new Table component

CategoryFeatureDescription
Column typeRating columnYou can use a Tag column to represent a rating cell instead.
SortingSort columns by raw valueThe new Table sorts columns by their mapped values.
StylingRow colorRow color is not supported in the new Table.