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

feat(preview-middleware): introduce new flp homepage #2967

Draft
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

ui5red
Copy link

@ui5red ui5red commented Feb 27, 2025

  • Add new FLP homepage based on the sap.cux.home library controls
    • Toggle via boolean property flp.newHomePage (false by default)
  • Update fallback UI5 version from 1.121.0 to 1.123.0
    • Ensure compatibility by loading original FLP homepage when using UI5 versions < 1.123.0

Screenshot:
image

Copy link

changeset-bot bot commented Feb 27, 2025

🦋 Changeset detected

Latest commit: f2bd7f3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
Name Type
@sap-ux/preview-middleware Patch
@sap-ux-private/preview-middleware-client Patch
@sap-ux/create Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link

cla-assistant bot commented Feb 27, 2025

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
You have signed the CLA already but the status is still pending? Let us recheck it.

@heimwege
Copy link
Contributor

@ui5red maybe we need to increase the timeouts in case the integration tests keep failing in the changed setup. I re-triggered them. Let's see 🤞🏻

Copy link
Contributor

@heimwege heimwege left a comment

Choose a reason for hiding this comment

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

See comments. Looks already very good 👍🏻
I just have some minor findings, some questions and some points that need clarification. Did not yet test just had a look at the code. Test will follow 🐱

}
},
"sap.ui5": {
"flexEnabled": true,
Copy link
Contributor

Choose a reason for hiding this comment

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

Not sure if flexEnabled makes sense for the preview 🤔

"minUI5Version": "${sap.ui5.dist.version}",
"libs": {
"sap.ui.core": {
"lazy": false
Copy link
Contributor

Choose a reason for hiding this comment

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

Why disable lazy loading? Isn't sap.ui.core anyway loaded via the ui5 bootstrap?

"lazy": false
},
"sap.cux.home": {
"lazy": false
Copy link
Contributor

Choose a reason for hiding this comment

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

Same here: Why do we disable lazy loading?

let scenario: string = '';
const ui5VersionInfo = await getUi5Version();
// Register RTA if configured
if (flex) {
const flexSettings = JSON.parse(flex) as FlexSettings;
scenario = flexSettings.scenario;
container.attachRendererCreatedEvent(async function () {
const triggerAdaptation = async function () {
Copy link
Contributor

Choose a reason for hiding this comment

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

For the sake of clean code and reducing cognitive complexity could we maybe have this as a separate function on root level instead of an nested function property?

@@ -24,6 +24,7 @@ When this middleware is used together with the `reload-middleware`, then the ord
| `flp.apps` | `array` | `undefined` | Optional additional local apps that are available in local Fiori launchpad |
| `flp.libs` | `boolean` | `undefined` | Optional flag to add a generic script fetching the paths of used libraries not available in UI5. To disable set it to `false`, if not set, then the project is checked for a `load-reuse-libs` script and if available the libraries are fetched as well. |
| `flp.theme` | `string` | `undefined` | Optional flag for setting the UI5 Theme. |
| `flp.newHomePage` | `boolean` | `undefined` | Optional flag for enabling new FLP Homepage. |
Copy link
Contributor

Choose a reason for hiding this comment

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

I'm not quite sure about the naming of this property as new* will become old* over time. Isn't there a unique name for this concept? Or just something like useHomePage?

Comment on lines +149 to +164
vizConfig: {
'sap.app': {
title: string;
subTitle: string;
};
'sap.flp': {
target: {
appId: string;
inboundId: string;
parameters: {
name: string;
value: string;
}[];
};
};
};
Copy link
Contributor

Choose a reason for hiding this comment

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

I'd suggest to define the type like this:

    vizConfig: {
        sap: {    
            app: {
                title: string;
                subTitle: string;
            };
            flp': {
                target: {
                    appId: string;
                    inboundId: string;
                    parameters: {
                        name: string;
                        value: string;
                    }[];
                };
            };
        }
    };

also for FLPApp

"SAP_BASIS_PG_UI_MYHOME": {
"identification": {
"id": "SAP_BASIS_PG_UI_MYHOME",
"title": "My Home"
Copy link
Contributor

Choose a reason for hiding this comment

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

Do we need i18n for this?

"sections": {
"homeAppsSection": {
"id": "homeAppsSection",
"title": "Recently Added Apps",
Copy link
Contributor

Choose a reason for hiding this comment

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

Do we need i18n for this?

"homeCatalog": {
"identification": {
"id": "homeCatalog",
"title": "Homepage Apps"
Copy link
Contributor

Choose a reason for hiding this comment

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

Do we need i18n for this?

@@ -5,7 +5,67 @@
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0"><% if (locals.newHomePage) { %>
Copy link
Contributor

Choose a reason for hiding this comment

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

Seeing all these adjustments enclosed in an if statement in the template I was wondering if it would make sense to have an own template html file for the newHomePage scenario. Then we could enhance the getSandboxTemplate function to use UI5 version and newHomePage property as input to fetch the right template. That could help increasing the readability of the html template files. What do you think?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants