Merge pull request #896 from filecoin-project/@martinalong/remove-collection-level-tags

Removed collection level tags
2024-11-22 21:45:56 +03:00 · 2021-08-24 15:00:11 -07:00 · 2021-08-24 15:00:11 -07:00 · 0fdc846179
commit 0fdc846179
parent 70b95110e7 9110cdc313
11 changed files with 16 additions and 172 deletions
--- a/components/api-docs/v2/create-collection.js
+++ b/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"]
    }
  }

--- a/components/core/ScenePageHeader.js
+++ b/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>
--- a/components/core/SlatePreviewBlock.js
+++ b/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};
--- a/components/sidebars/SidebarCreateSlate.js
+++ b/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 }, () => {
-      if (e.target.name === "tags") {
-        this.updateSuggestions();
-      }
-    });
+    this.setState({ [e.target.name]: e.target.value });
  };

  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
--- a/components/sidebars/SidebarSingleSlateSettings.js
+++ b/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 }, () => {
-      if (e.target.name === "tags") {
-        this.updateSuggestions();
-      }
-    });
+    this.setState({ [e.target.name]: e.target.value });
  };

  _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}>
-          <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}>
+        {/* <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 }}>
--- a/node_common/managers/viewer.js
+++ b/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,
--- a/node_common/serializers.js
+++ b/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,
    // },
  };
 };
--- a/node_common/utilities.js
+++ b/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);
 };

--- a/pages/api/slates/create.js
+++ b/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,
    },
  });

--- a/pages/api/v2/create-collection.js
+++ b/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,
    },
  });

--- a/scenes/SceneSlate.js
+++ b/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>