[Graph] Empty workspace overlay #45547

flash1293 · 2019-09-12T16:49:32Z

Have overlays to guide the user to get something on the screen.

Adds a function to fetch the most common terms of the selected fields and prepopulate the workspace like that.

cc @cchaos @shaunmcgough

…to graph/call-to-action

flash1293 · 2019-09-30T12:30:10Z

Thanks for your feedback. What about this version?

elasticmachine · 2019-09-30T13:39:32Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

elizabetdev · 2019-09-30T14:56:02Z

Hi @flash1293,

I've been changing the design a little based on @timroes comments. Instead of using an opacity the text is now grayed out.

I would use a checkmark to help visualize where we are and once the task is done the check icon changes to a green checkInCircleFilled icon.

Here's the link to the updated prototype:
https://www.figma.com/proto/rDcLVEfYMNah0nVvfZz2w9/Graph-Let-s-get-started-2?node-id=46%3A79&viewport=-2080%2C365%2C0.5&scaling=min-zoom

ryankeairns · 2019-09-30T15:22:08Z

@miukimiu for accessibility purposes (color contrast) the disabled text will need to be darker. That makes this more challenging of a problem to solve, but the light gray won't be readable.

The lightest gray we can use (which is not light 😏) is euiColorDarkShade. For reference, you can check the Colors page on the EUI docs site: https://elastic.github.io/eui/#/guidelines/colors

elizabetdev · 2019-09-30T15:34:00Z

Thanks @ryankeairns! My bad! I copied the color from the disabled button 😛. The prototype is now updated and using theeuiColorDarkShade.

cchaos · 2019-09-30T15:58:22Z

An alternate suggestion for the current task icon is to use the sortRight arrow, so that it's pointing to the current step. I think the checkmark is still confusing as no matter what you pair next to it will always looks complete.

x-pack/legacy/plugins/graph/public/components/guidance_panel/guidance_panel.tsx

flash1293 · 2019-09-30T17:33:39Z

Thanks for all of your suggestions - this is getting a real team work :)

checkInCircleFilled for done items @miukimiu
sortRight for the current item @cchaos
euiColorDarkShade for disabled items @ryankeairns
aria-label for the heading @myasonik

elasticmachine · 2019-09-30T18:42:42Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

snide · 2019-10-01T01:18:17Z

x-pack/legacy/plugins/graph/public/components/guidance_panel/guidance_panel.tsx

+          <EuiIcon type={state === 'active' ? 'sortRight' : 'check'} />
+        </span>
+      )}
+      {children}


Just to add to your review soup, wrap this in <EuiText/> to fix your text line heights.

elasticmachine · 2019-10-01T08:52:07Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

elasticmachine · 2019-10-02T13:51:40Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request

elasticmachine · 2019-10-03T09:04:14Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request
Commit: 456dc39

…ysens/kibana into console-fix-menu-actions-alignment * 'console-fix-menu-actions-alignment' of github.com:jloleysens/kibana: (59 commits) [Canvas] i18n for page manager, page preview, and shape preview (elastic#46865) [SIEM] hide siem data on empty string or _all (elastic#47166) [Uptime] Shim UI exports for new platform (elastic#44722) [Monitoring] Metricbeat Migration Wizard Tests (elastic#47139) [Logs UI] Support partitioned log rate results in API (elastic#46751) [APM] Remove beta badge from transaction breakdown (elastic#47163) test: 💍 convert Interpreter font function tests to Jest (elastic#47193) visualizations 👉 NP-ready (elastic#47142) [Uptime] Update pings chart colors (elastic#46780) Add scroll into view to avoid tooltip overlap (elastic#47106) Variety of quick a11y fixes (elastic#46569) [Graph] Empty workspace overlay (elastic#45547) [ML] Converts index and saved search selection to React (elastic#47117) [Uptime] Change default status filter in ping list to all on monitor page (elastic#47108) refactor: 💡 convert Interpreter .js -> .ts (elastic#44545) Add TypeScript rules to STYLEGUIDE [skip ci] (elastic#47125) chore(NA): fix logic behind cleaning x-pack node modules on build (elastic#47091) [SIEM] Update Settings Text (elastic#47147) Add KQL functionality in the find function of the saved objects (elastic#41136) [Maps] Add 'InjectedData' class and revise so File Upload Features are assigned to new InjectedData instances (elastic#46381) ...

flash1293 added 30 commits August 26, 2019 17:56

create graph listing page

067158a

clean up app folder

5fddc10

remove inline loading menu

95f003b

also add badge to workspace route

ae44388

fix tests

2f1056f

fix graph spaces functional test

5d637f5

generate documentation for new breadcrumb property

9d17862

fix test subject names

db1d740

remove unused translations

e09b70d

start implementing save modal flow for Graph

2dab994

fix spaces functional test

c34d845

wip save modal

2d775e6

wip save modal

ebe80d1

add and style save modal

fab1577

add placeholder to description field

a9d31c8

Merge remote-tracking branch 'upstream/master' into graph/listing-page

9d2822e

Merge remote-tracking branch 'upstream/master' into graph/listing-page

d0b9247

disable dirty check on breadcrumb navigation and fix delete function

d187eae

Merge branch 'graph/listing-page' into graph/savemodal

21ba056

reactify most of settings

5d87a6a

improve onClick typing on breadcrumb

a289d7d

Merge branch 'graph/listing-page' into graph/savemodal

989481c

fix newline error and use new types in dashboard app controller

be1e59a

Merge branch 'graph/savemodal' into graph/settings

6ba958b

EUIify drilldown

4057edb

EUIify drilldown

611214e

fix translation errors

c5ac49b

fix i18n translation for real

8d6cec1

Merge remote-tracking branch 'upstream/master' into graph/savemodal

0472505

Merge branch 'graph/savemodal' into graph/settings

8012ac8

Merge branch 'graph/call-to-action' of github.com:flash1293/kibana in…

7ac17cf

…to graph/call-to-action

myasonik reviewed Sep 30, 2019

View reviewed changes

x-pack/legacy/plugins/graph/public/components/guidance_panel/guidance_panel.tsx Outdated Show resolved Hide resolved

have separate styling for done items

4a6fdf6

flash1293 force-pushed the graph/call-to-action branch from fdf3b25 to 4a6fdf6 Compare September 30, 2019 17:34

snide reviewed Oct 1, 2019

View reviewed changes

flash1293 added 2 commits October 1, 2019 09:32

Merge remote-tracking branch 'upstream/master' into graph/call-to-action

60926f8

wrap list items in EuiText

e0724c2

elizabetdev approved these changes Oct 2, 2019

View reviewed changes

flash1293 added 2 commits October 2, 2019 14:23

Merge remote-tracking branch 'upstream/master' into graph/call-to-action

ab23657

Merge remote-tracking branch 'upstream/master' into graph/call-to-action

89638c8

flash1293 added 2 commits October 3, 2019 09:33

Merge remote-tracking branch 'upstream/master' into graph/call-to-action

c0b100f

eslint fix

456dc39

flash1293 merged commit 127eab0 into elastic:master Oct 3, 2019

flash1293 deleted the graph/call-to-action branch October 3, 2019 09:13

flash1293 added a commit to flash1293/kibana that referenced this pull request Oct 3, 2019

[Graph] Empty workspace overlay (elastic#45547)

6006299

flash1293 mentioned this pull request Oct 3, 2019

[7.x] [Graph] Empty workspace overlay (#45547) #47198

Merged

flash1293 added a commit that referenced this pull request Oct 4, 2019

[Graph] Empty workspace overlay (#45547) (#47198)

7fe079d

flash1293 mentioned this pull request Oct 7, 2019

Graph workspace configuration flow #44103

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Graph] Empty workspace overlay #45547

[Graph] Empty workspace overlay #45547

flash1293 commented Sep 12, 2019 •

edited

Loading

flash1293 commented Sep 30, 2019

elasticmachine commented Sep 30, 2019

elizabetdev commented Sep 30, 2019

ryankeairns commented Sep 30, 2019

elizabetdev commented Sep 30, 2019

cchaos commented Sep 30, 2019

flash1293 commented Sep 30, 2019

elasticmachine commented Sep 30, 2019

snide Oct 1, 2019

elasticmachine commented Oct 1, 2019

elasticmachine commented Oct 2, 2019

elasticmachine commented Oct 3, 2019

[Graph] Empty workspace overlay #45547

[Graph] Empty workspace overlay #45547

Conversation

flash1293 commented Sep 12, 2019 • edited Loading

flash1293 commented Sep 30, 2019

elasticmachine commented Sep 30, 2019

💚 Build Succeeded

elizabetdev commented Sep 30, 2019

ryankeairns commented Sep 30, 2019

elizabetdev commented Sep 30, 2019

cchaos commented Sep 30, 2019

flash1293 commented Sep 30, 2019

elasticmachine commented Sep 30, 2019

💚 Build Succeeded

snide Oct 1, 2019

Choose a reason for hiding this comment

elasticmachine commented Oct 1, 2019

💚 Build Succeeded

elasticmachine commented Oct 2, 2019

💚 Build Succeeded

elasticmachine commented Oct 3, 2019

💚 Build Succeeded

flash1293 commented Sep 12, 2019 •

edited

Loading