Streamline ownership confirmation during sign-up

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

@@ -1,7 +1,7 @@
 import RSSFeeds from './RSSFeeds';
 import formModels from '../Schema/FormModel';
 
-const { blogs, allBlogs, blogUrl, blogOwnership } = formModels;
+const { blogs, allBlogs, blogUrl } = formModels;
 
 const BlogFeeds = () => {
   return (
@@ -19,10 +19,6 @@ const BlogFeeds = () => {
         selected: blogs.name as any,
         discovered: allBlogs.name as any,
       }}
-      agreement={{
-        name: blogOwnership.name,
-        label: blogOwnership.label,
-      }}
       input={{
         name: blogUrl.name,
         label: blogUrl.label,

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

@@ -1,7 +1,7 @@
 import RSSFeeds from './RSSFeeds';
 import formModels from '../Schema/FormModel';
 
-const { channels, allChannels, channelUrl, channelOwnership } = formModels;
+const { channels, allChannels, channelUrl } = formModels;
 
 const ChannelFeeds = () => {
   return (
@@ -14,10 +14,6 @@ const ChannelFeeds = () => {
         selected: channels.name as any,
         discovered: allChannels.name as any,
       }}
-      agreement={{
-        name: channelOwnership.name,
-        label: channelOwnership.label,
-      }}
       input={{
         name: channelUrl.name,
         label: channelUrl.label,

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

@@ -5,10 +5,10 @@ import { connect } from 'formik';
 
 import { SignUpForm } from '../../../interfaces';
 import formModels from '../Schema/FormModel';
-import { TextInput, CheckBoxInput } from '../FormFields';
+import { TextInput } from '../FormFields';
 import PostAvatar from '../../Posts/PostAvatar';
 
-const { githubUsername, github, githubOwnership } = formModels;
+const { githubUsername, github } = formModels;
 
 const useStyles = makeStyles((theme: Theme) =>
   createStyles({
@@ -178,11 +178,6 @@ const GitHubAccount = connect<{}, SignUpForm>((props) => {
             </div>
           )}
         </div>
-        <CheckBoxInput
-          label={githubOwnership.label}
-          name={githubOwnership.name}
-          checked={values.githubOwnership}
-        />
       </div>
     </div>
   );

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

@@ -10,7 +10,7 @@ import Checkbox from '@material-ui/core/Checkbox';
 import { feedDiscoveryServiceUrl } from '../../../config';
 import useAuth from '../../../hooks/use-auth';
 import { SignUpForm, DiscoveredFeed, DiscoveredFeeds } from '../../../interfaces';
-import { TextInput, CheckBoxInput } from '../FormFields';
+import { TextInput } from '../FormFields';
 
 const useStyles = makeStyles((theme: Theme) =>
   createStyles({
@@ -157,10 +157,6 @@ type RSSFeedsFormProps = {
     name: string;
     label: string;
   };
-  agreement: {
-    name: string;
-    label: string;
-  };
   noFeedsSelected?: string;
 };
 
@@ -173,7 +169,6 @@ const RSSFeeds = connect<RSSFeedsFormProps, SignUpForm>(
     buttonText,
     helperText,
     noFeedsSelected,
-    agreement,
     input,
     formik,
   }) => {
@@ -319,11 +314,6 @@ const RSSFeeds = connect<RSSFeedsFormProps, SignUpForm>(
               </div>
             </div>
           </div>
-          <CheckBoxInput
-            label={agreement.label}
-            name={agreement.name}
-            checked={values[agreement.name as keyof SignUpForm] as boolean}
-          />
         </div>
       </div>
     );

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

@@ -157,6 +157,10 @@ const Review = connect<{ accountError: string | undefined }, SignUpForm>((props)
             </div>
           </div>
         </div>
+        <div>
+          By submitting these information, you confirm you are the owner and/or maintainer of the
+          accounts entered.
+        </div>
         <FormHelperText error>{props.accountError}</FormHelperText>
       </div>
     </div>

src/web/app/src/components/SignUp/Schema/FormModel.tsx

@@ -28,11 +28,6 @@ export default {
     label: 'Github username',
     requiredErrorMsg: 'Github account is required',
   },
-  githubOwnership: {
-    name: 'githubOwnership',
-    label: 'I declare I’m the owner and the maintainer of this GitHub account',
-    invalidErrorMsg: 'You must be the owner of this account',
-  },
   blogUrl: {
     name: 'blogUrl',
     label: 'Blog URL(s), seperated by spaces',
@@ -59,14 +54,4 @@ export default {
   allChannels: {
     name: 'allChannels',
   },
-  blogOwnership: {
-    name: 'blogOwnership',
-    label: 'I declare I’m the owner and the maintainer of this blog account',
-    invalidErrorMsg: 'You must be the owner of this account',
-  },
-  channelOwnership: {
-    name: 'channelOwnership',
-    label: 'I declare I’m the owner and the maintainer of the channel(s) above',
-    invalidErrorMsg: 'You must be the owner of the channel(s)',
-  },
 };

src/web/app/src/components/SignUp/Schema/FormSchema.tsx

@@ -1,4 +1,4 @@
-import { string, array, object, boolean } from 'yup';
+import { string, array, object } from 'yup';
 
 import formModels from './FormModel';
 
@@ -13,15 +13,12 @@ const {
   displayName,
   githubUsername,
   github,
-  githubOwnership,
   blogs,
   allBlogs,
   channels,
   allChannels,
   blogUrl,
   channelUrl,
-  blogOwnership,
-  channelOwnership,
 } = formModels;
 
 // Each signup step has one validation schema
@@ -44,30 +41,20 @@ export default [
         avatarUrl: string().url().required(),
       })
       .required(github.invalidErrorMsg),
-    [githubOwnership.name]: boolean().test(
-      'agreed',
-      githubOwnership.invalidErrorMsg,
-      (val) => !!val
-    ),
   }),
 
   // Third step we collect the user blog and the RSSfeeds from it.
   object().shape({
     [blogUrl.name]: string(),
     [blogs.name]: array().of(DiscoveredFeed).min(1, blogs.requiredErrorMsg),
     [allBlogs.name]: array().of(DiscoveredFeed),
-    [blogOwnership.name]: boolean().test('agreed', blogOwnership.invalidErrorMsg, (val) => !!val),
   }),
 
   // Fourth step we collect the user YouTube/Twitch channels and the RSSfeeds from it.
   object().shape({
     [channelUrl.name]: string(),
     [channels.name]: array().of(DiscoveredFeed),
     [allChannels.name]: array().of(DiscoveredFeed),
-    [channelOwnership.name]: boolean().when(allChannels.name, {
-      is: (val: {}[]) => !!val.length,
-      then: (shema) => shema.test('agreed', channelOwnership.invalidErrorMsg, (val) => !!val),
-    }),
   }),
 
   // Reviewing step has no validation logic. We just display all data that we collected.

src/web/app/src/interfaces/index.ts

@@ -39,15 +39,12 @@ export type SignUpForm = {
     avatarUrl: string;
   };
   githubUsername: string;
-  githubOwnership: boolean;
   blogUrl: string;
   channelUrl: string;
   blogs: DiscoveredFeed[];
   allBlogs: DiscoveredFeed[];
   channels: DiscoveredFeed[];
   allChannels: DiscoveredFeed[];
-  blogOwnership: boolean;
-  channelOwnership: boolean;
 };
 
 export type ThemeName = 'light-default' | 'light-high-contrast' | 'dark-default' | 'dark-dim';

src/web/app/src/pages/signup.tsx

@@ -41,15 +41,12 @@ const {
   displayName,
   githubUsername,
   github,
-  githubOwnership,
   blogUrl,
   blogs,
   channels,
   allBlogs,
   allChannels,
   email,
-  blogOwnership,
-  channelOwnership,
 } = formModels;
 
 const useStyles = makeStyles((theme: Theme) =>
@@ -324,7 +321,6 @@ const SignUpPage = () => {
                   [displayName.name]: user?.name,
                   [email.name]: user?.email,
                   [githubUsername.name]: '',
-                  [githubOwnership.name]: false,
                   [github.name]: {
                     username: '',
                     avatarUrl: '',
@@ -334,8 +330,6 @@ const SignUpPage = () => {
                   [allBlogs.name]: [] as SignUpForm['allBlogs'],
                   [channels.name]: [] as SignUpForm['channels'],
                   [allChannels.name]: [] as SignUpForm['allChannels'],
-                  [blogOwnership.name]: false,
-                  [channelOwnership.name]: false,
                 } as SignUpForm
               }
             >