Add clarification to differentiate between the blog URL and the RSS(feed URL) during sign-up #3763

cychu42 · 2022-11-16T18:22:05Z

Issue This PR Addresses

USAGE: #3646
This PR addresses one of the issues raised in the issue.

Type of Change

Bugfix: Change which fixes an issue
New Feature: Change which adds functionality
Documentation Update: Change which improves documentation
UI: Change which improves UI

Description

The issue was that some users experience confusion between a blog URL (blog's root HTML) and select the RSS (blog's feed XML) during sign-up. This PR adds 2 sentences to the prompt to clarify the difference, in src\web\app\src\components\SignUp\Forms\BlogFeeds.tsx.

Steps to test the PR

Test this by going through the sign-up process to view the Blog Feeds page.
During testing, you can use test account user1 with password user1pass.
You can enter any Github account name to get through the page before this page.

Checklist

Quality: This PR builds and passes our npm test and works locally
Tests: This PR includes thorough tests or an explanation of why it does not
Screenshots: This PR includes screenshots or GIFs of the changes made or an explanation of why it does not (if applicable)
Documentation: This PR includes updated/added documentation to user exposed functionality or configuration variables are added/changed or an explanation of why it does not(if applicable)

gitpod-io · 2022-11-16T18:22:13Z

NeilAn99 · 2022-11-16T20:23:14Z

I think it might be nice to provide an example of a blog URL, so users who don't know what HTML and XML are know what to provide.

cychu42 · 2022-11-16T20:53:01Z

Maybe, but there are many different sites, so I'm not sure it's practical to list them all or useful to list only one.

NeilAn99 · 2022-11-16T21:42:40Z

I think maybe one example would be fine, I think most people use dev.to. But just a simple example, something like:

Blog URL: https://dev.to/user
vs
Blog feed URL: https://dev.to/feed/user

TueeNguyen · 2022-11-16T21:58:30Z

Agree with @NeilAn99, let's add examples of blog url and feed url in 2 separate lines

cychu42 · 2022-11-17T01:32:07Z

OK, how about this?

batunpc

@cychu42 Your implementation looks good!
I have left some initial review that we could address

src/web/app/src/components/SignUp/Forms/RSSFeeds.tsx

batunpc · 2022-11-17T09:51:53Z

src/web/app/src/components/SignUp/Forms/ChannelFeeds.tsx

@@ -8,6 +8,8 @@ const ChannelFeeds = () => {
    <RSSFeeds
      title="YouTube and Twitch"
      prompt="OPTIONAL: Enter your YouTube and/or Twitch channel"
+      promptExample1=""
+      promptExample2=""


Making the prop optional and assigning a default value like empty list, will ensure that nothing will break and would not have to make changes here.

src/web/app/src/components/SignUp/Forms/RSSFeeds.tsx

cychu42 · 2022-11-18T15:24:39Z

@batunpc Good ideas! I made some changes accordingly.
The only thing I didn't do is assigning a default value, because it doesn't look like the existing code does it for other variables of type RSSFeedsFormProps , but I did make the promptExamples array optional and make sure nothing would render if there's no value assigned.
For instance, the next page renders using the same type without any example.

batunpc

Thank you @cychu42 , great job 👍

cychu42 · 2022-11-19T01:19:34Z

Thank you all for the reviews. I just rebased and squashed the commits, after the approval.
I guess I'm now waiting for a reviewer with write access to allow merge to happen.

src/web/app/src/components/SignUp/Forms/RSSFeeds.tsx

manekenpix · 2022-11-19T22:03:49Z

Last minute suggestion:

The text looks a bit bloated and hard to read, what about something more simple? maybe a basic but clear indication of what valid and non valid blog URLs are:

It doesn't have to be exactly this ^, but maybe something a bit cleaner would be better for users? It could also include links to blog URL vs feed URL explanations or definitions, or Blog vs Post (some people think a post is a blog).

I'm also ok if the team decides that the changes proposed in this PR are the way to go.

cychu42 · 2022-11-23T18:58:36Z

What if we use some shorter text instead:

Enter your blog root URL (HTML) and select the blog's RSS feed URL (XML) you want to use in Telescope, such as:
Blog root URL: https://dev.to/user
RSS feed URL: https://dev.to/feed/user

The 2 examples can be smaller texts like you suggested.

manekenpix · 2022-11-23T20:23:12Z

What if we use some shorter text instead:

Enter your blog root URL (HTML) and select the blog's RSS feed URL (XML) you want to use in Telescope, such as:
Blog root URL: https://dev.to/user
RSS feed URL: https://dev.to/feed/user

The 2 examples can be smaller texts like you suggested.

@cychu42 Yeah, I think that'd work.

src/web/app/src/components/SignUp/Forms/BlogFeeds.tsx

* Turn examples into an array * Fix Eslint error * Shorten the prompt and resize URLs

cychu42 · 2022-11-25T18:15:06Z

OK. I updated it. It now looks like this:

For the prompt examples, I used the same font size as the formControlLabel class (the RSS URL(s) that shows after validation), which is smaller than the prompt.

manekenpix

LGTM 👍

vercel bot deployed to Preview November 16, 2022 18:23 View deployment

cychu42 marked this pull request as ready for review November 16, 2022 18:36

cychu42 force-pushed the issue-3646 branch from f330232 to 5afdf1a Compare November 16, 2022 20:54

vercel bot deployed to Preview November 16, 2022 20:55 View deployment

cychu42 force-pushed the issue-3646 branch from 5afdf1a to 8ce3663 Compare November 17, 2022 01:30

vercel bot deployed to Preview November 17, 2022 01:32 View deployment

batunpc suggested changes Nov 17, 2022

View reviewed changes

manekenpix assigned cychu42 Nov 17, 2022

vercel bot deployed to Preview November 18, 2022 15:08 View deployment

vercel bot deployed to Preview November 18, 2022 15:21 View deployment

cychu42 requested a review from batunpc November 18, 2022 19:19

batunpc previously approved these changes Nov 18, 2022

View reviewed changes

cychu42 dismissed batunpc’s stale review via fbed254 November 19, 2022 01:13

cychu42 force-pushed the issue-3646 branch from 779d51d to fbed254 Compare November 19, 2022 01:13

vercel bot deployed to Preview November 19, 2022 01:14 View deployment

cychu42 requested a review from batunpc November 19, 2022 01:22

batunpc previously approved these changes Nov 19, 2022

View reviewed changes

manekenpix reviewed Nov 19, 2022

View reviewed changes

src/web/app/src/components/SignUp/Forms/RSSFeeds.tsx Outdated Show resolved Hide resolved

Myrfion reviewed Nov 25, 2022

View reviewed changes

src/web/app/src/components/SignUp/Forms/BlogFeeds.tsx Outdated Show resolved Hide resolved

Add clarification to between the blog URL and the RSS for sign-up

aed0ec9

* Turn examples into an array * Fix Eslint error * Shorten the prompt and resize URLs

cychu42 dismissed batunpc’s stale review via aed0ec9 November 25, 2022 18:14

cychu42 force-pushed the issue-3646 branch from fbed254 to aed0ec9 Compare November 25, 2022 18:14

vercel bot deployed to Preview November 25, 2022 18:16 View deployment

cychu42 requested a review from manekenpix November 25, 2022 18:21

manekenpix approved these changes Nov 25, 2022

View reviewed changes

manekenpix merged commit e58aa60 into Seneca-CDOT:master Nov 25, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add clarification to differentiate between the blog URL and the RSS(feed URL) during sign-up #3763

Add clarification to differentiate between the blog URL and the RSS(feed URL) during sign-up #3763

cychu42 commented Nov 16, 2022 •

edited

Loading

gitpod-io bot commented Nov 16, 2022

NeilAn99 commented Nov 16, 2022

cychu42 commented Nov 16, 2022

NeilAn99 commented Nov 16, 2022

TueeNguyen commented Nov 16, 2022

cychu42 commented Nov 17, 2022

batunpc left a comment

batunpc Nov 17, 2022 •

edited

Loading

cychu42 commented Nov 18, 2022

batunpc left a comment

cychu42 commented Nov 19, 2022 •

edited

Loading

manekenpix commented Nov 19, 2022 •

edited

Loading

cychu42 commented Nov 23, 2022

manekenpix commented Nov 23, 2022 •

edited

Loading

cychu42 commented Nov 25, 2022 •

edited

Loading

manekenpix left a comment

Add clarification to differentiate between the blog URL and the RSS(feed URL) during sign-up #3763

Add clarification to differentiate between the blog URL and the RSS(feed URL) during sign-up #3763

Conversation

cychu42 commented Nov 16, 2022 • edited Loading

Issue This PR Addresses

Type of Change

Description

Steps to test the PR

Checklist

gitpod-io bot commented Nov 16, 2022

NeilAn99 commented Nov 16, 2022

cychu42 commented Nov 16, 2022

NeilAn99 commented Nov 16, 2022

TueeNguyen commented Nov 16, 2022

cychu42 commented Nov 17, 2022

batunpc left a comment

Choose a reason for hiding this comment

batunpc Nov 17, 2022 • edited Loading

Choose a reason for hiding this comment

cychu42 commented Nov 18, 2022

batunpc left a comment

Choose a reason for hiding this comment

cychu42 commented Nov 19, 2022 • edited Loading

manekenpix commented Nov 19, 2022 • edited Loading

cychu42 commented Nov 23, 2022

manekenpix commented Nov 23, 2022 • edited Loading

cychu42 commented Nov 25, 2022 • edited Loading

manekenpix left a comment

Choose a reason for hiding this comment

cychu42 commented Nov 16, 2022 •

edited

Loading

batunpc Nov 17, 2022 •

edited

Loading

cychu42 commented Nov 19, 2022 •

edited

Loading

manekenpix commented Nov 19, 2022 •

edited

Loading

manekenpix commented Nov 23, 2022 •

edited

Loading

cychu42 commented Nov 25, 2022 •

edited

Loading