• v1.4.19July 18, 2025

v1.4.19July 18, 2025

AI Week Day 5 – New Homepage

Our new homepage, and a Launch Week template.

As we wrap up our first AI Week, we have two more (smaller) announcements to make.

New Home

Firstly, our new homepage — simpler, less flashy, and with an interactive playground in the hero. So visitors can get a feel of how BaseHub works without even logging in.

Check it out: basehub.com/home

Launch Week Template

Secondly, we're open sourcing our AI Week Template, so you can use it in your next launch week! It's a beautiful little site, simple and neat, with a couple of details that make it shine:

  • Countdown

  • Newsletter

  • All managed from BaseHub

Deploy it with one click: basehub.com/basehub/launch-week

Wrapping Up

This week was packed!

  • Day 1: MCP — Connect to your content repository from any MCP-compatible client.

  • Day 2: @START — An AI teammate that understands your content.

  • Day 3: AI Workflows — Simple content automations.

  • Day 4: Agents — Build a team of Agents tailored to your content needs.

Thank you for tuning in to our first ever AI Week. See you in the next one 🫡

  • v1.4.18July 17, 2025

v1.4.18July 17, 2025

AI Week Day 4 – Agents

You already know START, now with custom prompts you can create your own START and integrate it to your app.

We're excited to introduce Custom Agent support, giving you the flexibility to create AI agents tailored to your specific workflows and use cases.

Create Multiple AI Agents

You can now create multiple AI agents in BaseHub—each with their own custom system prompt, tool access, and permissions. Whether you need a documentation bot for your users, a marketing assistant for consistent brand voice, or a research agent with read-only access, you're in full control.

Key capabilities:

  • Create agents from scratch with unique names and purposes

  • Fine-tune system prompts to match exact voice, tone, or behavior

  • Control tool access (web search, file editing, workflow triggers)

  • Set specific permission levels (read-only, full access, or custom combinations)

  • Customize visual appearance with avatars and colors for external use

Enhanced START Agent

Your existing START agent now becomes fully customizable. Modify its system prompt and adjust tool permissions while maintaining full BaseHub integration.

Multi-Platform Integration

Deploy your agents where you work:

  • Comments: Tag agents with contextual awareness of the conversation thread

  • Embeds: Add agents directly to your product with a simple code snippet

  • Slack: Connect agents to your team's Slack workspace

  • Workflows: Assign specialized agents to different automated workflows

Getting Started

All BaseHub users can access the new Agents tab to create and customize AI agents. Custom Agents are currently available in free beta with full access to all features.

For detailed setup guides, integration examples, and step-by-step instructions, check out our Agents documentation.

We can't wait to see the specialized agents you'll create and how they'll transform your content operations.

  • v1.4.17July 16, 2025

v1.4.17July 16, 2025

AI Week Day 3 – Workflow Block Overhaul

Automate your content with AI Actions

Workflow Block: Now with AI Superpowers

We’ve enhanced the Workflow Block with two powerful AI-driven capabilities that let you automate content flows end-to-end.

AI Autofill

Automatically populate related content blocks when specific fields change. For instance, update a product description and let AI Autofill generate meta descriptions, social media captions, or related items—while staying true to your voice.

AI Apply Variant

Generate content variants across documents, useful for:

  • Localization — translate content while preserving intent.

  • A/B testing — generate multiple content versions to test messaging.

  • Tone variation — adapt for formal, casual, or technical audiences.

You can assign specific agents to these tasks, letting different AI personas handle different content modes.

  • v1.4.16July 15, 2025

v1.4.16July 15, 2025

AI Week Day 2 – @START

Meet START, an AI teammate that understands your content.

Meet Your New Teammate

@START is an AI assistant that deeply understands your BaseHub repository structure. Unlike generic AI tools, START can analyze your schema, content relationships, and block configurations to provide contextually relevant suggestions and make intelligent content changes.

With START, you can:

  • Get content suggestions based on your existing repository structure

  • Receive schema recommendations tailored to your specific content needs

  • Generate content that maintains consistency with your existing style and structure

You can interact with START in two main ways: through the launcher or by tagging it in comments.

Using the Launcher

Find the launcher top right, in the header; or open it with a shortcut: ⌘S.

Tagging @START in a Comment

Just like you can tag any teammate, you can also tag START and ask it anything related to that block.

WIP: Image and File Support

Image and file understanding capabilities are currently in development! With this, START will be a good fit for running content migrations, or creating schemas based on UI screenshots. Stay tuned!

Pricing

START is available now to all BaseHub users, and is free during our Beta period. You can expect a tokens-based pricing scheme, and a model selector to balance cost/performance.

  • v1.4.15July 14, 2025

v1.4.15July 14, 2025

AI Week Day 1 – BaseHub MCP

You can now connect you BaseHub repositories with your everyday AI tools like Cursor and Claude.

Starting today, every BaseHub Repo gets an MCP Server, enabling seamless integration with AI tools like Cursor and Claude.

Available tools

You can now give your AI agent access to:

  • query_content: Fetch content from your project

  • commit: Save changes with version control

  • create/update/delete_blocks: Modify your structure on the fly

  • get_repo_structure: Understand your project’s layout

And more—giving the AI full context to make meaningful, accurate updates. You can check the full list on our docs.

This launch is part of the AI Week. Follow the releases in https://ai.basehub.com.

  • v1.4.14June 17, 2025

v1.4.14June 17, 2025

BaseHub SDK v9

This new SDK version is a big refactor on how the underlying GraphQL client works.

Read the upgrade guide in our docs: https://docs.basehub.com/api-reference/javascript-sdk/release-notes/version-9.

pnpm i basehub@latest

v9 doesn’t introduce too many new features nor breaking changes, but it does fundamentally change how types are generated. Critically, the basehub SDK can now work without a “generation step”, and the generation step now only augments the SDK with type information.

This seems subtle, but fixes many bugs related to basehub not being able to resolve. For context, before v9, running basehub dev or basehub build was required for the runtime to get its graphql client. The generation step created the SDK, plus the types. Now, the client is “static” in the sense that’s ready to use once installed, and the generation step is just there for optional typesafety. Additionally, this typesafety works with TypeScript’s declaration merging, which means no more “Restart TS server” to make types work again.

Reasoning

While this version might seem subtle, it allows the library to run in environments that don’t have a build step (or acess to Node.js for a CLI to run). Environments like v0 or Bolt.

BaseHub can now run flawlessly in v0, which means… templates are coming.

  • v1.4.13April 28, 2025

v1.4.13April 28, 2025

Media Block: Any asset, one block

We merged media blocks into one more powerful and flexible block that comes up with an asset explorer.

We received plenty of feedback asking for a unified way to handle media assets. We listened, and we're excited to introduce our new Media Block that consolidates images, videos, audio, and files into a single, powerful solution.

Key Features

  • One block for all media types - Replaces previous separate Image, Video, Audio, and File blocks

  • Asset Explorer - Easily browse and reuse media from anywhere in your repository

  • Custom MIME type support - Add and use file types not supported by default

  • Simplified workflow - No more complex structures based on reference blocks or collections

How It Works

The new Media Block replaces our previous separate Image, Video, Audio, and File blocks with a single, more powerful solution. When you add a Media Block, you can limit which file formats are allowed, similarly to how it worked with the previous blocks, except that now it discriminates formats by categories (image, video, audio and file).

Asset Explorer

The Asset Explorer gives you a gallery view of all media in your repository, including filters and a search input, making it easy to find and reuse existing assets.

Supported File Types

Out of the box, the Media Block supports common formats like images (JPG, PNG, GIF, WebP, SVG), videos (MP4, WebM), audio files (MP3, WAV, OGG), and documents (PDF, DOCX, etc.). But the real power comes from the ability to add custom MIME types to support virtually any media format your project requires.

Learn more

You can also check out the updated documentation to learn how to query the new MediaBlock Union via GraphQL. Try out the new Media Block and let us know what you think!

  • v1.4.12April 13, 2025

v1.4.12April 13, 2025

Improved History Panel: Time Travel Through Your Content

Seamlessly browse, compare, and restore previous versions with our enhanced history navigation

The History panel is where you see your commit history in BaseHub. We've completely revamped it to give you more control and visibility into how your content has evolved over time.

Filter Your Commit History

Previously, the History panel was a simple chronological list of commits. Now, you can filter commits based on who made them and when they were created.

Filter through commits by date range, or by author.

Looking for changes made by a specific team member? Just select their name from the author filter. Need to find commits from last week? Use the date range picker to narrow down your search. This makes it much easier to find exactly what you're looking for, especially in repositories with extensive commit histories.

Time Travel Through Your Repository

One of the most powerful new features is the ability to navigate your repository at any point in time. Select any commit from your history, and you'll see exactly how your repository looked at that moment.

This is incredibly useful for:

  • Understanding how your content has evolved

  • Reviewing changes before making further edits

  • Training new team members on your content structure

  • Troubleshooting issues by comparing different versions

Restore Previous States

Found an older version of a block that you prefer? Now you can easily restore it. When viewing a historical version of your repository, you can select any block and restore it to that previous state.

Click "Recover" and you're good to go.

This means no more digging through commit histories trying to manually recreate previous content. With just a few clicks, you can bring back exactly what you need.

Getting Started

The new History panel is available now. To try it out:

  1. Navigate to the History tab in your repository

  2. Use the filters to find specific commits

  3. Click on any commit to view your repository at that point in time

  4. Explore your historical content and restore blocks as needed

We're excited to see how this improved History panel helps you manage your content more effectively. Let us know what you think!

  • v1.4.11April 4, 2025

v1.4.11April 4, 2025

Variants UX Overhaul

We hear you, we revisited the Variants set workflow and improved the overall experience when setting variants through the dashboard.

Setting variants for layout blocks and each of its descendants manually was counter-intuitive and a bit annoying to be honest. But we didn’t want to loose the possibility of carefully chose which blocks should be affected by variants and which will only have a global value. So we join all configs together in an improved popover where you can set up all document’s children easily with a few clicks.

BeforeAfter (improved UX)

  • v1.4.10March 26, 2025

v1.4.10March 26, 2025

Block Milestones

Track your blocks' history, contributions and partially commit your content safely with our improved version control.

Commits are fundamental to BaseHub's workflow, supporting publications, repository changes, and branching. However, tracking individual block changes has been challenging. Block Milestones address this by providing detailed change tracking across commits, branches, and work in progress (WIP).

Milestone Navigation

The new "History" tab in block properties offers a comprehensive view of block changes. Users can filter changes by date ranges and authors for precise historical insights.

The History tab, in the right-hand side of each block's panel.

Staging and Commits Improvements

We've refined the changes and commit experience with several key updates:

  • Discriminated Staged List: Clear separation between commit-ready changes and ongoing work.

  • Partial Discard: Improved flexibility in managing content changes.

  • Contributor Tracking: Enhanced visibility into collaborative work, helping teams understand who made specific modifications.

These updates streamline content management and provide more granular control over your project's development. Available today on your dashboard.

  • v1.4.9February 10, 2025

v1.4.9February 10, 2025

Icon Block

Skip the SVG uploads—render icons from BaseHub blocks directly as React components.

Until now, the only method to host icons or logos in BaseHub has been through image blocks and <img /> elements in your application. This approach presents several limitations:

  • The inability to customize icon colors makes the solution impractical for scenarios requiring dynamic color schemes, such as dark/light theme switching.

  • SVG animations cannot be implemented due to the absence of rendered paths, rects, and other vector elements.

  • The editing workflow in the BaseHub dashboard is awkward, requiring multiple steps (downloading SVGs, optimizing them, and uploading them to BaseHub).

  • Preview functionality is limited, particularly when detailed inspection through zooming is needed.

The new icon block simplifies the process of working with vectors in BaseHub. It enables seamless rendering of SVG elements in the DOM, offering a more efficient approach compared to traditional image blocks and <img> tags.

Implement this feature using the new Icon component from our SDK.

pnpm add basehub@latest

Here's an example demonstrating how to render this block in your React application:

import { Icon } from 'basehub/react-svg'
import { Pump } from 'basehub/react-pump'

export const SocialLinks = () => {
  return (
    <Pump
      queries={[\
        {\
          links: {\
            items: {\
              _id: true,\
              icon: true,\
              label: true,\
              href: true,\
            },\
          },\
        },\
      ]}
    >
      {async ([{ links }]) => {
        'use server'

return links.items.map((socialLink) => {
          return (
            <a key={socialLink._id} href={socialLink.href} target="_blank" rel="noopener noreferer">
              <Icon
                content={socialLink.icon}
                components={{
                  svg: (props) => (
                    <svg
                      {...props}
                      style={{
                        color: '#000',
                        width: 32,
                        height: 32,
                        marginLeft: 8,
                      }}
                    />
                  ),
                }}
              />
            </a>
          )
        })
      }}
    </Pump>
  )
}

The components prop enables customization of rendered elements within an SVG. This feature is particularly useful for implementing dynamic styling or animating inner paths, for example.

Icon block input

  • v1.4.8January 8, 2025

v1.4.8January 8, 2025

Collect, Track, Automate

Two new blocks that will help you create forms, analytics, webhooks, and internal notifications, all built around simple primitives.

Today we’re releasing two new blocks: Event and Workflow.

Event Block

Inspired by our previous Analytics offering, we're introducing a more powerful “Event” Block. It comes with two layouts that adapt to your needs: a table layout for complex data structures and a time-series layout.

The table layout excels at showcasing detailed event information with customizable columns and filtering options. The time-series layout enables trend analysis across different time ranges, perfect for metrics and reporting.

For developers, we've rebuilt the event functions from the ground up. The new sendEvent, updateEvent, and getEvents are fully type-safe and work seamlessly with the Event Block’s schema.

Read our docs and jump right in, or keep reading to see some demos!

Workflow Block

Collecting and reviewing data is nice, but what can we do with all this data? This is a question we asked ourselves while designing the Event Block, and that’s why we built the Workflow Block. The workflow block, as its name implies, is designed to automate different actions inside your repo. V1 launches with essential triggers:

  1. New commits,

  2. Collection updates (row create/update/delete), and

  3. Event submissions.

When any of these happen, you can send a webhook to a server you own, or an internal notification. Each combination of trigger + action opens up new automation possibilities: from simple “contact us” forms, to fully functional newsletter subscriptions, workflows will help you enhance your repository's capabilities.

Read more about the Workflow Block in our Docs.

basehub SDK v8

These new Blocks require the new version of our SDK:

pnpm i basehub@latest

Take a look at the release notes when upgrading.

Demos Please!

Let’s get to the fun part. These are longer-than-usual demos, but we truly hope you enjoy them.

Demo #1: “Feedback” Form

This first demo goes over everything needed to start working with Forms in BaseHub. It covers: creating the Event Block, hooking it up with the Next.js App, as well as listening for new submissions and posting them to a Discord Channel via a Workflow Block.

Demo #2: “Newsletter” Form

This one shows off how, via the same simple primitives, you can create a fully featured newsletter in your website. It features a Resend integration!

Demo #3: View Counter

A much simpler demo showing a view counter in julianbenegas.com ( source).

Demo #4: Form Builder

Powerful (but short) demo showing off a programmatic form builder in our Marketing Website Template.

Closing Thoughts

With this release, we hope to have conveyed our commitment to creating powerful primitives that, when paired together, can enable more functionality than they seem to on their own. See you in the next one!

  • v1.4.7October 31, 2024

v1.4.7October 31, 2024

Undo Redo

Undo/redo will give you more confidence to experiment, knowing that you can safely go right back.

Our editor now has undo/redo! This means that, if you make a silly mistake, like deleting a component you didn’t intend to delete, you can now undo the operation and keep going.

Some curious features of our implementation

  • The undo/redo stack is serializable, which means it’ll resist page refreshes. The state is stored in sessionStorage.

  • The undo/redo stack is repo wide, which means as you move through different places in the dashboard, you’ll be able to undo/redo operations you did anywhere.

So, what took us so long?

This was quite challenging to implement. Our data model is highly dynamic, as it allows different block types, relationships, constraints, etc… and different ways you can edit these: the slash command, pressing “Enter” to create a new block, editing constraints via the properties panel, the context menu, etc.

Concretely, there were three main challenges we had to figure out to make this a successful project:

  1. Block dependencies: Blocks such as the Reference Block can target other blocks, such as Instance Blocks. Now, when an Instance Block gets deleted, it also gets removed from Reference Blocks that are targeting it—we call this a “side effect”. When the user undoes the original operation, all side effects should be undone as well. There are more side effects like this one, and we needed to handle these correctly.

  2. Tabs, and focus states: Because you can take action against a Block from different places—for example, you could edit the title via the properties panel or via the editor—when you undo an operation, we need to take you back to where the operation was performed before undoing it, to prevent confusion.

  3. Make it play nicely with yjs’ Undo Manager: Our Rich Text Block uses yjs to enable collaboration. Yjs has an internal Undo Manager which wasn’t easy to replace. In fact, we decided not to replace it, but rather, include it in our global undo manager in a clever way.

With these three things sorted out, it was downhill from there.

  • v1.4.6October 3, 2024

v1.4.6October 3, 2024

Light Mode, Help Text, and Inline Constraints

Three quality-of-life updates to keep improving the editing experience.

Light mode is now available in BaseHub. You can update your preferred color scheme in the user dropdown (top right), picking between System, Light, or Dark.

We finally did it! You'll see much better in bright environments.

Help text

Use help text to provide instant context about the purpose of your blocks.

Inline Constraints

Field constraints are now visible directly in the editor. You can see specific requirements for each field while editing, such as character limits, field required or other applied constraints. This leads to smoother content creation with no surprises when you try to commit your changes.

  • v1.4.5October 1, 2024

v1.4.5October 1, 2024

Copy and Paste between Repos

Streamline your workflow: effortlessly copy and paste across teams and repos within BaseHub.

Oftentimes, developers build the same schemas over and over again: blogs, documentation, programmatic pages, etc. This will make their lives easier. You can now copy any block from any repository and paste it wherever you want.

When pasting complex structures, you might encounter a document named “Support Blocks Wrapper” next to your copied block, this document contains all necessary data for the block to work. It usually contains components that are referenced or template components in use.

Kitchen Sink Template

We've built a template with common patterns that you can copy into your repo. Check it out right now: https://basehub.com/basehub/kitchen-sink.

It contains common structures that we often use to build with BaseHub. Apart from that, we added some more complex structures that can inspire you to build more custom solutions, these includes a multi-language blog, programmatic pages and more.

Working on a localized website? “Variants” are being developed right now, so you might want to wait before taking an example from the Kitchen Sink. If it serves as inspiration, then great!

  • v1.4.4September 4, 2024

v1.4.4September 4, 2024

Collection Block Revamp

This update makes the collection block much more powerful.

We’ve just revamped our Collection Block, introducing new functionalities designed to improve its editing experience, presentation and user experience.

1. Multiple Views

You can now create and manage various presentations of the same dataset within a single Collection Block. This enables tailoring the display of content to different contexts or audiences without duplicating data.

A single collection can now have as many views as desired, each offering a singular perspective on its content.

Navigate through views or create new ones using the switcher

2. Layout Options

We have introduced three distinct layout options to cater to different content presentation needs.

You can switch between them in your collection’s block properties panel.

  • Table: Provides a structured format ideal for comparative data, displaying information in rows and columns.

Built on top of Glide Data Grid (shoutout to this great library for helping us get this feature out quickly).

  • Gallery: Optimized for visual content. Displays collection items as cards, featuring a thumbnail (image or video) alongside the rest of its content. This layout is ideal for showcasing entries with eye-catching previews.

  • Inline: Offers a concise, space-efficient layout that displays items side-by-side with key text information, suitable for compact lists or quick overviews.

Table / Inline / Gallery

3. Sorting and Filtering

Sorting and filtering capabilities were added as a way to organize data within each view. Users can now customize how information is arranged and displayed, tailoring it to specific needs or preferences. Here's what you can do:

  • Sorting: Arrange items based on any field in ascending or descending order.

  • Filtering: Create custom filters to show only the data that meets specific criteria. This allows you to focus on relevant information and hide the rest.

  • View-specific settings: Each view can have its own unique combination of sorting and filtering rules. This means you can create multiple perspectives on the same data set without altering the underlying information.

Manage sort and filtering methods per view.

4. Inline Editing

The Table View layout allows for inline editing of most fields directly in the table, eliminating the need to open separate documents for individual rows. This enhances speed, particularly when making frequent updates by providing a more seamless editing experience.

5. Bulk Uploads

You can now drag & drop assets into your collection while using the Table View. This allows you to quickly create and upload files for multiple entries all at once, reducing the time and effort required for data entry. Bulk uploads is especially useful for initial setups or periodic updates where multiple entries need to be added simultaneously.

Upload assets by dropping them into your table

  • v1.4.3August 5, 2024

v1.4.3August 5, 2024

AI Commit Suggestions (Alpha)

Get BaseHub AI to write commit messages for you.

Commit messages are essential for tracking changes and understanding the history of your Repository.

However, we recognize that content editors often find it cumbersome to create concise yet descriptive commit messages during the thick of writing a piece. AI Commit Suggestions steps in by offering simple messages that summarize your changes.

This feature is in Alpha. If you have any feedback, feel free to reach out via X or Discord.

  • v1.4.2July 19, 2024

v1.4.2July 19, 2024

Collaboration cursors and follow mode

We recognized the need for a more immersive collaboration experience, so we implemented live cursors and activity tracking in your editor.

Since last week you can already work with others more seamlessly in the BaseHub editor, knowing with more precision what each member is doing, and with the possibility of following them, specially useful while having a peer working session.

To follow someone working in the current repo simply click on its avatar on the top right and a pill with the following status will appear at the bottom. To stop following you can click again their avatar, click the stop button or rather navigate to a different tab in the dashboard.

  • v1.4.1June 24, 2024

v1.4.1June 24, 2024

All about Images!

Image resizing and optimization, ThumbHash, and , this changelog is all about images.

You can now request resized images from our GraphQL API.

query Example {
    homepage {
      heroImage {
        url(width: 500, quality: 70)
      }
    }
}

Or via URL:

https://assets.basehub.com/2fa958b2/mBV9NVWPK632ZKmv9lffA/image.png?width=500

Photo by Patrick Konior on Unsplash.

There are actually a bunch of options to use. We use Cloudflare to handle this, and you can check their docs to see all of the options you have available.

Component for Next.js

A thin wrapper on top of Next.js’ <Image /> Component. Really, it’s literally just this:

import Image, { ImageProps } from 'next/image'

const basehubImageLoader = () => {...}

export const BaseHubImage = (props: ImageProps) => {
    return <Image {...props} loader={basehubImageLoader} />;
};

And you can use it like this:

import BaseHubImage from "basehub/next-image"

const Home = async () => {
    return (
      <BaseHubImage
        src="https://assets.basehub.com/2fa958b2/mBV9NVWPK632ZKmv9lffA/image.png"
        width={846}
        height={564}
      />
    )
}

export default Home

We built this because most developers don’t want to query our GraphQL API to get images in different sizes and formats and whatnot: they want their framework to do that work. So, <BaseHubImage /> is the same as Next.js’ but uses BaseHub’s Image Pipeline directly instead of using Next.js as the middleman.

Although this is not something you should worry much about, if you plan on having many, many images, Next.js’ own image optimization might get resource intensive—and we’re already doing that optimization for you.

ThumbHash and Blur Data URL

ThumbHash, created by Evan Wallace, is a library for creating “a very compact representation of an image placeholder”. Well, you can now get a thumbhash for every image you upload into BaseHub.

query Example {
    blogPosts {
      items {
        coverImage {
          url
          thumbhash
          blurDataURL
        }
      }
    }
}

Keep in mind, in order to render the thumbhash in the browser, you’ll need to decode it using the thumbhash package, or a library like unlazy.

To save you from the hassle of decoding the thumbhash, you can also get the blurDataURL directly from our GraphQL API, which will be ready for use as an ’s src.

When to use one vs the other? thumbhash is more lightweight (30 bytes) than blurDataURL (400 bytes), so if you want to save some KB (say you’re loading hundreds of images), then you might prefer to use thumbhash. Else, you’ll probably be better off with blurDataURL.

Moreover, when using thumbhash, you’ll need to decode the string yourself in the client side, which might not be what you want. Typical use cases for using the raw thumbhash are when rendering hundreds of images in the same view, such as on an image gallery.

Putting it all together, your list of blog posts can render like this:

import { Pump } from "basehub/react-pump"
import { BaseHubImage } from "basehub/next-image"

const BlogPage = async () => {
    return (
      <Pump
        queries={[\
          {\
            blogPosts: {\
              items: {\
                _id: true,\
                coverImage: {\
                  url: true,\
                  blurDataURL: true,\
                  alt: true,\
                },\
              },\
            },\
          },\
        ]}
      >
        {async ([data]) => {
          "use server"

return (
            <div>
              {data.blogPosts.items.map((post) => {
                return (
                  <div key={post._id}>
                    <BaseHubImage
                      src={post.coverImage.url}
                      placeholder="blur"
                      blurDataURL={post.coverImage.blurDataURL}
                      alt={post.coverImage.alt ?? ""}
                      width={624}
                      height={220}
                    />
                  </div>
                )
              })}
            </div>
          )
        }}
      </Pump>
    )
}

export default BlogPage

This example is compatible with Next.js’ recommendation for placeholders.

  • v1.4.0June 17, 2024

v1.4.0June 17, 2024

BaseHub Templates, Search, Analytics, and OG Image Block

We've packed a lot of changes in this release. We hope you love them!

BaseHub Templates

Production ready websites—powered by Next.js and BaseHub. Fully customizable, high performing, beautiful templates to choose from:

We truly believe developers will get a big head start when starting with one of these, and they’ll also be able to extend and adapt them to their own needs.

BaseHub Analytics V1

Analytics, right next to your content.

We introduced a lightweight analytics feature right next to your BaseHub blocks. It's easy to set up: simply obtain the _analyticsKey from the block where you want to store the events, pass it along with the custom event name to the sendEvent SDK function, and that's it! The triggered events will then be automatically displayed in the Analytics tab adjacent to your content. Read more in our docs.

Dashboard experience

The events are listed based on the last one updated. You can filter them out or select a different time range. Every event showcases its total count alongside a historical graph. If you hover any point on the graphs, you will start to see the data belonging to that timestamp in particular.

Easy code setup

We provide two simple functions for analytics sendEvent and getEventCount. You can learn how to use them in our docs.

BaseHub Search

Index your content with one click, setup the Search components from our SDK, commit and see the search results appear on your screen.

Working on the new BaseHub templates, we found out we needed to setup search for our documentation. We have already skipped that setup for our last docs version because of the time that it takes to integrate a third-party service for search. We didn’t want to pass through that again. So we decided to provide a search engine from BaseHub.

Setup

This engine features automatic indexing and a handful of React components for easy setup. It can be scoped to an entire repository or just one collection of articles. You decide which blocks become exposed to the search client. Read our docs to learn how to set it up in your app.

React Components

We provide a few components that help you leverage the frontend functionality for your site search. And the best part: it comes with keyboard navigation and match highlighting out-of-the-box! You can check out all Search components in the API Reference.

Special shoutout to TypeSense, without which this integration wouldn’t have been possible.

OG Image Block

The OG Image block introduces a powerful in-app, yet lightweight, editor that lets you create your own social cards based on your content.

A special block for creating your custom OG images, based on layers and variables that come from your blocks content.

A common use case is setting the OG for your blog articles for example. You design the image once, and then BaseHub automatically populates the variables based on the specific content in each article.

Story

When Santiago Galán, a BaseHub user, showed us the product he was working on we instantly knew this was a game changer for OG Image editing. SharePreviews is an amazing open-source OG Image editor. We wanted that inside BaseHub, as BaseHub is already the place where content lives. If we could pair dynamic BaseHub content with the OG Image editor, we’d be golden.

So that’s exactly what we did. We collaborate closely with Santiago to build and ship the new OG Image editor within BaseHub. This now powers OG Images throughout our docs and our help center, and we can’t wait to see the beautiful images you’ll create.

  • v1.3.0May 30, 2024

v1.3.0May 30, 2024

Choose What to Commit

“Choose What to Commit” enables content editors to pick and choose which changes they want to commit.

In the Changes tab, you’ll now see checkboxes to pick the changes you want to include in your commit. You can decide this on a per-block basis.

This is another big step into making the content editing workflow more robust and powerful.

  • v1.2.0May 29, 2024

v1.2.0May 29, 2024

Improvements to Our SDK

With --watch mode, improved fragmenting, and more, our SDK is growing stronger than ever.

See how all of these improvements work together—sound on

--watch mode

When watch mode is enabled, the SDK automatically updates the generated code in real-time based on the schema changes made in the BaseHub editor.

These are the recommended package.json scripts for a Next.js App:

{
    "scripts": {
      "dev": "basehub dev & next dev",
      "build": "basehub && next build",
      ...
    },
}

basehub dev automatically runs --watch mode for you to simplify the process.

Fragments

Until now, making fragments with the BaseHub SDK was cumbersome. It required managing multiple generated types for each component and using satisfies for type enforcement from the schema into an object.

However, with the introduction of the new fragmentOn function, generating fragments is now effortless, without needing to know the import name, just start typing the Component’s apiName and the autocomplete takes care of the rest. In the second parameter you can set the fragment object safely typed.

// all the imports you need!
import { fragmentOn } from "basehub"

const CalloutFragment = fragmentOn("CalloutComponent", {
    _title: true,
    _id: true,
    type: true,
    content: {
      html: true,
    },
})

export type Callout = fragmentOn.infer<typeof CalloutFragment>

Type-safe Select Blocks

Type safety is a core tenant of our DX. Until today, Select Blocks were typed as a regular string, which meant developers couldn’t actually know what they’d receive. Because Select Blocks are constrained to specific values in the BaseHub dash, one would expect to receive a union of string literals back… So that’s exactly what you’ll get now.

If you constrain a Select Block to “primary“ or “secondary” in the BaseHub dash, you’ll get “primary“ | “secondary” in your IDE.

Get Started

To get started with these new changes, install the latest version of the SDK:

pnpm i basehub@latest
  • v1.1.4May 6, 2024

v1.1.4May 6, 2024

Edit Only Mode: Safely Modify Your Content

Enable this feature to restrict editing capabilities, safeguarding your project's schema while allowing content modifications.

Edit mode is based on the restrictions to the Editor role we introduced some time ago – you can read more about it on this changelog. This mode ensures you can update content without the risk of altering the underlying schema. Features such as constraints application, block removal, and reordering are disabled, allowing you to concentrate exclusively on content refinement.

  • v1.1.3April 29, 2024

v1.1.3April 29, 2024

A Command Palette for Faster Repository Navigation

Move faster than ever with our brand new ⌘P menu.

Take our brand new command palette for a spin by pressing ⌘ + P.

Like many things we do at BaseHub, the design and experience of this ⌘P was inspired by VSCode. Ideally, it feels as snappy!

  • v1.1.2April 17, 2024

v1.1.2April 17, 2024

Rich Text Improvements

Solved the most frustraiting part of WYSIWYG editors, plus added formatting constraints.

We’ve pushed two improvements to our Rich Text Block.

  1. Added an indicator to marks that tells you if you’re editing inside or outside of it.

  2. Added a way to enable/disable specific formatting.

Mark Indicators

Note: “mark” refers to formatting that’s applied on characters, such as making something bold, or italic, or having inline code.

One of the most frustrating parts of WYSIWYG editors is the way marks work. Let’s say you have something marked as bold. Then, to go back and add something right before it, you’ll need to struggle with your editor sometimes adding the text inside of the mark (marking it as bold), or vice versa. This is how it works in Slack:

The whole thing is unpredictable and hard to explain, but we’ve all experienced it.

We had this same issue in our own Rich Text editor, and we simply couldn’t live with it. This is how you edit marks now:

Allowed Formatting

Before this update, editors could apply any type of formatting to Rich Text Blocks. Headings, lists, images, videos, etc… were all available, always.

We heard from developers that sometimes it’s very useful to limit which formatting can be applied, so the rendering stays consistent. For example, you may want to limit blog posts’ contents to not support H1, and only support H2 and H3. Or you may not want to support tables, or videos. You get the idea!

Now, you can do so within the Rich Text’s properties panel.

  • v1.1.1April 10, 2024

v1.1.1April 10, 2024

Editor Layout Redesign

The new editor layout sets the foundational stone for new screens and features. Let's see what it bring as of today.

The new README works as an initial screen to quickly see and edit useful info about the repository. You might noticed the old “Connect” page is embedded here now. We also have the possibility to edit the repository’s title and description, all in one place. The README is a special tab that functions as empty-state, wiki and quick kick off of the project simultaneously.

The new sidebar navigation involves some renaming of sections:

  • Explore

Previously “Content”, where your work in progress leaves, here you can access all your repo blocks and edit them.

  • Changes

Previously “Commit”, where you can see the diff between your WIP and the last commit tree.

  • History

Previously “Commits”, where you can access the full list of past commits since the beginning of the repo.

Tabs are now persisted between Explore, Changes, and History, which means you can have an open tab for a piece you’re editing, a tab showing the diff, and also a tab showing a previous commit, all in the same context.

Before

After

Overall, this redesign gives us a lot more space for adding new features without cluttering the UI. The header is now cleaner and well suited for our upcoming Branching selector, and the left sidebar has a lot of space for new panels.

  • v1.1.0April 5, 2024

v1.1.0April 5, 2024

New Roles for Team Members

You can now set Editor and Viewer roles for your team members, plus limit access per repository.

Last week, we introduced some major role management updates that advocate for a comfortable experience when leading with large teams.

New role types: Editor and Viewer

In addition to the already known "Owner" and "Member" roles, we've introduced new role types aimed at addressing previously overlooked use cases. These four roles prioritize simplicity and ease of use in both UI design and tool functionality for every scenario. After all, why burden someone who simply needs to change copy with a needlessly complex user interface? It's important to ensure that editors and non-technical individuals don't alter the schema.

  • Owner

Has access to everything inside this repo. Can invite, grant or remove roles. Can edit, create, remove blocks and their properties. Anything that can be done in BaseHub, the Owner has the permissions to do it.

  • Member

Can edit, create, remove blocks and their properties. Can create and delete repositories. The highest role apart from the Owner, is the most versatile, without incurring in team management nor billing settings.

  • Editor

Can edit blocks and content; can add new collection instances. Think of it as a copywriter / marketer, they can add a post entry, or update a subtitle, or change an image, but they won’t be able to delete documents, or create new blocks that would change the API schema.

  • Viewer

Can view all the content, including hidden values and members settings. This is a less crucial role, but think of it as a guest that could check everything looks good, without needing to worry about modifying anything by accident.

Limit access to specific repositories

Wanted to invite a new editor to the team but don’t want to share non-related repos? No need to worry, we have you covered now.

  • v1.0.4March 6, 2024

v1.0.4March 6, 2024

Pump, and a New Preview Workflow

Introducing , and our newly revamped Preview Workflow.

Pump is a React Server Component that enables a Fast Refresh-like experience for your content. When draft === true, Pump will subscribe to changes in real time from your Repo, and so keep your UI up-to-date. This is ideal for previewing content before pushing it to production. When draft === false, Pump will hit the Query API directly, without any production impact whatsoever. You can use it like this:

import { Pump } from "basehub/react-pump"
import { draftMode } from "next/headers"

const Page = async () => {
    return (
      <Pump
        next={{ revalidate: 30 }}
        draft={draftMode().isEnabled}
        queries={[{ __typename: true }]}
      >
        {async ([data]) => {
          "use server"
          return <pre>{JSON.stringify(data, null, 2)}</pre>
        }}
      </Pump>
    )
}

export default Page

Read more about Pump on our docs.

Additionally, we’ve revamped our Preview Workflow, adding a new “Preview” configuration and button. This will help developers configure Preview URLs for content editors to check out their content before publishing.

Read more about the new Preview Workflow in our docs.

  • v1.0.3February 26, 2024

v1.0.3February 26, 2024

Code Blocks inside the Rich Text Editor Are Now Syntax Highlighted

Plus, you can format JS/TS code using Prettier.

We’ve revamped code blocks inside the rich text editor to include syntax highlighting for common languages. We’ve also worked on a quality-of-life improvement: code formatting. We know that writing a code example for your website can be tedious, so we hope these two improvements make your life easier.

  • v1.0.2February 23, 2024

v1.0.2February 23, 2024

Improved Keyboard Navigation

Interact with your editor faster by using your keyboard.

In addition to the existing keyboard shortcuts, we have introduced several new keyboard navigation features to further enhance your experience while writing content. These features allow you to quickly and efficiently perform actions on your blocks without the need for a mouse.

  • You can now use the arrow keys, specifically the up and down arrows, to effortlessly navigate through your documents. This makes it easier to move between different sections or documents without having to manually scroll.

  • To toggle block focus, simply press Enter or Escape. This allows you to easily switch between blocks and focus on the specific one you want to edit or modify.

  • Deleting a block has never been easier with the introduction of the Cmd + Del shortcut. This allows you to quickly remove a block from your document without the need for multiple clicks or menu options.

  • To copy a block, press Cmd + C, and to paste it somewhere else, use Cmd + V. This makes it effortless to duplicate content or move it to a different section within your document.

  • Lastly, you can also cut a block by using the Cmd + X shortcut. This removes the block from its current position and allows you to paste it elsewhere, providing a seamless editing experience.

Copy-paste in between two repos is not currently supported, but in the roadmap!

With these improved keyboard navigation features, we aim to make the process of writing and editing content even more efficient and user-friendly.

  • v1.0.1January 30, 2024

v1.0.1January 30, 2024

Webhooks

We've added webhooks to BaseHub, starting with the Commit event. We're planning on adding more events soon.

Webhooks allow you to receive event notifications from BaseHub. BaseHub will send a POST request to a URL you specify when certain events happen in a BaseHub Repository.

BaseHub processes webhooks with Svix. The Svix integration was easy-peasy to set up, yet another example of great DX.

The only supported webhook right now is repo.commit. This is a useful notification that can help you set up on-demand revalidation for your Next.js Apps, amongst other things. Another common use case is search indexing: imagine you want to set up an Algolia integration, where you get content from BaseHub and index it into Algolia—at commit time is a great time to do so.

On the roadmap: We’re working on automatically indexing your content, thus supporting Search functionality via our API out-of-the-box. Stay tuned!

We’re working on adding more events into the mix, so stay tuned.

  • v1.0.0January 24, 2024

v1.0.0January 24, 2024

Public Beta

BaseHub is now open for everyone.

After a long and useful Alpha Phase, we’re now entering Beta. BaseHub is now reliable enough to support production workloads, although, as we move through our Beta, we’ll be monitoring how our infrastructure scales, we’ll work thorough potential bugs that may arise, and we’ll make progress on our roadmap. We’ll work hard towards General Availability.

As part of our Public Beta Launch, we're releasing the Diff View, our official Docs, and our Pricing Plans. Let’s go over these announcements.

Diff View

The Diff View is a powerful way to see all the changes you've made across your whole Repo, so you can Commit them with confidence.

Give it a try, and please let us know if you have any feedback for it.

Docs

We shipped our Docs, one place in which you can get to know the Platform. We'll work hard to explain concepts in a simple manner, and add guides and examples for you to connect BaseHub to popular web frameworks. You can check out our guide for connecting to Next.js to get a hang of how our DX is!

Billing

We've built the Billing infrastructure that will let us provide the service sustainably. Now Teams can pay for BaseHub, and our pricing plans are as it follows:

  • Personal Account, starts completely for free, and includes:

  • One user, you

  • Discord Support

  • AI Assistant

  • 375 Blocks , then $2.5 per 125

  • 75k API Requests , then $2.5 per 25k

    • Team, starts at $29, and includes:

  • Unlimited users—bring your whole team to BaseHub

  • Discord + Email Priority Support

  • AI Assistant

  • 500 Blocks , then $2.5 per 125

  • 100k API Requests , then $2.5 per 25k

Alpha Users

We’re beyond greatful for our Alpha Users. They provided us with valuable feedback and bug reports, and they’ve seen how we’re constantly improving BaseHub, one day at a time. Because of that, Alpha Users will be able to use BaseHub completely for free until 23 May, 2024. If you’re an Alpha User and you’re worried about this date or our pricing, don’t hesitate to reach out.

  • v0.3.1January 9, 2024

v0.3.1January 9, 2024

Discard Changes

Discard working changes if you've made a mistake.

If you’ve made edits by mistake, you can now "discard all changes" to revert the working state back to the state it was at the latest commit.

Additionally, we’re working hard on building a brand new Diff UI that will help you see exactly the changes you’re about to commit. These are important steps that align with our vision for Open Content. Diffing, reverting, branching… are all on our radar. Stay tuned!

  • v0.3.0December 12, 2023

v0.3.0December 12, 2023

Instantiate Components inside Rich Text Blocks

Often times, we’ll find ourselves wanting to render a Tweet in the body of our blog posts, or a callout, or any other thing specific to our website’s content needs that isn’t strictly formatting. Well, with this addition, now we can! Let’s see how.

Enabling custom components

To get started, we need to configure our rich text block to support a component. In this example, we'll create a Tweet component and configure it to be instantiated within the body of our blog posts.

Once we've created our Tweet component, we’ll select our rich text block and check “Tweet” in the “Allowed component types“ constraint. This will expose it in our rich text’s slash command.

Now, we can do /tweet to add a Tweet right in the body of our post. Additionally, we can use a custom component to “mark” a piece of text (like we do so when we make it bold or italic), available via the bubble menu. This is useful for adding custom popovers or tooltips to specific pieces of text.

Render them with the <RichText /> component

To render our custom components, we'll use <RichText />. We’ll install basehub via NPM, and import { RichText } from 'basehub/react'. This component is designed to facilitate the rendering of rich text data. It's straightforward to use and works well with TypeScript.

This is a small example of how we’ll use it alongside the amazing react-tweet to render static tweets:

import { notFound } from "next/navigate"
import { basehub } from "basehub";
import { RichText } from "basehub/react";
import { Tweet } from "react-tweet";

export default async function BlogPost({ slug }) {
    const { blog } = await basehub({ next: { revalidate: 60 } }).query({
      blog: {
        posts: {
          items: {
            __args: { first: 1, __sys_slug: { eq: slug } },
            _title: true,
            body: {
              json: {
                content: true,
                blocks: {
                  on_TweetComponent: {
                    __typename: true,
                    _id: true,
                    url: true,
                  },
                },
              },
            },
          },
        },
      },
    });
    const [entry] = blog.posts.items;
    if (!entry) return notFound();

return (
      <main>
        <h1>{entry._title}</h1>
        <RichText
          blocks={entry.body.json.blocks}
          components={{
            TweetComponent: ({ url }) => {
              return <Tweet id={new URL(u).pathname.split("/").pop()} />;
            },
          }}
        >
          {entry.body.json.content}
        </RichText>
      </main>
    );
}

The body of the component fetches the data with basehub, and the return uses <RichText /> to render the data. Via components, we pass our custom renderers. It’s important to send through the blocks prop so that <RichText /> can match the references to the custom blocks.

This is just a quick overview of what you can do with custom blocks inside rich text. Expect more examples soon, as we ramp up our marketing and documentation efforts.

Oh, and by the way, we hope you enjoy our new Changelog!

  • v0.2.3November 20, 2023

v0.2.3November 20, 2023

Hidden Blocks

A deeper dive on how we've solved "work in progress" in BaseHub.

A great feature of BaseHub is that stuff gets committed all at once, creating a snapshot of your repository at that point in time. We haven’t yet seen released the full implications of that git-like workflow, but it will allow you to:

  1. See everything you’re about to commit, and choose what goes in or what gets restored to its previous state.

  2. See past changes across your whole repository, or across a single document, and revert if you made a mistake.

  3. Create branches to work on new stuff without affecting production.

  4. And a lot more.

Now, one inconvenience that “committing everything together“ brought, was that you would struggle to create “work in progress” content, cause you were obliged to commit it, and therefore expose it to the API. Not only that: if you are rigorous with your constraints (which you should), you’d get a bunch of “is required” errors when attempting to commit, and you’d be forced to either lower the constraints, or enter in dummy data.

That’s why we created the “hidden” state. A hidden block will not be exposed via API, and will skip commit validation. You can hide a block via the properties panel, or via the sidebar. You can only hide documents, components, and instances; and nested components/instances inherit hidden state from its parent for convenience.

This is not the same as the “draft/published” workflow that other systems offer. Our “hidden“ state is something that needs to be committed, meaning, everything that gets committed passes the validation you’ve set up, always. The fact that, in other systems, publishing is controlled per-entry makes it easy for users to enter an incorrect state. If you’ve started with loose constraints and at some point decided to tighten them up, then you may have fields that are “required” but that return null from the API. While this might seem like a small thing, this means that their GraphQL APIs can never be sure if a required field will actually return content, therefore struggling to be strict with their types, and therefore making developers be really careful with every piece of data they get from the CMS. This is no good.

In BaseHub, we know that if something has been committed, and is required, then it absolutely has a value. We type it accordingly, and developers can work with types that make more sense.

Additionally, content creators can have their “work in progress” in their CMS, instead of just doing data entry once it’s done.

This was a deeper dive on how some features that might seem similar, were actually thought of from first principles, and an ode to the git philosophy and its ever-evolving implications. As always, let us know what you think on Discord, or on X.

  • v0.2.2October 19, 2023

v0.2.2October 19, 2023

Multiplayer Presence, API Improvements, and more

We’ve been busy these couple weeks, and we've packed a lot of new stuff with this update.

Multiplayer Presence

BaseHub's been real-time from the start, but now, you'll see presence indicators ala Figma when someone is working with you in the same repository.

We're working on more Sharing features, such as inviting read-only Guests to facilitate getting feedback on your content!

"Wrap in collection"

You now can right-click a block and "Wrap in collection" to create a collection and place that block inside of it. For example, say you have an "Author" Component which you instantiate a couple of times, but now you realize you want to order them in a single Collection. Now, with just a couple of clicks, you can do so easily!

API Improvements

We've made several infrastructure improvements to our Delivery API, making it faster and more reliable. We're committed to keep lowering those milliseconds.

"Select" Block

The new "Select" Block let's you define a constrained set of options and choose one (or multiple) from those. It also looks great! Try it out with /select.

AI Structure Generation Improvements

We've dramatically improved our structure generation, making it much more helpful than it was before. It now generates better structures, and adds placeholder to it. Try it out with a prompt like "a landing page about Lionel Messi".

Quality of life improvements

  • We now display the Collection's Template component in the sidebar, so navigation is clearer.

  • We've added support for Tables inside the Rich Text Block.

  • We've made sure we don't expire the generic Team Invite Link, so you can invite all your coworkers with just one link.

  • We've added the functionality to "re-roll" your API Key, just in case it gets compromised.

  • v0.2.1September 26, 2023

v0.2.1September 26, 2023

Repository Transfer

And some quality of life improvements.

A common CMS workflow starts with you creating a Repository in your Personal Account; then, as it grows, you might need to create a Team and invite your coworkers; by then, you might want to transfer that repo from your Personal Account to your Team: well, now you can! And with zero downtime.

Quality of life improvements

  • You can now "Add block below" in your editor.

  • We've added Tab reordering + Tab closing context menu.

  • We've added an option to open the Rich Text Block in a new tab: useful for editing large pieces of content.

  • You can now collapse the sidebar for a full editor experience.

  • We're making our API faster.

  • We've added feedback collectors to the Text Al Assistant to continuously improve our generation.

  • v0.2.0September 11, 2023

v0.2.0September 11, 2023

Introducing Teams

Collaborate with your coworkers on content, in real time.

Bring your team together

We've shipped Teams, so now you'll be able to collaborate with your coworkers on content, in real time. Look for the Team Switcher in the Header (top right) in order to create one!

Note: Teams are free during Alpha, as we figure out pricing, but we'll probably charge for them in the future. Rest assured, we'll never charge you for something before notifying directly to you.

More stuff:

  • Blog Template. We scaffolded a quick new Blog template. Look for it in while creating a new Repository.

  • We'll be working on Multiplayer Presence UI.

  • We're prioritizing a feature for transferring repositories from one team to the other, so you'll be able to start on your personal account, and upgrade if/when needed.

  • Docs are still in the works; hang in there!

  • v0.1.0September 4, 2023

v0.1.0September 4, 2023

Welcome to our Changelog

This is the first issue of our Changelog, where we'll announce new changes to the BaseHub platform.

API Auto Slugs

Now you get an automatic _slug field for each block, with guaranteed uniqueness at the nesting level its in. You can always create your own "Slug" Block (text block with regex validation), but this is a great alternative to take into account when creating UI for a Blog, or similar.

// _slug is another key in your Block:
basehub().query({
    posts: {
      items: {
        _slug: true,
        ...moreFields
      }
    }
})

Onboarding Template

Our brand new Onboarding template brings new users right into "The BaseHub Way", by teaching the basics of BaseHub. Check it out when creating a new repository!

Note: to build the onboarding template, we had to build a new "template engine" which is the first step into creating more templates in the future.

Text AI Generation

We've launched a new popover to generate text. For now, it supports text fields only, but we'll work on generating Images, and improving the suggestions overall.

More stuff

  • We've started working on Docs.

  • We're really close to shipping Teams + Multiplayer.