Skip to content
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

DOP-5093: make tabs selectors interactive on offline builds #1325

Merged
merged 6 commits into from
Dec 12, 2024
Merged

Conversation

seungpark
Copy link
Collaborator

@seungpark seungpark commented Dec 11, 2024

Stories/Links:

DOP-5093

Staging Links:

Link to download sample HTML

Another page on cloud docs with tabs selectors

The full bundle can be located in this S3 path . Each html file could be downloaded and inspected to see that tabs selectors are working

Regression check to verify tabs selectors have no regression without the OFFLINE_DOCS flag

Notes:

This PR makes tab selectors work in offline docs, by making a custom menu dropdown (similar to the Select menu dropdown) and a script to enable the UI/UX

  • No default tab selection is made (nor stored into local storage)
  • No icon is shown next to selection
  • The tabs selectors should be tested in offline mode - meaning download the HTML and open in a browser. Opening the above pages as a served page will result in viewing both the offline UI and the Gatsby build JS

README updates

    • This PR introduces changes that should be reflected in the README, and I have made those updates.
    • This PR does not introduce changes that should be reflected in the README

Copy link

netlify bot commented Dec 11, 2024

Deploy Preview for docs-frontend-dotcomprd ready!

Name Link
🔨 Latest commit c063d62
🔍 Latest deploy log https://app.netlify.com/sites/docs-frontend-dotcomprd/deploys/675b378bb49453000863d2ae
😎 Deploy Preview https://deploy-preview-1325--docs-frontend-dotcomprd.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Dec 11, 2024

Deploy Preview for docs-frontend-stg ready!

Name Link
🔨 Latest commit c063d62
🔍 Latest deploy log https://app.netlify.com/sites/docs-frontend-stg/deploys/675b378b32c0b7000802e519
😎 Deploy Preview https://deploy-preview-1325--docs-frontend-stg.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@@ -4,7 +4,8 @@ const { siteMetadata } = require('../site-metadata');

const GATSBY_IMAGE_EXTENSIONS = ['webp', 'png', 'avif'];

const needsImageOptimization = ['dotcomprd', 'dotcomstg'].includes(siteMetadata.snootyEnv);
const needsImageOptimization =
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

minor change to prevent image optimization from offline builds. will put in a separate PR if preferred!

@seungpark seungpark marked this pull request as ready for review December 12, 2024 14:59
Copy link
Collaborator

@mmeigs mmeigs left a comment

Choose a reason for hiding this comment

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

LGTM

src/utils/head-scripts/offline-ui/index.js Outdated Show resolved Hide resolved
src/components/Select.js Outdated Show resolved Hide resolved
@seungpark seungpark merged commit 1357b26 into main Dec 12, 2024
10 checks passed
@seungpark seungpark deleted the DOP-5093 branch December 12, 2024 20:55
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