feat(ui): added helpbub #970

alinashklyar · 2024-04-18T07:49:06Z

No description provided.

cf-ci-bot · 2024-04-18T07:52:26Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-04-18T09:57:10Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-05-01T12:09:43Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-05-01T12:17:13Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-05-02T13:00:42Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-05-09T10:12:13Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-05-09T12:38:03Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

olegt-codefresh · 2024-05-09T13:13:23Z

_includes/docs-navbar.html

+
+    {% if page.layout != "home" %}
+      <button
+        onclick="window.CommandBar.toggleHelpHub()"


Can we also add accessibility attributes to this button?

sure, you mean aria-labels?

but it has text inside of it btw

Just to make sure it's accessibe via keyboard and a screen reader

olegt-codefresh · 2024-05-09T13:30:41Z

_includes/scripts.html

-    },
+  var o="3033bf7f",n=["Object.assign","Symbol","Symbol.for"].join("%2C"),a=window;function t(o,n){void 0===n&&(n=!1),"complete"!==document.readyState&&window.addEventListener("load",t.bind(null,o,n),{capture:!1,once:!0});var a=document.createElement("script");a.type="text/javascript",a.async=n,a.src=o,document.head.appendChild(a)}function r(){var n;if(void 0===a.CommandBar){delete a.__CommandBarBootstrap__;var r=Symbol.for("CommandBar::configuration"),e=Symbol.for("CommandBar::orgConfig"),c=Symbol.for("CommandBar::disposed"),i=Symbol.for("CommandBar::isProxy"),m=Symbol.for("CommandBar::queue"),l=Symbol.for("CommandBar::unwrap"),d=[],s=localStorage.getItem("commandbar.lc"),u=s&&s.includes("local")?"http://localhost:8000":"https://api.commandbar.com",f=Object.assign(((n={})[r]={uuid:o},n[e]={},n[c]=!1,n[i]=!0,n[m]=new Array,n[l]=function(){return f},n),a.CommandBar),p=["addCommand","boot"],y=f;Object.assign(f,{shareCallbacks:function(){return{}},shareContext:function(){return{}}}),a.CommandBar=new Proxy(f,{get:function(o,n){return n in y?f[n]:p.includes(n)?function(){var o=Array.prototype.slice.call(arguments);return new Promise((function(a,t){o.unshift(n,a,t),f[m].push(o)}))}:function(){var o=Array.prototype.slice.call(arguments);o.unshift(n),f[m].push(o)}}}),null!==s&&d.push("lc=".concat(s)),d.push("version=2"),t("".concat(u,"/latest/").concat(o,"?").concat(d.join("&")),!0)}}void 0===Object.assign||"undefined"==typeof Symbol||void 0===Symbol.for?(a.__CommandBarBootstrap__=r,t("https://polyfill.io/v3/polyfill.min.js?version=3.101.0&callback=__CommandBarBootstrap__&features="+n)):r();
+  window.CommandBar.boot(
+    "docs-test",


Need to check the API add see if we need to rename the docs-test (I think it's a field for a user name)

Let's check with Idan if we should add fixed id like "documentation-user" or pass an empty string as for anonymous user.

olegt-codefresh · 2024-05-09T13:33:00Z

_includes/scripts.html

-      }],
-      apiKey: '5aRIuEbEpw9LTf2B5te4Essx4o4HE4Fl', // Use API Key with only Search permissions
-    },
+  var o="3033bf7f",n=["Object.assign","Symbol","Symbol.for"].join("%2C"),a=window;function t(o,n){void 0===n&&(n=!1),"complete"!==document.readyState&&window.addEventListener("load",t.bind(null,o,n),{capture:!1,once:!0});var a=document.createElement("script");a.type="text/javascript",a.async=n,a.src=o,document.head.appendChild(a)}function r(){var n;if(void 0===a.CommandBar){delete a.__CommandBarBootstrap__;var r=Symbol.for("CommandBar::configuration"),e=Symbol.for("CommandBar::orgConfig"),c=Symbol.for("CommandBar::disposed"),i=Symbol.for("CommandBar::isProxy"),m=Symbol.for("CommandBar::queue"),l=Symbol.for("CommandBar::unwrap"),d=[],s=localStorage.getItem("commandbar.lc"),u=s&&s.includes("local")?"http://localhost:8000":"https://api.commandbar.com",f=Object.assign(((n={})[r]={uuid:o},n[e]={},n[c]=!1,n[i]=!0,n[m]=new Array,n[l]=function(){return f},n),a.CommandBar),p=["addCommand","boot"],y=f;Object.assign(f,{shareCallbacks:function(){return{}},shareContext:function(){return{}}}),a.CommandBar=new Proxy(f,{get:function(o,n){return n in y?f[n]:p.includes(n)?function(){var o=Array.prototype.slice.call(arguments);return new Promise((function(a,t){o.unshift(n,a,t),f[m].push(o)}))}:function(){var o=Array.prototype.slice.call(arguments);o.unshift(n),f[m].push(o)}}}),null!==s&&d.push("lc=".concat(s)),d.push("version=2"),t("".concat(u,"/latest/").concat(o,"?").concat(d.join("&")),!0)}}void 0===Object.assign||"undefined"==typeof Symbol||void 0===Symbol.for?(a.__CommandBarBootstrap__=r,t("https://polyfill.io/v3/polyfill.min.js?version=3.101.0&callback=__CommandBarBootstrap__&features="+n)):r();


Please make sure it's the latest code snippet from the commandbar docs:
https://www.commandbar.com/docs/guides/installation/installation-types/installing-in-web-app/#option-2-snippet

olegt-codefresh · 2024-05-09T13:40:09Z

index.html

@@ -19,7 +19,17 @@ <h2 class="mb-3 bd-text-white text-uppercase">
            Instantly build, test, and deploy Docker images.<br>
            Realize your true DevOps potential with the premier enterprise Argo software delivery solution.
          </p>
-          <div id="searchbar"></div>
+<!--          <div id="searchbar"></div>-->
+          <button


accessibility attributes for the button

olegt-codefresh · 2024-05-09T13:43:06Z

yarn.lock

-    output-file-sync "^2.0.0"
-    slash "^1.0.0"
-    source-map "^0.5.0"
+"@ampproject/remapping@^2.2.0":


Is this change caused by yarn upgrade or we have uncommitted changes?

i ran 'yarn' command, anyway, i'll clear changes from here

…me; refreshed helpbub code snippet

cf-ci-bot · 2024-05-09T14:22:53Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-05-09T14:24:24Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

cf-ci-bot · 2024-05-10T06:42:10Z

[CI] Staging environment is at http://staging-docs.codefresh.io.s3-website.us-east-1.amazonaws.com/CR-22957/docs/

added helpbub; restyled main helpbub button

3c53515

alinashklyar requested a review from NimRegev as a code owner April 18, 2024 07:49

alinashklyar added 2 commits April 18, 2024 12:41

added smaller helpbub at all other pages

b07e9db

centered modal

504af8a

Update _buttons.scss

e75f001

Update _buttons.scss

f2cdf80

centered helpbub vertically; added green outline

09dd5eb

small pr improvements

e100f04

efford to fix issue with button representation

30635cf

olegt-codefresh reviewed May 9, 2024

View reviewed changes

alinashklyar added 2 commits May 9, 2024 17:19

cleaned yarn.lock changes; added aria-label for buttons; fixed userna…

1172316

…me; refreshed helpbub code snippet

Update yarn.lock

3874bfa

set an anonymous user for helpbub

2d0e0b5

olegt-codefresh approved these changes May 10, 2024

View reviewed changes

NimRegev merged commit e4d8fa0 into master May 27, 2024

NimRegev deleted the CR-22957 branch May 12, 2025 09:22

feat(ui): added helpbub #970

feat(ui): added helpbub #970

Uh oh!

Conversation

alinashklyar commented Apr 18, 2024

Uh oh!

cf-ci-bot commented Apr 18, 2024

Uh oh!

cf-ci-bot commented Apr 18, 2024

Uh oh!

cf-ci-bot commented May 1, 2024

Uh oh!

cf-ci-bot commented May 1, 2024

Uh oh!

cf-ci-bot commented May 2, 2024

Uh oh!

cf-ci-bot commented May 9, 2024

Uh oh!

cf-ci-bot commented May 9, 2024

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

olegt-codefresh May 9, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

cf-ci-bot commented May 9, 2024

Uh oh!

cf-ci-bot commented May 9, 2024

Uh oh!

cf-ci-bot commented May 10, 2024

Uh oh!

Uh oh!

olegt-codefresh May 9, 2024 •

edited

Loading