comment out tagging

This commit is contained in:
Martina 2021-08-31 17:27:41 -07:00
parent c1d4aec9cb
commit c53f7a42af
5 changed files with 123 additions and 125 deletions

View File

@ -285,8 +285,8 @@ class CarouselSidebar extends React.Component {
body: this.props.file.body || "",
source: this.props.file.source || "",
author: this.props.file.author || "",
tags: this.props.file.data.tags || [],
suggestions: this.props.viewer?.tags || [],
// tags: this.props.file.data.tags || [],
// suggestions: this.props.viewer?.tags || [],
selected: {},
isUploading: false,
isDownloading: false,
@ -304,16 +304,16 @@ class CarouselSidebar extends React.Component {
}
};
componentDidUpdate = (prevProps, prevState) => {
if (!isEqual(prevState.tags, this.state.tags)) {
this.updateSuggestions();
}
};
// componentDidUpdate = (prevProps, prevState) => {
// if (!isEqual(prevState.tags, this.state.tags)) {
// this.updateSuggestions();
// }
// };
updateSuggestions = () => {
let newSuggestions = new Set([...this.state.suggestions, ...this.state.tags]);
this.setState({ suggestions: Array.from(newSuggestions) });
};
// updateSuggestions = () => {
// let newSuggestions = new Set([...this.state.suggestions, ...this.state.tags]);
// this.setState({ suggestions: Array.from(newSuggestions) });
// };
calculateSelected = () => {
if (!this.props.viewer) {
@ -348,12 +348,12 @@ class CarouselSidebar extends React.Component {
{
[e.target.name]: e.target.value,
showSavedMessage: false,
},
() => {
if (e.target.name === "Tags") {
this.updateSuggestions();
}
}
// () => {
// if (e.target.name === "Tags") {
// this.updateSuggestions();
// }
// }
);
};
@ -363,7 +363,7 @@ class CarouselSidebar extends React.Component {
_handleSave = async () => {
if (this.props.external || !this.props.isOwner) return;
this.props.onAction({ type: "UPDATE_VIEWER", viewer: { tags: this.state.suggestions } });
// this.props.onAction({ type: "UPDATE_VIEWER", viewer: { tags: this.state.suggestions } });
const response = await Actions.updateFile({
id: this.props.file.id,
name: this.state.name,
@ -581,7 +581,7 @@ class CarouselSidebar extends React.Component {
style={{ ...STYLES_INPUT, marginBottom: 12 }}
textStyle={{ color: Constants.system.white }}
/>
<div css={STYLES_OPTIONS_SECTION}>
{/* <div css={STYLES_OPTIONS_SECTION}>
<Tag
type="dark"
tags={this.state.tags}
@ -591,7 +591,7 @@ class CarouselSidebar extends React.Component {
// dropdownStyles={{ top: "50px" }}
onChange={this._handleChange}
/>
</div>
</div> */}
</div>
);
} else {

View File

@ -223,69 +223,69 @@ const STYLES_TAG = css`
}
`;
class Tags extends React.Component {
state = {
isTruncated: false,
truncateIndex: 0,
};
// class Tags extends React.Component {
// state = {
// isTruncated: false,
// truncateIndex: 0,
// };
listWrapper = React.createRef();
listEl = React.createRef();
// listWrapper = React.createRef();
// listEl = React.createRef();
componentDidMount() {
this._handleTruncate();
}
// componentDidMount() {
// this._handleTruncate();
// }
componentDidUpdate(prevProps, prevState) {
if (!isEqual(prevProps.tags, this.props.tags)) {
this._handleTruncate();
}
}
// componentDidUpdate(prevProps, prevState) {
// if (!isEqual(prevProps.tags, this.props.tags)) {
// this._handleTruncate();
// }
// }
_handleTruncate = () => {
const listWrapper = this.listWrapper.current?.getBoundingClientRect();
const tagNodes = this.listEl.current?.querySelectorAll("li");
const tagElems = Array.from(tagNodes);
// _handleTruncate = () => {
// const listWrapper = this.listWrapper.current?.getBoundingClientRect();
// const tagNodes = this.listEl.current?.querySelectorAll("li");
// const tagElems = Array.from(tagNodes);
let total = 0;
const truncateIndex = tagElems.findIndex((tagElem) => {
const { width } = tagElem?.getBoundingClientRect();
total += width;
// let total = 0;
// const truncateIndex = tagElems.findIndex((tagElem) => {
// const { width } = tagElem?.getBoundingClientRect();
// total += width;
if (total >= listWrapper.width - 50) {
return true;
}
});
// if (total >= listWrapper.width - 50) {
// return true;
// }
// });
if (truncateIndex > 0) {
this.setState({ isTruncated: true, truncateIndex });
return;
}
// if (truncateIndex > 0) {
// this.setState({ isTruncated: true, truncateIndex });
// return;
// }
this.setState({ isTruncated: false, truncateIndex: tagElems.length });
};
// this.setState({ isTruncated: false, truncateIndex: tagElems.length });
// };
render() {
const { tags } = this.props;
// render() {
// const { tags } = this.props;
return (
<div css={STYLES_TAGS_WRAPPER}>
<div ref={this.listWrapper} style={{ width: 340 }}>
<ul css={STYLES_LIST} ref={this.listEl}>
{(this.state.isTruncated ? tags.slice(0, this.state.truncateIndex) : tags).map(
(tag) => (
<li key={tag} css={STYLES_TAG}>
<span>{tag}</span>
</li>
)
)}
</ul>
{this.state.isTruncated && <span>...</span>}
</div>
</div>
);
}
}
// return (
// <div css={STYLES_TAGS_WRAPPER}>
// <div ref={this.listWrapper} style={{ width: 340 }}>
// <ul css={STYLES_LIST} ref={this.listEl}>
// {(this.state.isTruncated ? tags.slice(0, this.state.truncateIndex) : tags).map(
// (tag) => (
// <li key={tag} css={STYLES_TAG}>
// <span>{tag}</span>
// </li>
// )
// )}
// </ul>
// {this.state.isTruncated && <span>...</span>}
// </div>
// </div>
// );
// }
// }
function Footer({
type = "myslate",
@ -296,7 +296,7 @@ function Footer({
downloadFiles,
deleteFiles,
//NOTE(amine): Myslate actions
editTags,
// editTags,
//NOTE(amine): Collection actions
removeFromCollection,
saveCopy,
@ -322,7 +322,7 @@ function Footer({
>
Add to collection
</ButtonPrimary>
{isOwner && !isCollectionType && (
{/* {isOwner && !isCollectionType && (
<ButtonPrimary
transparent
style={{ color: Constants.system.white }}
@ -330,7 +330,7 @@ function Footer({
>
Edit tags
</ButtonPrimary>
)}
)} */}
{!isOwner && isCollectionType && (
<ButtonPrimary
transparent
@ -715,33 +715,34 @@ export default class DataView extends React.Component {
UserBehaviors.saveCopy({ files: items });
};
getCommonTagFromSelectedItems = () => {
const { items } = this.props;
const { checked } = this.state;
// getCommonTagFromSelectedItems = () => {
// const { items } = this.props;
// const { checked } = this.state;
if (!Object.keys(checked).length) {
return;
}
// if (!Object.keys(checked).length) {
// return;
// }
let allTagsFromSelectedItems = Object.keys(checked).map((index) =>
items[index].data.tags ? items[index].data.tags : []
);
// let allTagsFromSelectedItems = Object.keys(checked).map((index) =>
// items[index].data.tags ? items[index].data.tags : []
// );
let sortedItems = allTagsFromSelectedItems.sort((a, b) => a.length - b.length);
if (sortedItems.length === 0) {
return [];
}
// let sortedItems = allTagsFromSelectedItems.sort((a, b) => a.length - b.length);
// if (sortedItems.length === 0) {
// return [];
// }
let commonTags = sortedItems.shift().reduce((acc, cur) => {
if (acc.indexOf(cur) === -1 && sortedItems.every((item) => item.indexOf(cur) !== -1)) {
acc.push(cur);
}
// let commonTags = sortedItems.shift().reduce((acc, cur) => {
// if (acc.indexOf(cur) === -1 && sortedItems.every((item) => item.indexOf(cur) !== -1)) {
// acc.push(cur);
// }
return acc;
}, []);
// return acc;
// }, []);
// return commonTags;
// };
return commonTags;
};
render() {
let numChecked = Object.keys(this.state.checked).length || 0;
// const header = (
@ -778,18 +779,20 @@ export default class DataView extends React.Component {
// </span>
// </div>
// );
const handleEditTags = () => {
this.props.onAction({
type: "SIDEBAR",
value: "SIDEBAR_EDIT_TAGS",
data: {
numChecked,
commonTags: this.getCommonTagFromSelectedItems(),
objects: this.props.items,
checked: this.state.checked,
},
});
};
// const handleEditTags = () => {
// this.props.onAction({
// type: "SIDEBAR",
// value: "SIDEBAR_EDIT_TAGS",
// data: {
// numChecked,
// commonTags: this.getCommonTagFromSelectedItems(),
// objects: this.props.items,
// checked: this.state.checked,
// },
// });
// };
const footer = (
<React.Fragment>
{numChecked ? (
@ -803,7 +806,7 @@ export default class DataView extends React.Component {
deleteFiles={() => this.setState({ modalShow: true })}
close={this._handleCloseFooter}
//NOTE(amine): Myslate actions
editTags={handleEditTags}
// editTags={handleEditTags}
//NOTE(amine): Collection actions
removeFromCollection={this._handleRemoveFromCollection}
saveCopy={this._handleSaveCopy}
@ -928,11 +931,11 @@ export default class DataView extends React.Component {
name: <div style={{ fontSize: "0.9rem", padding: "18px 0" }}>Name</div>,
width: "100%",
},
{
key: "tags",
name: <div style={{ fontSize: "0.9rem", padding: "18px 0" }}>Tags</div>,
width: "360px",
},
// {
// key: "tags",
// name: <div style={{ fontSize: "0.9rem", padding: "18px 0" }}>Tags</div>,
// width: "360px",
// },
{
key: "size",
name: <div style={{ fontSize: "0.9rem", padding: "18px 0" }}>Size</div>,
@ -992,7 +995,7 @@ export default class DataView extends React.Component {
</FilePreviewBubble>
</Selectable>
),
tags: <>{each.data.tags?.length ? <Tags tags={each.data.tags} /> : null}</>,
// tags: <>{each.data.tags?.length ? <Tags tags={each.data.tags} /> : null}</>,
size: <div css={STYLES_VALUE}>{Strings.bytesToSize(each.size)}</div>,
more: this.props.isOwner ? (
<div

View File

@ -1069,9 +1069,7 @@ export class SearchModal extends React.Component {
? "Collections:"
: this.state.typeFilter === "USER"
? "Users:"
: this.state.typeFilter === "FILE"
? "Files:"
: "Tags:"}
: "Files:"}
</div>
) : null}
</div>
@ -1087,9 +1085,7 @@ export class SearchModal extends React.Component {
? "collections..."
: this.state.typeFilter === "USER"
? "users..."
: this.state.typeFilter === "FILE"
? "files..."
: "tags..."
: "files..."
}`}
onChange={this._handleChange}
ref={(c) => {

View File

@ -204,7 +204,7 @@ export const getById = async ({ id }) => {
}
}
const tags = Utilities.getUserTags({ library: user.library });
// const tags = Utilities.getUserTags({ library: user.library });
let viewer = {
id: user.id,
@ -226,7 +226,7 @@ export const getById = async ({ id }) => {
epubBytes,
pdfBytes,
},
tags,
// tags,
userBucketCID: bucketRoot?.path || null,
keys,
slates,

View File

@ -63,8 +63,8 @@ export const sanitizeFile = (entity) => {
linkFavicon: entity.linkFavicon,
linkHtml: entity.linkHtml,
linkIFrameAllowed: entity.linkIFrameAllowed,
tags: entity.tags,
data: {
tags: entity.data?.tags, //NOTE(martina): newly added
unity: entity.data?.unity, //NOTE(martina): newly added
},
downloadCount: entity.downloadCount,
@ -147,7 +147,6 @@ export const cleanFile = (entity) => {
linkHtml: entity.linkHtml,
linkIFrameAllowed: entity.linkIFrameAllowed,
// data: {
// tags: entity.data?.tags,
// unity: entity.data?.unity,
// },
};