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

[SidePanel API] Adds four examples #890

Merged
merged 25 commits into from
May 3, 2023
Merged

[SidePanel API] Adds four examples #890

merged 25 commits into from
May 3, 2023

Conversation

AmySteam
Copy link
Contributor

@AmySteam AmySteam commented Apr 26, 2023

DEADLINE: May 5th (to match Chrome Beta 114 release).


Adds three cookbooks and one sample of the new SidePanel API

Global Sidepanel API Sample

The global side panel is visible and accessible to the user on every page, providing easy access to additional information and functionality. With this sample, you can learn how to create and customize your own global sidepanel using the Sidepanel API.

Google.com Side Panel API Sample

This API sample showcases the implementation of a side panel that opens on action click and using a keyboard shortcut. This side panel opens only when the user is on google.com.

Multiple Side Panels API Sample

This example sets a welcome side panel when the extension is first installed, then when the user navigates to a different tab, it replaces it with the main side panel.

Dictionary Side Panel Featured in Google IO API Sample

This API sample showcases a side panel that functions as a dictionary. It uses the context menu to retrieve a word from the page. Currently only defines the terms "extensions" and "popup".

@AmySteam
Copy link
Contributor Author

AmySteam commented Apr 26, 2023

@oliverdunk this is ready for a tech review. Can we mostly focus on critical improvements? Please include "nice-to-haves" and I will address these on a separate PR next week. Thanks! 🙂🙏

PS: I am missing the copyright comments and some screenshots. I will add those today.

Copy link
Member

@oliverdunk oliverdunk left a comment

Choose a reason for hiding this comment

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

Left a few thoughts, but overall this looks great! The biggest change I think is around the action cookbook which I think would be nice to update now we have the tab specific side panels.

@AmySteam AmySteam requested a review from oliverdunk May 1, 2023 21:54
@AmySteam
Copy link
Contributor Author

AmySteam commented May 1, 2023

@oliverdunk PTAL 🙏

Copy link
Member

@oliverdunk oliverdunk left a comment

Choose a reason for hiding this comment

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

Left a few nits, but I don't think anything is a blocker. Amazing work getting all of these together!

@@ -0,0 +1,22 @@
const googleURL = 'https://www.google.com';
// Allows users to open the side panel by clicking on the action toolbar icon
Copy link
Member

Choose a reason for hiding this comment

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

Nit: Can we add a newline above here?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Of course 😊

functional-samples/cookbook.sidepanel-global/README.md Outdated Show resolved Hide resolved
functional-samples/cookbook.sidepanel-global/README.md Outdated Show resolved Hide resolved
functional-samples/cookbook.sidepanel-action/README.md Outdated Show resolved Hide resolved
AmySteam and others added 3 commits May 3, 2023 10:18
@GoogleChrome GoogleChrome deleted a comment May 3, 2023
@AmySteam AmySteam merged commit 064dde6 into main May 3, 2023
2 checks passed
@AmySteam AmySteam deleted the sp-samples-new branch May 4, 2023 13:13
2qg4svr pushed a commit to 2qg4svr/chrome-extensions-samples that referenced this pull request Jun 3, 2023
* Add global side panel

* Add multiple panes sample

* Add dictionary side panel sample

* Add google.com and action click extension

* Switch to lowercase

* Fix name

* Fix links

* Add screenshots and links

* Tweak google sp

* Remove logs

* Add install reason

* Add default title to action

* Change extension names
Update readme's

* Tweak comments
Add aside

* increase picture size

* Add screenshots

* Add spaces

* Update screenshots

* Update img size

* Refactor multiple panels

* rename action folder to site-specific

* Switch to Side Panel API

* Apply suggestions from Tech review p2

Thanks Oliver!

Co-authored-by: Oliver Dunk <oliverdunk@google.com>

* Add space
Change variable

---------

Co-authored-by: Oliver Dunk <oliverdunk@google.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
2 participants