adds tags to channelUpdate

package.json

@@ -124,7 +124,7 @@
     "jsmediatags": "^3.8.1",
     "json-loader": "^0.5.4",
     "lbry-format": "https://github.com/lbryio/lbry-format.git",
-    "lbry-redux": "lbryio/lbry-redux#bb82aed61a5569e565daa784eb25fc1d639c0c22",
+    "lbry-redux": "lbryio/lbry-redux#b07dfa172a526aa5e09af57bb6cf33790c8d0c91",
     "lbryinc": "lbryio/lbryinc#a93596c51c8fb0a226cb84df04c26a6bb60a45fb",
     "lint-staged": "^7.0.2",
     "localforage": "^1.7.1",

src/ui/component/channelEdit/view.jsx

@@ -5,6 +5,7 @@ import { Form, FormField } from 'component/common/form';
 import Button from 'component/button';
 
 import SelectAsset from '../selectAsset/view';
+import TagSelect from '../tagsSelect/view';
 
 type Props = {
   uri: string,
@@ -59,7 +60,11 @@ function ChannelForm(props: Props) {
     locations: locations || [],
     title: title,
     thumbnail: thumbnail,
-    tags: tags || [],
+    tags: tags
+      ? tags.map(tag => {
+          return { name: tag };
+        })
+      : [],
     claim_id: claimId,
     amount: amount,
   };
@@ -177,6 +182,25 @@ function ChannelForm(props: Props) {
             disabled={false}
             onChange={text => setParams({ ...params, description: text })}
           />
+          <TagSelect
+            title={false}
+            suggestMature
+            help={__('The better your tags are, the easier it will be for people to discover your content.')}
+            empty={__('No tags added')}
+            onSelect={newTag => {
+              if (!params.tags.map(savedTag => savedTag.name).includes(newTag.name)) {
+                setParams({ ...params, tags: [...params.tags, newTag] });
+              } else {
+                // If it already exists and the user types it in, remove it
+                setParams({ ...params, tags: params.tags.filter(tag => tag.name !== newTag.name) });
+              }
+            }}
+            onRemove={clickedTag => {
+              const newTags = params.tags.slice().filter(tag => tag.name !== clickedTag.name);
+              setParams({ ...params, tags: newTags });
+            }}
+            tagsChosen={params.tags || []}
+          />
           <div className={'card__actions'}>
             <Button
               button="primary"

src/ui/component/tagsSelect/view.jsx

@@ -8,14 +8,14 @@ import usePersistedState from 'util/use-persisted-state';
 import { useTransition, animated } from 'react-spring';
 
 type Props = {
-  showClose: boolean,
+  showClose?: boolean,
   followedTags: Array<Tag>,
-  doToggleTagFollow: string => void,
+  doToggleTagFollow?: string => void,
   suggestMature: boolean,
 
   // Ovverides
   // The default component is for following tags
-  title?: string,
+  title?: string | boolean,
   help?: string,
   empty?: string,
   tagsChosen?: Array<Tag>,
@@ -33,7 +33,7 @@ export default function TagSelect(props: Props) {
   const {
     showClose,
     followedTags,
-    doToggleTagFollow,
+    doToggleTagFollow = null,
     title,
     help,
     empty,
@@ -54,7 +54,7 @@ export default function TagSelect(props: Props) {
   function handleTagClick(tag) {
     if (onRemove) {
       onRemove(tag);
-    } else {
+    } else if (doToggleTagFollow) {
       doToggleTagFollow(tag.name);
     }
   }