moar alignment

static/app-strings.json

@@ -174,12 +174,9 @@
   "Files": "Files",
   "Channels": "Channels",
   "Everything": "Everything",
-  "File Types": "File Types",
-  "Videos": "Videos",
   "Audio": "Audio",
-  "Images": "Images",
   "Text": "Text",
-  "Other Files": "Other Files",
+  "Other": "Other",
   "Other Options": "Other Options",
   "Returned Results": "Returned Results",
   "Custom Code": "Custom Code",
@@ -807,7 +804,6 @@
   "How Fresh": "How Fresh",
   "Image": "Image",
   "Model": "Model",
-  "Other": "Other",
   "You can try refreshing to fix it. If you still have issues, your anti-virus software or firewall may be preventing startup.": "You can try refreshing to fix it. If you still have issues, your anti-virus software or firewall may be preventing startup.",
   "gaming, crypto": "gaming, crypto",
   "Autocomplete": "Autocomplete",

ui/component/publishDescription/view.jsx

@@ -22,24 +22,22 @@ function PublishDescription(props: Props) {
   return (
     <Card
       actions={
-        <React.Fragment>
+        <FormField
-          <FormField
+          type={!SIMPLE_SITE && advancedEditor ? 'markdown' : 'textarea'}
-            type={!SIMPLE_SITE && advancedEditor ? 'markdown' : 'textarea'}
+          name="content_description"
-            name="content_description"
+          label={__('Description')}
-            label={__('Description')}
+          placeholder={__(
-            placeholder={__(
+            'What is your content about? Use this space to include any other relevant details you may like to share about your content and channel.'
-              'What is your content about? Use this space to include any other relevant details you may like to share about your content and channel.'
+          )}
-            )}
+          value={description}
-            value={description}
+          disabled={disabled}
-            disabled={disabled}
+          onChange={value =>
-            onChange={value =>
+            updatePublishForm({ description: !SIMPLE_SITE && advancedEditor ? value : value.target.value })
-              updatePublishForm({ description: !SIMPLE_SITE && advancedEditor ? value : value.target.value })
+          }
-            }
+          quickActionLabel={!SIMPLE_SITE && (advancedEditor ? __('Simple Editor') : __('Advanced Editor'))}
-            quickActionLabel={!SIMPLE_SITE && (advancedEditor ? __('Simple Editor') : __('Advanced Editor'))}
+          quickActionHandler={toggleMarkdown}
-            quickActionHandler={toggleMarkdown}
+          textAreaMaxLength={FF_MAX_CHARS_IN_DESCRIPTION}
-            textAreaMaxLength={FF_MAX_CHARS_IN_DESCRIPTION}
+        />
-          />
-        </React.Fragment>
       }
     />
   );

ui/component/publishFile/view.jsx

@@ -77,7 +77,10 @@ function PublishFile(props: Props) {
 
   const RECOMMENDED_BITRATE = 6000000;
   const TV_PUBLISH_SIZE_LIMIT: number = 1073741824;
-  const UPLOAD_SIZE_MESSAGE = 'Lbry.tv uploads are limited to 1 GB. Download the app for unrestricted publishing.';
+  const UPLOAD_SIZE_MESSAGE = __(
+    '%SITE_NAME% uploads are limited to 1 GB. Download the app for unrestricted publishing.',
+    { SITE_NAME }
+  );
   const PROCESSING_MB_PER_SECOND = 0.5;
   const MINUTES_THRESHOLD = 30;
   const HOURS_THRESHOLD = MINUTES_THRESHOLD * 60;
@@ -158,7 +161,7 @@ function PublishFile(props: Props) {
     if (oversized) {
       return (
         <p className="help--error">
-          {__(UPLOAD_SIZE_MESSAGE)}{' '}
+          {UPLOAD_SIZE_MESSAGE}{' '}
           <Button button="link" label={__('Upload Guide')} href="https://lbry.com/faq/video-publishing-guide" />
         </p>
       );

ui/component/router/view.jsx

@@ -1,5 +1,7 @@
 // @flow
+import type { RowDataItem } from 'homepage';
 import * as PAGES from 'constants/pages';
+import * as SIDEBAR_ROUTES from 'homepage';
 import React, { useEffect } from 'react';
 import { Route, Redirect, Switch, withRouter } from 'react-router-dom';
 import SettingsPage from 'page/settings';
@@ -51,6 +53,10 @@ import { LINKED_COMMENT_QUERY_PARAM } from 'constants/comment';
 import { parseURI } from 'lbry-redux';
 import { SITE_TITLE, WELCOME_VERSION } from 'config';
 
+const dynamicRoutes = Object.values(SIDEBAR_ROUTES).filter(
+  (potentialRoute: any) => potentialRoute && potentialRoute.route
+);
+
 // Tell the browser we are handling scroll restoration
 if ('scrollRestoration' in history) {
   history.scrollRestoration = 'manual';
@@ -185,13 +191,21 @@ function AppRouter(props: Props) {
 
       <Route path={`/`} exact component={HomePage} />
       <Route path={`/$/${PAGES.DISCOVER}`} exact component={DiscoverPage} />
+      {/* $FlowFixMe */}
+      {dynamicRoutes.map((dynamicRouteProps: RowDataItem) => (
+        <Route
+          key={dynamicRouteProps.route}
+          path={dynamicRouteProps.route}
+          component={routerProps => <DiscoverPage {...routerProps} dynamicRouteProps={dynamicRouteProps} />}
+        />
+      ))}
+
       <Route path={`/$/${PAGES.AUTH_SIGNIN}`} exact component={SignInPage} />
       <Route path={`/$/${PAGES.AUTH_PASSWORD_RESET}`} exact component={PasswordResetPage} />
       <Route path={`/$/${PAGES.AUTH_PASSWORD_SET}`} exact component={PasswordSetPage} />
       <Route path={`/$/${PAGES.AUTH}`} exact component={SignUpPage} />
       <Route path={`/$/${PAGES.AUTH}/*`} exact component={SignUpPage} />
       <Route path={`/$/${PAGES.WELCOME}`} exact component={Welcome} />
-      <Route path={`/$/${PAGES.YOUTUBE_SYNC}`} exact component={YoutubeSyncPage} />
 
       <Route path={`/$/${PAGES.HELP}`} exact component={HelpPage} />
       {/* @if TARGET='app' */}
@@ -209,6 +223,7 @@ function AppRouter(props: Props) {
       <Route path={`/$/${PAGES.INVITE}/:referrer`} exact component={InvitedPage} />
       <Route path={`/$/${PAGES.CHECKOUT}`} exact component={CheckoutPage} />
 
+      <PrivateRoute {...props} exact path={`/$/${PAGES.YOUTUBE_SYNC}`} component={YoutubeSyncPage} />
       <PrivateRoute {...props} exact path={`/$/${PAGES.TAGS_FOLLOWING}`} component={TagsFollowingPage} />
       <PrivateRoute
         {...props}

ui/component/searchOptions/view.jsx

@@ -55,11 +55,11 @@ const SearchOptions = (props: Props) => {
           </fieldset>
 
           <fieldset>
-            <legend className="search__legend">{__('File Types')}</legend>
+            <legend className="search__legend">{__('Type')}</legend>
             {[
               {
                 option: SEARCH_OPTIONS.MEDIA_VIDEO,
-                label: __('Videos'),
+                label: __('Video'),
               },
               {
                 option: SEARCH_OPTIONS.MEDIA_AUDIO,
@@ -67,7 +67,7 @@ const SearchOptions = (props: Props) => {
               },
               {
                 option: SEARCH_OPTIONS.MEDIA_IMAGE,
-                label: __('Images'),
+                label: __('Image'),
               },
               {
                 option: SEARCH_OPTIONS.MEDIA_TEXT,
@@ -75,7 +75,7 @@ const SearchOptions = (props: Props) => {
               },
               {
                 option: SEARCH_OPTIONS.MEDIA_APPLICATION,
-                label: __('Other Files'),
+                label: __('Other'),
               },
             ].map(({ option, label }) => (
               <FormField