Add commands to open URL in new window, and to deploy App in new window #7

nenb · 2024-09-19T16:44:13Z

This PR adds a new command: deploy-app.

deploy-app

Opens the URL for the deploy-app page in a new browser tab. Also passes a query parameter for filepath that is generated from the current workspace in JLab.

Reference Issues or PRs

nebari-dev/jhub-apps#472

What does this implement/fix?

Put a x in the boxes that apply

Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds a feature)
Breaking change (fix or feature that would cause existing features not to work as expected)
Documentation Update
Code style update (formatting, renaming)
Refactoring (no functional changes, no API changes)
Build related changes
Other (please describe):

Testing

Did you test the pull request locally?
Did you add new tests?

Documentation

Access-centered content checklist

Text styling

The content is written with plain language (where relevant).
If there are headers, they use the proper header tags (with only one level-one header: H1 or # in markdown).
All links describe where they link to (for example, check the Nebari website).
This content adheres to the Nebari style guides.

Non-text content

All content is represented as text (for example, images need alt text, and videos need captions or descriptive transcripts).
If there are emojis, there are not more than three in a row.
Don't use flashing GIFs or videos.
If the content were to be read as plain text, it still makes sense, and no information is missing.

Any other comments?

…ew window

github-actions · 2024-09-19T16:44:24Z

👈 Launch a Binder on branch nenb/jupyterlab-nebari-mode/deploy-app-ext

nenb · 2024-09-19T16:45:01Z

style/base.css

@@ -17,3 +17,10 @@
  outline-offset: -3px;
  outline-style: auto;
 }
+
+.nebari-DeployAppIcon {


The CSS needs to be fixed - currently it only displays when I give fixed size (e.g. 16px).

krassowski

Great start! Do you plan to add the button to the toolbar and context menu in this PR or subsequent one?

krassowski · 2024-09-19T16:56:42Z

src/index.ts

+        });
+      },
+      label: () => 'Deploy App',
+      iconClass: () => 'nebari-DeployAppIcon'


Ideally we would use proper icon (an instance of LabIcon) here - iconClass is de-facto deprecated. The less CSS rules the better for performance.

See
https://github.com/nebari-dev/jupyterlab-gallery/blob/ef56fc616bae4ec8305c01e3341b773ca4cfd48f/src/icons.ts#L5-L8 and https://github.com/nebari-dev/jupyterlab-gallery/blob/ef56fc616bae4ec8305c01e3341b773ca4cfd48f/src/svg.d.ts

krassowski · 2024-09-19T16:57:59Z

src/index.ts

+    app.commands.addCommand(CommandIDs.openURL, {
+      execute: async (args: IOpenURLArgs) => {
+        const { url } = resolveURLAndAlias(args);
+        try {
+          window.open(url, '_blank', 'noopener,noreferrer');
+        } catch (error) {
+          console.warn('Error opening URL:', url, error);
+          return;
+        }
+      },
+      label: (args: IOpenURLArgs = {}) => {
+        const { alias } = resolveURLAndAlias(args);
+        return `Open ${alias}`;
+      }
+    });


I would suggest removing the command for opening an arbitrary URL to reduce the API surface

src/index.ts

nenb · 2024-09-19T17:06:14Z

@krassowski Quick follow-up:

Great start! Do you plan to add the button to the toolbar and context menu in this PR or subsequent one?

I was under the impression that these would be configured in the settings in jhub-apps/nebari, rather than adding them here.

What's the usual practice? That an extension includes these settings by default, and then a user (e.g. nebari deployment) can disable them if they require?

krassowski · 2024-09-19T17:13:33Z

I was under the impression that these would be configured in the settings in jhub-apps/nebari, rather than adding them here.

I think its better to include them here in a single plugin rather than in nebari. This is because it will be much easier to test it if it is completely independent of nebari. jhub-apps currently has no JupyterLab extensions. We can later extract that plugin to make it live closer to jhub-apps.

krassowski · 2024-09-19T17:15:47Z

That an extension includes these settings by default, and then a user (e.g. nebari deployment) can disable them if they require?

Yes, it is much easier to:

do proper visual testing here and ship a standalone plugin
flip "enabled" flag one per-plugin basis in nebari

than if we were to split the logic between the two.

kcpevey · 2024-09-19T19:21:46Z

Just wanted to mention that we need to keep in mind that jhub-apps is an optional feature of Nebari and therefore the changes we introduce here should also be safe for when jhub-apps is not present. (Maybe this is already true, I dont know about the technical details here 😀)

nenb · 2024-09-19T21:41:03Z

schema/jhub-apps-integration.json

+      "context": [
+      {
+        "command": "jhub-apps:deploy-app",
+        "selector": ".jp-DirListing-item",


Question: Does selector really need to be here (it seems so), and if so, what should I set it as?

Yes. I think that for now it only makes sense for files not for directories so the selector should reflect that.

nenb · 2024-09-19T21:42:24Z

src/index.ts

+      },
+      label: () => 'Deploy App',
+      icon: () => {
+        // Add logic to only display the icon if the command is not in the main menu


Is there a way to do this i.e. display the icon only except for the main menu (see the screenshots and compare them to the Figma diagrams)?

This method takes an argument that can be used to display this icon or not - I don't remember all attributes of top of my head but it should have something like isToolbar and the underlying event.

Ok, I've just added a new argument (origin) to the schema JSON that controls this, I couldn't figure out how to get something like isToolbar working.

nenb · 2024-09-19T21:43:44Z

Some screenshots of what it is currently looking like:

Context Menu

Main Menu and Toolbar

New Tab on Click

krassowski · 2024-09-30T13:02:58Z

Closing in favour of nebari-dev/jupyterlab-jhub-apps#1 that was just merged :) 🎉

Added commands to open URL in new window, and to open deploy App in n…

2cd0076

…ew window

nenb commented Sep 19, 2024

View reviewed changes

nenb changed the title ~~Added commands to open URL in new window, and to open deploy App in n…~~ Add commands to open URL in new window, and to deploy App in new window Sep 19, 2024

krassowski added the feature label Sep 19, 2024

krassowski reviewed Sep 19, 2024

View reviewed changes

nenb mentioned this pull request Sep 19, 2024

[ENH] - Enable ability to launch an app directly from notebook nebari-dev/jhub-apps#472

Open

nenb added 3 commits September 19, 2024 16:57

Remove open URL command, move deploy app command to new plugin

7e8918f

Replace CSS with proper icon

e4dfa10

Add button to toolbar and context menu

d2dc03a

nenb commented Sep 19, 2024

View reviewed changes

lint

68a6002

nenb marked this pull request as ready for review September 19, 2024 21:48

nenb added 3 commits September 20, 2024 09:10

Restrict context menu to files

a6fa649

Add origin argument to schema JSON to control icon display

9db2b26

lint json

186aea2

krassowski mentioned this pull request Sep 30, 2024

Add new deploy app command nebari-dev/jupyterlab-jhub-apps#1

Merged

18 tasks

krassowski closed this Sep 30, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add commands to open URL in new window, and to deploy App in new window #7

Add commands to open URL in new window, and to deploy App in new window #7

nenb commented Sep 19, 2024 •

edited

Loading

github-actions bot commented Sep 19, 2024

nenb Sep 19, 2024

krassowski left a comment

krassowski Sep 19, 2024

krassowski Sep 19, 2024

nenb commented Sep 19, 2024 •

edited

Loading

krassowski commented Sep 19, 2024

krassowski commented Sep 19, 2024

kcpevey commented Sep 19, 2024

nenb Sep 19, 2024

krassowski Sep 19, 2024

nenb Sep 19, 2024

krassowski Sep 19, 2024

nenb Sep 20, 2024

nenb commented Sep 19, 2024

krassowski commented Sep 30, 2024

Add commands to open URL in new window, and to deploy App in new window #7

Add commands to open URL in new window, and to deploy App in new window #7

Conversation

nenb commented Sep 19, 2024 • edited Loading

Reference Issues or PRs

What does this implement/fix?

Testing

Documentation

Access-centered content checklist

Text styling

Non-text content

Any other comments?

github-actions bot commented Sep 19, 2024

Choose a reason for hiding this comment

krassowski left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

nenb commented Sep 19, 2024 • edited Loading

krassowski commented Sep 19, 2024

krassowski commented Sep 19, 2024

kcpevey commented Sep 19, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

nenb commented Sep 19, 2024

krassowski commented Sep 30, 2024

nenb commented Sep 19, 2024 •

edited

Loading

nenb commented Sep 19, 2024 •

edited

Loading