removed collection level tags

components/api-docs/v2/create-collection.js

@@ -15,7 +15,6 @@ const EXAMPLE_CODE_JS = (key, slateId) => {
         name: "My Dog Fido",
         isPublic: true,
         body: "This is an album of my dog, Fido, a golden retriever",
-        tags: ["dogs", "retrievers", "golden retriever"]
       },
     }),
   });`;
@@ -34,7 +33,6 @@ postJson = {
         name: "My Dog Fido",
         isPublic: true,
         body: "This is an album of my dog, Fido, a golden retriever",
-        tags: ["dogs", "retrievers", "golden retriever"]
     }
   }
 

components/core/ScenePageHeader.js

@@ -47,18 +47,6 @@ const STYLES_HEADER = css`
   }
 `;
 
-const STYLES_ACCESS = css`
-  box-sizing: border-box;
-  font-family: ${Constants.font.text};
-  font-size: ${Constants.typescale.lvl1};
-  color: ${Constants.system.black};
-  margin: 12px 0;
-  line-height: 1.5;
-  display: block;
-  width: 100%;
-  max-width: 800px;
-`;
-
 const STYLES_DESCRIPTION = css`
   box-sizing: border-box;
   font-family: ${Constants.font.text};
@@ -77,40 +65,6 @@ const STYLES_DESCRIPTION = css`
   }
 `;
 
-const STYLES_TAGS_WRAPPER = css`
-  box-sizing: border-box;
-  display: block;
-  width: 100%;
-  max-width: 800px;
-`;
-
-const STYLES_LIST = css`
-  display: inline-flex;
-  flex-wrap: wrap;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-`;
-
-const STYLES_TAG = css`
-  list-style-type: none;
-  border-radius: 4px;
-  background: ${Constants.semantic.bgLight};
-  color: ${Constants.system.black};
-  font-family: ${Constants.font.text};
-  padding: 2px 8px;
-  margin: 8px 8px 0 0;
-
-  span {
-    line-height: 1.5;
-    font-size: 14px;
-  }
-
-  &:hover {
-    background: ${Constants.system.grayLight4};
-  }
-`;
-
 export const ScenePageHeader = (props) => {
   return (
     <header css={STYLES_ROOT} style={props.style}>
@@ -119,17 +73,6 @@ export const ScenePageHeader = (props) => {
         <div css={STYLES_DESCRIPTION}>
           <ProcessedText text={props.children} />
         </div>
-        {props.tags && (
-          <div css={STYLES_TAGS_WRAPPER}>
-            <ul css={STYLES_LIST}>
-              {props.tags.map((tag, i) => (
-                <li key={tag} css={STYLES_TAG}>
-                  <span>{tag}</span>
-                </li>
-              ))}
-            </ul>
-          </div>
-        )}
       </div>
       {props.actions ? <div css={STYLES_RIGHT}>{props.actions}</div> : null}
     </header>

components/core/SlatePreviewBlock.js

@@ -157,16 +157,6 @@ const STYLES_COPY_INPUT = css`
   opacity: 0;
 `;
 
-const STYLES_TAG = css`
-  margin-right: 16px;
-  padding: 4px 8px;
-  border-radius: 2px;
-  border: 1px solid ${Constants.system.black};
-  color: ${Constants.system.black};
-  font-family: ${Constants.font.semiBold};
-  font-size: 0.9rem;
-`;
-
 const STYLES_BODY = css`
   font-family: ${Constants.font.text};
   font-size: ${Constants.typescale.lvl0};

components/sidebars/SidebarCreateSlate.js

@@ -35,20 +35,9 @@ export default class SidebarCreateSlate extends React.Component {
     name: "",
     isPublic: true,
     body: "",
-    tags: [],
-    suggestions: this.props.viewer?.tags || [],
     loading: false,
   };
 
-  componentDidMount = () => {
-    this.updateSuggestions();
-  };
-
-  updateSuggestions = () => {
-    let newSuggestions = new Set([...this.state.suggestions, ...this.state.tags]);
-    this.setState({ suggestions: Array.from(newSuggestions) });
-  };
-
   _handleSubmit = async () => {
     this.setState({ loading: true });
 
@@ -62,7 +51,6 @@ export default class SidebarCreateSlate extends React.Component {
       name: this.state.name,
       isPublic: this.state.isPublic,
       body: this.state.body,
-      tags: this.state.tags,
     });
     console.log(response);
 
@@ -105,11 +93,7 @@ export default class SidebarCreateSlate extends React.Component {
   };
 
   _handleChange = (e) => {
-    this.setState({ [e.target.name]: e.target.value }, () => {
+    this.setState({ [e.target.name]: e.target.value });
-      if (e.target.name === "tags") {
-        this.updateSuggestions();
-      }
-    });
   };
 
   render() {
@@ -129,14 +113,14 @@ export default class SidebarCreateSlate extends React.Component {
 
         <div css={STYLES_GROUPING}>
           <System.P1 css={STYLES_HEADER}>Name</System.P1>
-          <System.P1
+          {/* <System.P1
             css={STYLES_TEXT}
             style={{
               marginTop: 12,
             }}
           >
             Give your collection a name so you and others can find it on Slate and on the web.
-          </System.P1>
+          </System.P1> */}
 
           <System.Input
             autoFocus
@@ -162,14 +146,14 @@ export default class SidebarCreateSlate extends React.Component {
 
         <div css={STYLES_GROUPING}>
           <System.P1 css={STYLES_HEADER}>Description</System.P1>
-          <System.P1
+          {/* <System.P1
             css={STYLES_TEXT}
             style={{
               marginTop: 12,
             }}
           >
             Give your collection a description, add links, and connect it to other collections.
-          </System.P1>
+          </System.P1> */}
 
           <System.Textarea
             style={{ marginTop: 12 }}
@@ -181,26 +165,6 @@ export default class SidebarCreateSlate extends React.Component {
           />
         </div>
 
-        <div css={STYLES_GROUPING}>
-          <System.P1 css={STYLES_HEADER}>Tags</System.P1>
-          <System.P1
-            css={STYLES_TEXT}
-            style={{
-              marginTop: 12,
-            }}
-          >
-            Add tags to a collection to categorize it.
-          </System.P1>
-          <System.Tag
-            name="tags"
-            placeholder={`Edit tags for ${this.state.name ? this.state.name : "this collection"}`}
-            tags={this.state.tags}
-            suggestions={this.state.suggestions}
-            style={{ marginTop: 12 }}
-            onChange={this._handleChange}
-          />
-        </div>
-
         <div css={STYLES_GROUPING}>
           <System.P1 css={STYLES_HEADER} style={{ marginBottom: 12 }}>
             Privacy

components/sidebars/SidebarSingleSlateSettings.js

@@ -51,20 +51,9 @@ export default class SidebarSingleSlateSettings extends React.Component {
     isPublic: this.props.data.isPublic,
     body: this.props.data.data.body,
     name: this.props.data.data.name,
-    tags: this.props.data.data?.tags || [],
-    suggestions: this.props.viewer?.tags || [],
     modalShow: false,
   };
 
-  componentDidMount = () => {
-    this.updateSuggestions();
-  };
-
-  updateSuggestions = () => {
-    let newSuggestions = new Set([...this.state.suggestions, ...this.state.tags]);
-    this.setState({ suggestions: Array.from(newSuggestions) });
-  };
-
   _handleSubmit = async () => {
     let slates = this.props.viewer.slates;
     for (let slate of slates) {
@@ -72,12 +61,10 @@ export default class SidebarSingleSlateSettings extends React.Component {
         slate.data.name = this.state.name;
         slate.isPublic = this.state.isPublic;
         slate.data.body = this.state.body;
-        slate.data.tags = this.state.tags;
 
-        let newSuggestions = new Set([...this.state.suggestions, ...this.state.tags]);
         this.props.onAction({
           type: "UPDATE_VIEWER",
-          viewer: { slates, tags: Array.from(newSuggestions) },
+          viewer: { slates },
         });
 
         break;
@@ -91,7 +78,6 @@ export default class SidebarSingleSlateSettings extends React.Component {
       data: {
         name: this.state.name,
         body: this.state.body,
-        tags: this.state.tags,
       },
     });
 
@@ -105,11 +91,7 @@ export default class SidebarSingleSlateSettings extends React.Component {
   };
 
   _handleChange = (e) => {
-    this.setState({ [e.target.name]: e.target.value }, () => {
+    this.setState({ [e.target.name]: e.target.value });
-      if (e.target.name === "tags") {
-        this.updateSuggestions();
-      }
-    });
   };
 
   _handleDelete = async (res) => {
@@ -172,14 +154,14 @@ export default class SidebarSingleSlateSettings extends React.Component {
 
         <div css={STYLES_GROUPING}>
           <System.P1 css={STYLES_HEADER}>Name</System.P1>
-          <System.P1
+          {/* <System.P1
             css={STYLES_TEXT}
             style={{
               marginTop: 12,
             }}
           >
             Give your collection a name so you and others can find it on Slate and on the web.
-          </System.P1>
+          </System.P1> */}
 
           <System.Input
             placeholder="Collection name..."
@@ -204,14 +186,14 @@ export default class SidebarSingleSlateSettings extends React.Component {
 
         <div css={STYLES_GROUPING}>
           <System.P1 css={STYLES_HEADER}>Description</System.P1>
-          <System.P1
+          {/* <System.P1
             css={STYLES_TEXT}
             style={{
               marginTop: 12,
             }}
           >
             Give your collection a description, add links, and connect it to other collections.
-          </System.P1>
+          </System.P1> */}
 
           <System.Textarea
             style={{ marginTop: 12 }}
@@ -223,26 +205,7 @@ export default class SidebarSingleSlateSettings extends React.Component {
           />
         </div>
 
-        <div css={STYLES_GROUPING}>
+        {/* <div css={STYLES_GROUPING}>
-          <System.P1 css={STYLES_HEADER}>Tags</System.P1>
-          <System.P1
-            css={STYLES_TEXT}
-            style={{
-              marginTop: 12,
-            }}
-          >
-            Add tags to a collection to categorize it.
-          </System.P1>
-          <System.Tag
-            name="tags"
-            tags={this.state.tags}
-            suggestions={this.state.suggestions}
-            style={{ marginTop: 12 }}
-            onChange={this._handleChange}
-          />
-        </div>
-
-        <div css={STYLES_GROUPING}>
           <System.P1 css={STYLES_HEADER}>Cover image</System.P1>
 
           <System.P1
@@ -256,9 +219,9 @@ export default class SidebarSingleSlateSettings extends React.Component {
           </System.P1>
 
           <div css={STYLES_IMAGE_BOX} style={{ marginTop: 24 }}>
-            <img src={preview} alt="" style={{ maxWidth: "368px", maxHeight: "368px" }} />
+            <img src={preview} alt="" style={{ maxWidth: "240px", maxHeight: "240px" }} />
           </div>
-        </div>
+        </div> */}
 
         <div css={STYLES_GROUPING}>
           <System.P1 css={STYLES_HEADER} style={{ marginBottom: 12 }}>

node_common/managers/viewer.js

@@ -201,7 +201,7 @@ export const getById = async ({ id }) => {
     }
   }
 
-  const tags = Utilities.getUserTags({ library: user.library, slates });
+  const tags = Utilities.getUserTags({ library: user.library });
 
   let viewer = {
     id: user.id,

node_common/serializers.js

@@ -34,7 +34,6 @@ export const sanitizeSlate = (entity) => {
       name: entity.data?.name,
       body: entity.data?.body,
       preview: entity.data?.preview,
-      tags: entity.data?.tags,
     },
     fileCount: entity.fileCount,
     subscriberCount: entity.subscriberCount,
@@ -109,7 +108,6 @@ export const cleanSlate = (entity) => {
     //   name: entity.data?.name,
     //   body: entity.data?.body,
     //   preview: entity.data?.preview,
-    //   tags: entity.data?.tags,
     // },
   };
 };

node_common/utilities.js

@@ -233,7 +233,7 @@ export const generateRandomNumberInRange = (min, max) =>
   Math.floor(Math.random() * (max - min)) + min;
 
 // NOTE(daniel): get all tags on slates and files
-export const getUserTags = ({ library, slates }) => {
+export const getUserTags = ({ library }) => {
   let tags = new Set();
 
   const isNotEmptyArray = (arr) => Array.isArray(arr) && arr?.length > 0;
@@ -246,14 +246,6 @@ export const getUserTags = ({ library, slates }) => {
     }
   });
 
-  slates.forEach((slate) => {
-    if (isNotEmptyArray(slate.data.tags)) {
-      for (let tag of slate.data.tags) {
-        tags.add(tag);
-      }
-    }
-  });
-
   return Array.from(tags);
 };
 

pages/api/slates/create.js

@@ -31,7 +31,6 @@ export default async (req, res) => {
     data: {
       name: req.body.data.name,
       body: req.body.data.body,
-      tags: req.body.data.tags,
     },
   });
 

pages/api/v2/create-collection.js

@@ -36,7 +36,6 @@ export default async (req, res) => {
     data: {
       name: req.body.data.name,
       body: req.body.data.body,
-      tags: req.body.data.tags,
     },
   });
 

scenes/SceneSlate.js

@@ -407,7 +407,6 @@ class SlatePage extends React.Component {
     let objects = this.props.data.objects;
     const isPublic = this.props.data.isPublic;
     const isOwner = this.props.viewer ? this.props.data.ownerId === this.props.viewer.id : false;
-    const tags = data.tags;
 
     let actions = isOwner ? (
       <span>
@@ -471,7 +470,6 @@ class SlatePage extends React.Component {
             )
           }
           actions={<span css={STYLES_MOBILE_HIDDEN}>{actions}</span>}
-          tags={tags}
         >
           {body}
         </ScenePageHeader>