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

BACKLOG-23514: fixed language switch not showing #91

Merged
merged 2 commits into from
Jan 14, 2025
Merged

Conversation

GauBen
Copy link
Member

@GauBen GauBen commented Jan 14, 2025

Description

The language switch is back, and won't go offscreen anymore!

image

The language switcher was not showing because bootstrap was not properly loaded.

  • <AddResources> does not trigger an error when not loading a resource
  • The bootstrap.min.js file should not be versioned, it's webpack role to load dependencies from node_modules and move them to dist

...

Tests

The following are included in this PR

  • Unit Tests (Most changes should have unit tests)
  • Integration Tests

Checklist

I have considered the following implications of my change:

  • Security (in particular for changes to authentication, authorization, data fetching, ...)
  • Performance
  • Migration
  • Code maintainability: improved surrounding code

Documentation

  • Inline documentation
  • Internal Documentation (wiki)
  • User-facing Documentation

@GauBen GauBen self-assigned this Jan 14, 2025
@GauBen GauBen requested a review from jkevan January 14, 2025 09:07
@@ -29,7 +17,7 @@ export const MainLayout = ({head, className, children}) => {
{children}
</main>
<HtmlFooter/>
<AddResources type="javascript" resources="bootstrap.bundle.min.js"/>
<AddResources type="javascript" resources={modulePath + '/static/javascript/bootstrap.bundle.min.js'}/>
Copy link
Contributor

@jkevan jkevan Jan 14, 2025

Choose a reason for hiding this comment

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

I think this URL won't be valid in case the webapp is under a context.
To make sure URLs are properly built (context handling, url rewrite if necessary, etc.) we provide a hook:

import {useUrlBuilder} from '@jahia/javascript-modules-library';

export const MainLayout = ({head, className, children}) => {
     const {buildStaticUrl} = useUrlBuilder();
     bootstrapResourceUrl = buildStaticUrl({assetPath: 'javascript/bootstrap.bundle.min.js'});
     return "";
};

The advantage is also that you don't have to manipulate the modulePath and the /static folder on your side.

The hook will be the more appropriate for the usage here, but for more advanced URL building requirement. it's also possible to use directly utility methods like in this example:

import {buildUrl} from '@jahia/javascript-modules-library';
const gqlUrl = buildUrl({value: '/modules/graphql'}, renderContext, currentResource);

(But you will have to manipulate and provide the renderContext and currentResource object)

Copy link
Member Author

Choose a reason for hiding this comment

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

Thanks for the tip, 903e7aa pushed!

@GauBen GauBen merged commit 2ae732d into main Jan 14, 2025
5 checks passed
@GauBen GauBen deleted the BACKLOG-23514 branch January 14, 2025 09:54
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