Skip to content

feat(docs): separate Airbyte connectors and community connectors in sidebar #55820

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Conversation

letiescanciano
Copy link
Contributor

@letiescanciano letiescanciano commented Mar 18, 2025

Closes https://github.com/airbytehq/airbyte-internal-issues/issues/8332

What

This PR creates new items in the docs sidebar to better organize connectors depending on its support level.

Screenshot 2025-05-07 at 08 16 04

How

  • Fetching registry information on pre-build to make sure is available for the sidebar
  • Finding support level information on the registry
  • Grouping connectors by support level
  • Displaying in the sidebar

Can this PR be safely reverted and rolled back?

  • YES 💚
  • NO ❌

Copy link

vercel bot commented Mar 18, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
airbyte-docs ✅ Ready (Inspect) Visit Preview 💬 Add feedback May 8, 2025 8:22am

@letiescanciano
Copy link
Contributor Author

@bnchrch @ian-at-airbyte in case you have a minute to review this :)

Copy link
Contributor

@ian-at-airbyte ian-at-airbyte left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I like this idea, but I am a bit cold on how it's being reflected on the site itself. I'll explain what I mean.

The site architecture implied by the Sidebar is not implied by the breadcrumbs. In this case, the breadcrumbs skip a level between Sources and the connector.

image

The same thing exists with the search results - for example, if you search for Airbtable, its parent section is listed as "Sources, not "Airbyte Connectors" as I would expect.

I think what's happening is that the true site structure is defined by Sidebars.js. Everything else inherits from this. sidebars.js does not have the information about the DocSidebar component to know that this new logic should form part of the site structure. So the sidebar gets updated but nothing that depends on it does.

How possible is it that, instead of swizzling DocSidebar, the functions in sidebars.js can do this work instead? I think that would inform the breadcrumbs and Algolia that they should behave this way as well.

collapsible: true,
collapsed: true,
label:
supportLevel === "certified" ? "Airbyte Connectors" : "Marketplace",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we standardize how we label these? IE we should either use:

"Airbyte" + "Marketplace"
or
"Airbyte Connectors" and "Marketplace Connectors".

@letiescanciano
Copy link
Contributor Author

@ian-at-airbyte thanks for your comment! it makes a lot of sense. I dig deeper on how the breadcrums and algolia search are linked to the sidebar.

…ectors-in-sidebar

* master: (3385 commits)
  fix(Source-Harvest): missing schema for `time_team`, `users`, `time_entries`, `company`, & `project_assignments` streams.  (#59215)
  chore: add `poe_tasks.toml` for all java connectors (#59670)
  ci: add Dockerfile base image definitions, along with sample `.sh` build scripts (#59212)
  Correct Dest SF readme. (#59658)
  ✨ TikTok Marketing Source: By country daily/hourly report streams (#55681)
  source-vitally contribution from aidanlister (#58062)
  Upgrade Gradle to 8.14. (#59662)
  source-awin-advertiser contribution from ryanmcg2203 (#58632)
  🐛 Source asana: add new stream portfolio_items (#59224)
  docs: add pre 1.0 semver exception to breaking changes
  ✨ Source Brevo: fix pagination on contact stream (#59652)
  Load CDK: Pre-Speed Cleanup: Remove CheckpointManager interface/abstract class (#59218)
  Load CDK: Pre-Speed Cleanup: Remove Sync/Stream manager interfaces (#59217)
  Load CDK: Non-functional Cleanup: Remove Launcher Interface/Secondary (#59213)
  fix(live-tests): use first 8 symbols of connection id instead of hashing (#59653)
  ✨feat(source-s3): adjust file record message protocol (#57498)
  feat(source-zendesk-support): new article attachments with file transfer support  (#56419)
  source-mixmax contribution from cbuckle1 (#59160)
  ✨feat(source-google-drive): adjust file record message protocol (#57496)
  Typo fix (#59209)
  ...
@letiescanciano
Copy link
Contributor Author

I like this idea, but I am a bit cold on how it's being reflected on the site itself. I'll explain what I mean.

The site architecture implied by the Sidebar is not implied by the breadcrumbs. In this case, the breadcrumbs skip a level between Sources and the connector.

image The same thing exists with the search results - for example, if you search for Airbtable, its parent section is listed as "Sources, not "Airbyte Connectors" as I would expect.

I think what's happening is that the true site structure is defined by Sidebars.js. Everything else inherits from this. sidebars.js does not have the information about the DocSidebar component to know that this new logic should form part of the site structure. So the sidebar gets updated but nothing that depends on it does.

How possible is it that, instead of swizzling DocSidebar, the functions in sidebars.js can do this work instead? I think that would inform the breadcrumbs and Algolia that they should behave this way as well.

The reason to swizzling DocSidebar was that, in order to divide connectors by support level, I needed to fetch registry information and that couldn't be done directly in sidebar.js. I'll try to create a plugin to handle it

- Add support level categorization for connectors (Airbyte, Marketplace, Enterprise)
- Add prepare-sidebar script to generate connector registry data
- Modify sidebar structure to group connectors by support level
- Update special connector handling to include support level information
- Remove separate enterprise connectors section in favor of support level grouping
- Update support level display names for consistency

This change improves the connector documentation organization by grouping
connectors based on their support level rather than type, making it easier
for users to find connectors based on their support tier.
@letiescanciano
Copy link
Contributor Author

@ian-at-airbyte I was able to build the sidebar with the new structure without swizzling DocSidebar.
Now, the breadcrumbs are following the same structure
Let me know what you think!

@letiescanciano letiescanciano requested review from ian-at-airbyte and removed request for bnchrch May 7, 2025 06:30
@ian-at-airbyte
Copy link
Contributor

ian-at-airbyte commented May 7, 2025

Amazing!

I think we should set collapsed: false, to true so the huge list of connectors isn't visible when the page loads (makes it easier to find the specific one you want).

Would we have to manually generate the connector registry in this case?

@ian-at-airbyte ian-at-airbyte requested a review from matteogp May 7, 2025 21:09
@letiescanciano
Copy link
Contributor Author

letiescanciano commented May 8, 2025

@ian-at-airbyte

Would we have to manually generate the connector registry in this case?

no, it will fetch the registry at build time and create a slim version of it, which the sidebar be built on.

Copy link
Contributor

@ian-at-airbyte ian-at-airbyte left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Brilliant.

@letiescanciano letiescanciano merged commit ad16606 into master May 9, 2025
29 checks passed
@letiescanciano letiescanciano deleted the leti/separate-airbyte-and-marketplace-connectors-in-sidebar branch May 9, 2025 05:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants