Changelog

New:

• Exposed .ping() method on the Interval class instance for performing health checks.

New:

• The ctx loading API (ctx.loading.start, ctx.loading.update, and ctx.loading.completeOne) are now available in Page handlers.
• It is now possible to display asynchronous data values in io.display.metadata.

v1.1.0 of our TypeScript and Python SDKs adds more customization options for content in tables. Markdown is now supported in table cells, and you can use the new highlightColor prop to add color accents to individual cells. We also upgraded tables to support dynamic column widths, so table columns will automatically resize to fit their contents and fit more of your data on screen.

You'll find expanded Markdown support in other places, too, like the helpText prop on all components that support it. (Expanded Markdown support does not require an SDK upgrade.)

We've also improved redirect behavior in Pages and Actions, and we added a global onError handler that's perfect for logging or reporting to error services like Sentry. See the full v1.1.0 changelog for everything that's changed.

Other updates & improvements​

• The 'Go back' button in transactions now receives keyboard focus when tabbing through options.
• We added a missing confirmation message after verifying your email address.
• You can now switch between your organizations using the Cmd+K menu.
• We removed log messages about missing columns when a table is empty.
• You can now add Interval to your home screen on iOS and Android with a nice app icon and support for minimal-ui mode.
• We fixed sticky table headers not working on some pages.
• We removed double scrollbars in some places if your system uses persistent scrollbars.

New:

• Added ctx.redirect() support to Page handlers.
• Added replace property to ctx.redirect() to replace the current entry in the user's history stack, like history.replaceState.
• Added highlightColor property to io.display.table and io.select.table's renderCell method to highlight a cell's background and text colors.
• Added a global onError callback to the Interval constructor, perfect for logging or reporting to error services.
• Page handlers can now return undefined or None to conditionally opt out of custom layouts and fall back to rendering the default index.
• Markdown is now supported in io.display.table and io.select.table cells and in any input IO methods' helpText properties.

Fixed:

• Improved retry and timeout behavior, preventing large payloads from saturating connection to Interval.
• Fixed issues with Pages showing up in the dashboard sidebar in some cases when they shouldn't.
• Fixed .validate() calls when chained after .withChoices() calls.

Breaking changes:

• The ctx.environment property now shows the specific environment that the Action or Page is running in, instead of just "live" or "development".

New:

• Added withChoices() chained method to io.group and other IO methods to allow for customizing the "Continue" buttons to enable branching logic and more advanced workflows. See Submit buttons for more information.
• Added support for ECMAScript Modules (ESM) when using file-based routing with routesDirectory with Node.js.

Fixed:

• The ctx.action.url property and Interval client startup message now display the correct URL for custom environments.
• Fixed an issue with the dashboard sidebar not showing up for some Page configurations.

Breaking changes:

• The .close() method in the Interval class has been renamed to .immediatelyClose() for clarity.
• The interval.actions.enqueue() and interval.actions.dequeue() methods have been moved to simply interval.enqueue() and interval.dequeue() respectively.
• The title property in ctx.loading.start and ctx.loading.update has been renamed to label for consistency.
• The title property in the return type of io.display.grid renderItem function has been renamed to label for consistency.

New:

• Added support for a preview UI that preserves action context across IO method calls and removes the need to "Continue" for display-only informational renders. Please let us know if you would like to test this feature before general availability!
• Added the .safelyClose() method to Interval to safely shut down a deployment without losing work or interrupting users.
• The defaultValue property for all supported IO methods now also accept null in addition to undefined.
• Added copy and download buttons to io.display.code, io.display.object, and code blocks in io.display.markdown.
• Added inline IDE documentation to IO methods.

Fixed:

• Fixed an issue with some userland errors not being surfaced in Pages.
• Many small fixes and UI improvements!

New:

• Added the .multiple() chained method to io.search and io.input.file, which allows accepting multiple values in a single input.
• Added optional defaultValue property to io.search.

Fixed:

• Fixed a phantom import which caused issues in some non-hoisting package managers like pnpm.

v0.36.0 of our Node SDK was our final release of 2022 and it includes a handful of features you requested - including a new I/O method: io.display.grid for displaying collections of data like photos, cover art, and more.

This method includes settings for column width, image crop, aspect ratio, linking, and per-item dropdown menus. If you're currently using io.display.table for content with images (videos, blog posts, etc.) this might be a better fit for you!

Code-based permissions​

For users on our Teams plan and higher, you can now grant team-level access to actions and pages directly from within your app's code. If you're using Pages, permissions set at the page level will also apply to actions and pages nested within that page. Visit the docs to see how you can define permissions in code.

Interval Direct Connect​

Connections between your app and your users' browsers are currently relayed through Interval, but soon we'll be removing this relay step to create a direct connection under the hood between your app and your users. We're still finalizing benchmarks, but the early results from our internal testing indicate that this will be the single biggest upgrade to the performance of Interval apps so far. 🚀

This new functionality is currently in private beta. If you'd like to try the Direct Connect beta, let us know and we'll enable it for your account.

Other updates & improvements​

• We've added isFilterable and isSortable props to io.display.table and io.select.table for disabling filtering and sorting if desired — this is particularly useful for tables with asynchronous data.
• We've added a new "quiet" setting to the options for logLevel in the Interval client to reduce terminal console logging.
• We're now catching and showing more errors in the dashboard UI to help you debug your code when something isn't working properly.
• The string shorthand for columns and accessorKey values in io.display.table and io.select.table are now type checked against your input data.
• Errors in asynchronous method state change handlers like io.display.table's getData function are now properly displayed in both the host terminal console and the web dashboard.
• We've fixed a bug where secondary navigation links didn't link to the correct environment in non-production environments.
• We've made it easier to copy your Personal Development Key from the empty state in Dev mode.
• New users can now be pre-assigned to teams when inviting them to your organization.
• You can now switch plans directly from the billing screen in your dashboard.
• We've adjusted the font size in io.display.markdown to better match the rest of the dashboard.
• Images are now supported in the dropdowns for io.select.single and io.search with multiple size options.

New:

• Added io.display.grid method for visually focused collections of data, usually with an emphasis on images.
• Added isFilterable and isSortable props to io.display.table and io.select.table for disabling filtering and sorting if desired — this can be useful for tables with asynchronous data.
• Added quiet logging level to the Interval client to reduce terminal console logging, enable by adding logLevel: "quiet" property to the Interval constructor.
• The string shorthand for columns and accessorKey values in io.display.table and io.select.table are now type checked against your input data. Rest assured knowing that your columns are defined in your data!

Fixed:

• Errors in asynchronous method state change handlers like io.display.table's getData function are now properly displayed in both the host terminal console and the web dashboard (#19).

New:

• Pages, a lightweight way to display data to complement actions, are now in public beta!
• Introducing Interval Direct Connect! In all previous Interval versions connections between your app and your users' browsers are relayed through Interval. We're removing this relay step, allowing for a direct connection under the hood between your app and your users. We're still finalizing benchmarks, but the early results from our internal testing indicate that this will be the single biggest upgrade to the performance of Interval apps so far. This new functionality is currently in private beta. If you'd like to try the Direct Connect beta, let us know and we'll enable it for your account.

Breaking changes:

• When you update your SDK version, you'll no longer be able to set permissions for your actions through the dashboard. Instead, you can now define them directly in your code. Any permissions you previously set through the dashboard will continue to function normally.

New:

• Permissions for actions can now be defined in code.

Breaking changes:

• The io.experimental.input.file method has been promoted to io.input.file.

New:

• Added optional image property support to io.select.single's options and io.search's renderResult output, which allows customizing the image's size and alt tag (replaces the now-deprecated imageUrl property).

Fixed:

• Fixed an issue with io.search methods inside of an io.group sometimes throwing an error.

We're big fans of file based routing here at Interval, having used frameworks like Next.js and Remix in many of our own projects. With file based routing, adding new pages or actions to your app is as simple as creating a file and exporting some code from it. Your application perfectly mirrors your app's structure on the filesystem and you don't have to manually import code each time you want to add a page or an action.

Today, we're excited to bring file based routing to Interval as an experimental feature.

As you'd expect, Interval will recursively walk directories and detect your app's structure from the filesystem. To add actions and pages, just create a file with a default Action or Page export and Interval will handle the rest. Then, initializing your app is as easy as using the new routesDirectory property:

import Interval from '@interval/sdk/dist/experimental'
import path from 'path'

const interval = new Interval({
  apiKey: '<YOUR API KEY>',
  routesDirectory: path.resolve(__dirname, 'routes'),
})

interval.listen()

We've been using this internally and it very quickly replaced inline definitions as our go-to method for building apps with Interval.

For more, check out the file routing API docs.

Custom environment colors​

By popular request, we've added a more prominent bar across the top of the screen to help you differentiate between development and production environments, along with several color options to choose from.

Last week we shipped v0.32 of our Node.js SDK which includes two updates to our display components — both of which are excellent companions to our new Routing API.

First, there's a new io.display.metadata component for displaying a series of label/value data pairs in your choice of list, grid, and card layouts.

Second, we've made io.display.heading more powerful with some new props:

• Level for setting the header size
• Description for adding context to a section
• Menu items for adding contextual buttons alongside the header

To show off these updates, here's a demo of an app that pulls in data for artists and tracks from the Spotify API:

Join our Discord community​

We've just launched our brand new community Discord where anyone can ask questions, submit feedback, share what you're building, and chat with our team. Stop by and say hello!

New:

• Added new io.display.metadata method for displaying a series of label/value data pairs in several available layouts.
• Added new level, description and menuItems properties to io.display.heading.

Today we're excited to announce the rollout of a brand new look for your Interval dashboard! Your actions will continue to look and function as they always have, but we've made a few noticeable changes to the surrounding chrome - and many more changes under the hood - to make your apps even more powerful and to pave the way for some big API updates.

The first thing you'll notice is that most of the Interval chrome is gone. Settings are now located in a single menu in the top right corner, allowing your app to take over the entire screen.

We've also replaced the "Actions" and "Develop" menu items with environments named "Production" and "Development". Functionally, nothing has changed - Development is scoped to your personal Interval account, while Production is shared with the whole team - but we've found these labels to be more recognizable to new users. And if you're using custom environments, they'll appear in the same menu.

And finally, there's a brand new navigation bar across the top. We're handing the keys for that over to you with the new Router API.

Router API​

While actions are the bread and butter of building with Interval, powerful internal tools may call for more sophisticated UIs and structure, such as dashboards, list and resource views, and hierarchical navigation.

Interval's Router API lets you build these more powerful features within your Interval app.

With the Router API you can:

• Define top-level navigation within your organization's Interval dashboard
• Group related actions to provide better structure and easier navigation
• Create pages and list views with custom content for your team to be used as a launching point for other actions

The new dashboard was designed specifically for this new API, so we'd love for you to try it out. To get started, reply to this email, and we'll enable access for your account.

Note: Names and functionality of Router API methods are very likely to change.

Check out the docs to learn more about the new routing APIs.

Other bugfixes & improvements​

• We shipped io.confirmIdentity in SDK v0.30.0, allowing you to programmatically prompt for 2FA verification inside high stakes actions with a single line of code. (demo))
• We added io.display.code to display code with syntax highlighting and a copy button inside your pages and actions.
• io.group now accepts keyed objects, making it easier to grab a subset of keys from the response object.
• Actions can now be marked as unlisted. You can still link to them from other actions, but they won't otherwise appear in the UI.
• primary, secondary, and danger are available as button themes beginning with SDK v0.31.0.
• Invitations are now sent automatically when adding new users to your organization, simplifying the process to a single step.
• We fixed action links in dropdown menus so you can Cmd/Ctrl-click to open them in a new tab.
• Pages and transactions now reload when search params change.
• Group descriptions are now displayed in the UI.
• We made the language more helpful when your app connects with an invalid or missing API key.
• We improved the empty state for groups and pages without actions.
• We now alert you to errors in your code in more places in the dashboard.
• We fixed some loading errors encountered while switching between organizations and environments.
• We improved access to nested pages and actions from the Cmd/Ctrl+K menu.

New:

• The columns object in io.display.table and io.select.table now accept an accessorKey property, allowing renaming column names with shorthand key-based access instead of needing to specify a renderCell callback.
• The io.display.table method now accepts an optional getData property for fetching table data asynchronously in advanced use cases.

New:

• The io.group method now accepts objects with string keys as its first argument, allowing return value retrieval by key instead of index.
• Adds io.confirmIdentity method to request re-authentication before performing sensitive work within actions.

New:

• Adds new io.display.code method to render source code with syntax highlighting.
• Cells in io.select.table and io.display.table can now contain inline images by returning an object containing an image property from the renderCell method.

Until today, all Interval actions have had the same blue 'Continue' button at the bottom of each form, resulting in suboptimal UX (and also some interesting workarounds!) in some cases.

Starting with our v0.27 of our Node SDK, you can now customize the label of that button, and change its color for additional caution, via io.group.

New image & video I/O methods​

We've added two new I/O methods to Interval: io.display.image and io.display.video. Both methods have multiple size options to choose from and support displaying media from a URL or a Buffer (which pairs nicely with our file upload API).

Other bugfixes & improvements​

• Tables with large amounts of data are now faster thanks to progressively fetching new data in the background.
• Tables now display the total number of records in the UI and have larger previous/next buttons.
• Transaction pages feature a new header with larger titles and breadcrumbs that makes navigating around your app feel more cohesive.