limit tags on publishing to 5

static/app-strings.json

@@ -989,8 +989,6 @@
   "Share usage data with LBRY inc.": "Share usage data with LBRY inc.",
   "Required": "Required",
   "Email %help_link% or join our %chat_link% if you encounter any trouble verifying.": "Email %help_link% or join our %chat_link% if you encounter any trouble verifying.",
-  "Only apply a few tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.": "Only apply a few tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.",
-  "Add relevant tags...": "Add relevant tags...",
   "try again in a few seconds.": "try again in a few seconds.",
   "Any": "Any",
   "Video": "Video",
@@ -1005,5 +1003,12 @@
   "Model": "Model",
   "Binary": "Binary",
   "Other": "Other",
-  "For video content, use MP4s in H264/AAC format and a friendly bitrate (720p) for more reliable streaming.": "For video content, use MP4s in H264/AAC format and a friendly bitrate (720p) for more reliable streaming."
-}
+  "For video content, use MP4s in H264/AAC format and a friendly bitrate (720p) for more reliable streaming.": "For video content, use MP4s in H264/AAC format and a friendly bitrate (720p) for more reliable streaming.",
+  "Show reposts": "Show reposts",
+  "Show reposts from the creators you follow.": "Show reposts from the creators you follow.",
+  "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.",
+  "Only apply a few tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.": "Only apply a few tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.",
+  "Add relevant tags...": "Add relevant tags...",
+  "Enter up to five (5) tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.": "Enter up to five (5) tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.",
+  "Sorry, your request timed out. Modify your options or %again%": "Sorry, your request timed out. Modify your options or %again%"
+}

ui/component/publishForm/view.jsx

@@ -87,8 +87,10 @@ function PublishForm(props: Props) {
     publish,
     disabled = false,
   } = props;
+  const TAGS_LIMIT = 5;
   const formDisabled = (!filePath && !editingURI) || publishing;
   const isInProgress = filePath || editingURI || name || title;
+  const tagsCount = tags && tags.length;
 
   // If they are editing, they don't need a new file chosen
   const formValidLessFile =
@@ -152,15 +154,16 @@ function PublishForm(props: Props) {
           hideHeader
           label={__('Selected Tags')}
           empty={__('No tags added')}
+          limit={TAGS_LIMIT}
           help={__(
-            'Only apply a few tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.'
+            'Enter up to five (5) tags that are relevant to your content, and use the Mature tag as appropriate. Tag abuse will not be tolerated.'
           )}
           placeholder={__('Add relevant tags...')}
           onSelect={newTags => {
             const validatedTags = [];
             newTags.forEach(newTag => {
               if (!tags.some(tag => tag.name === newTag.name)) {
-                validatedTags.push(newTag);
+                if (tagsCount + validatedTags.length < TAGS_LIMIT) validatedTags.push(newTag);
               }
             });
             updatePublishForm({ tags: [...tags, ...validatedTags] });

ui/component/tagsSearch/view.jsx

@@ -16,6 +16,7 @@ type Props = {
   onRemove: Tag => void,
   placeholder?: string,
   label?: string,
+  disabled?: boolean,
 };
 
 /*
@@ -38,6 +39,7 @@ export default function TagsSearch(props: Props) {
     disableAutoFocus,
     placeholder,
     label,
+    disabled,
   } = props;
   const [newTag, setNewTag] = useState('');
   const doesTagMatch = name => {
@@ -128,6 +130,7 @@ export default function TagsSearch(props: Props) {
               placeholder={placeholder || __('Follow more tags')}
               type="text"
               value={newTag}
+              disabled={disabled}
             />
           </li>
         </ul>
@@ -135,7 +138,7 @@ export default function TagsSearch(props: Props) {
       <label>{__('Suggested')}</label>
       <ul className="tags">
         {suggestedTags.map(tag => (
-          <Tag key={`suggested${tag}`} name={tag} type="add" onClick={() => handleTagClick(tag)} />
+          <Tag disabled={disabled} key={`suggested${tag}`} name={tag} type="add" onClick={() => handleTagClick(tag)} />
         ))}
         {!suggestedTags.length && <p className="empty tags__empty-message">No suggested tags</p>}
       </ul>

ui/component/tagsSelect/view.jsx

@@ -24,6 +24,7 @@ type Props = {
   placeholder?: string,
   disableAutoFocus?: boolean,
   hideHeader?: boolean,
+  limit?: number,
 };
 
 /*
@@ -44,6 +45,7 @@ export default function TagsSelect(props: Props) {
     placeholder,
     hideHeader,
     label,
+    limit,
   } = props;
   const [hasClosed, setHasClosed] = usePersistedState('tag-select:has-closed', false);
   const tagsToDisplay = tagsChosen || followedTags;
@@ -105,6 +107,7 @@ export default function TagsSelect(props: Props) {
               disableAutoFocus={disableAutoFocus}
               tagsPassedIn={tagsToDisplay}
               placeholder={placeholder}
+              disabled={limit && tagCount >= limit}
             />
           </React.Fragment>
         }