Web-stories-wp: Dashboard Settings Page

Created on 25 Jun 2020 · 27Comments · Source: google/web-stories-wp

Feature Description

Brief updated 7/10/2020
Figma
Related: #570

Reviews

[ ] Product brief reviewed by UX
[x] Product brief reviewed by eng (TL and/or dev)
[ ] UX Design reviewed and approved by PM
[ ] UX Design reviewed and approved by eng
[ ] Eng design reviewed by TL (if needed)

_Do not alter or remove anything below. The following sections will be managed by moderators only._

Acceptance Criteria

The user is able to access to settings page see #570

Implementation Brief

Dashboard P0 Pea Enhancement

Source

jauyong

All 27 comments

@o-fernandez @samitron7 @bmattb
Please note that the figma design link is to the global settings page which we had for #570. Not to a DASHBOARD specific settings page.

jauyong on 25 Jun 2020

Wait, so we‘re gonna have two settings screens?

swissspidy on 25 Jun 2020

No there is just one settings page but you can get to them from the dashboard and inside the editor. Settings are global so we didn't want to force you to go into the editor [if you're on dashboard] if you needed to make a change.

samitron7 on 25 Jun 2020

That makes sense.

It's just confusing to have two issues with basically the same title and acceptance criteria. This one, and #570.

Can we change them to make the separation clearer?

We could create an epic with at least the following sub-issues:

Implement global settings page (#570)
Add way to get from dashboard to settings page (this issue?)
Add way to get from editor to settings page (new issue)

swissspidy on 26 Jun 2020

@swissspidy thanks for helping to clarify.

@o-fernandez @bmattb
The recent task was to create this ticket which I guess should be updated to be about adding a link to the settings page from the Dashboard. However, that doesn't seem to do much good without #570. Do we want to bump #570 in priority? Why would we add the link in the dashboard if the actual page isn't ready? 570 was moved out of beta but I don't think we ever revisited it to consider for stable...

jauyong on 26 Jun 2020

Probably easy just to keep #570 and ensure that both entry points to the page are implemented.

o-fernandez on 26 Jun 2020

@o-fernandez so do you want to add #570 along with both entry points (2 tickets) to sprint 32 as a priority? #570 is in the icebox.

@bmattb

jauyong on 26 Jun 2020

Doesn't need to be Sprint 32 if the team doesn't have bandwidth. These just need to be there for Stable.

I think they are in Sprint 32 just because we already have specs for them, so if the team will be ready to work on them then yes, add both to Sprint 32 and to backlog.

o-fernandez on 26 Jun 2020

Thought I'd keep all the criteria for this together for easy reference.

[x] The user is able to add their Google Analytics ID
[ ] The user is able to upload a publisher logo
[ ] If sitekit is in use, direct users with appropriate information on the settings page

Implementation details

[x] Expose Settings link on dashboard nav
[x] Visible when "Editor Settings" is clicked in left nav.
[x] Has the ability to return back to dashboard view of my stories
- dashboard routing
[x] Has the ability to add Google Analytics Tracking ID
- WordPress API
- If ID is already added elsewhere it should show up here
- Editing ID here should edit it elsewhere
[ ] Has the ability to upload logos for stories as Publisher Logos from file selector
- WordPress API
[ ] Has the ability to upload logos for stories as Publisher Logos as drag and drop
- WordPress API - reference editor, think this is a feature there already
- is there a drag and drop component in the editor already?
[ ] Uploaded logos should check whether:
- the image is a perfect square
- the image is at least 96 x 96px large
- will the API check on this for us built in?

States to check
Has empty state for both GA and logo sections
Handles for 1 logo and an excessive amount of logos (is there a max set by WordPress on this?)
Error handling for setting GA
Error handling for adding a publisher logo

To clarify:

Are we implementing p1 or p0 right now?
Can you change selection of a logo from this panel or just add them to use in editor?

Clarified:

Do we have a loading icon we want to use for while logos are uploading? (new designs incoming)

BrittanyIRL on 1 Jul 2020

@BrittanyIRL:

What yellow for sitekit are you referring to?
We'll use the same one that we use for loading brand icons (when you add a link) but currently there is a new visual design pass and all this will get replaced.
The logos in the settings page are meant to just add to the editor for use. This initial design was meant for beta so @o-fernandez should we expand this and add 1) ability to set a logo as default if you have more than one 2) manage capability or just keep it basic for now?

samitron7 on 2 Jul 2020

This raised two questions for me, added to the spec as a comment for clarification. Let's sort it out in the spec and comment here with the updates.

o-fernandez on 6 Jul 2020

Tickets created to get data

BrittanyIRL on 7 Jul 2020

@samitron7

What yellow for sitekit are you referring to?

hah! i think i was looking at the yellow post it note, which is just a note for design :) Disregard please and I'll make sure i wear my glasses when reviewing figma.

We'll use the same one that we use for loading brand icons (when you add a link) but currently there is a new visual design pass and all this will get replaced.

when you get the new visuals will you let us know? How soon do you think that will be?

BrittanyIRL on 7 Jul 2020

One more question @samitron7

How do you want to signify 'delete' on publisher logos that have been uploaded?
Screen Shot 2020-07-07 at 10 13 15 AM

BrittanyIRL on 7 Jul 2020

@BrittanyIRL @samitron7 I made some updates to the brief based on this thread. Since we'll have multiple logos, and a user should be able to update a logo (not just delete, but replace one) I think this needs to go to the UX queue before we can do the final implementation. Sorry about the changes.

FYI: @pbakaus @swissspidy in case you're also thinking of this or have any other input.

o-fernandez on 7 Jul 2020

@samitron7 could you clarify something for me real quick? I'm trying to lay some groundwork on this view since it's a lot of new stuff!

For the file upload component in this view as seen in this image below - is this showcasing the action of dragging an item into the dropzone that the title of the file should be blue and there should be a modified preview other than what the browser shows on it's own as you are dragging _before_ dropping the file to upload? OR is this what the uploaded files should look like?

Screen Shot 2020-07-08 at 9 52 11 AM

And then here, the upload 'button' has moved from the center to left align - is this a move to make after there's > 0 logos uploaded? Is the gray box an example of what an icon uploaded would look like, if so are we not also showing the name of the uploaded files?

Screen Shot 2020-07-08 at 9 52 18 AM

BrittanyIRL on 8 Jul 2020

That looks more like a mockup than what the component should look like exactly. I think what we have right now in the editor as a dropzone should work just fine for this.

swissspidy on 8 Jul 2020

I have storybook content and initial views with context wired up for Settings. This is a good spot for me to pause. I will hold off on anything further until getting back updated designs re Omar's updates to page specs. Passing back to "UX needed".

BrittanyIRL on 8 Jul 2020

See comment. here https://github.com/google/web-stories-wp/issues/3031#issuecomment-656115181

spacedmonkey on 9 Jul 2020

I rewrote parts of the spec based on feedback and updated in the description.
Will need to review with Sam the updates and go over UX updates needed. Keeping this in UX needed to prioritize in Sam's queue.

o-fernandez on 10 Jul 2020

@samitron7 to provide clarity on setting default logo