muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00
Code Packages Activity Actions

added tag deletion interface

Browse source
This commit is contained in:
Fedor Katurov 2021-09-28 15:39:29 +07:00
parent 0a75feef8d
commit 04a7b28a53
16 changed files with 195 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/node/NodeBottomBlock/index.tsx
View file

@ -16,6 +16,7 @@ import { NodeAuthorBlock } from '~/components/node/NodeAuthorBlock';
interface IProps {
node: INode;
canEdit: boolean;
isLoading: boolean;
commentsOrder: 'ASC' | 'DESC';
comments: IComment[];
@ -26,6 +27,7 @@ interface IProps {
const NodeBottomBlock: FC<IProps> = ({
node,
canEdit,
isLoading,
isLoadingComments,
comments,
@ -66,7 +68,7 @@ const NodeBottomBlock: FC<IProps> = ({
<NodeAuthorBlock node={node} />
</div>
<div className={styles.left_item}>
<NodeTagsBlock node={node} isLoading={isLoading} />
<NodeTagsBlock node={node} canEdit={canEdit} isLoading={isLoading} />
</div>
<div className={styles.left_item}>
<NodeRelatedBlock isLoading={isLoading} node={node} related={related} />

21
src/components/node/NodeTags/index.tsx
View file

@ -3,16 +3,27 @@ import { ITag } from '~/redux/types';
import { Tags } from '~/components/tags/Tags';
interface IProps {
is_deletable?: boolean;
is_editable?: boolean;
tags: ITag[];
onChange?: (tags: string[]) => void;
onTagClick?: (tag: Partial<ITag>) => void;
onTagDelete?: (id: ITag['ID']) => void;
}
const NodeTags: FC<IProps> = memo(({ is_editable, tags, onChange, onTagClick }) => {
return (
<Tags tags={tags} is_editable={is_editable} onTagsChange={onChange} onTagClick={onTagClick} />
);
});
const NodeTags: FC<IProps> = memo(
({ is_editable, is_deletable, tags, onChange, onTagClick, onTagDelete }) => {
return (
<Tags
tags={tags}
is_editable={is_editable}
onTagsChange={onChange}
onTagClick={onTagClick}
onTagDelete={onTagDelete}
is_deletable={is_deletable}
/>
);
}
);
export { NodeTags };

14
src/components/node/NodeTagsBlock/index.tsx
View file

@ -1,7 +1,7 @@
import React, { FC, useCallback } from 'react';
import { INode, ITag } from '~/redux/types';
import { URLS } from '~/constants/urls';
import { nodeUpdateTags } from '~/redux/node/actions';
import { nodeDeleteTag, nodeUpdateTags } from '~/redux/node/actions';
import { useDispatch } from 'react-redux';
import { useHistory } from 'react-router';
import { NodeTags } from '~/components/node/NodeTags';
@ -9,10 +9,11 @@ import { useUser } from '~/utils/hooks/user/userUser';
interface IProps {
node: INode;
canEdit: boolean;
isLoading: boolean;
}
const NodeTagsBlock: FC<IProps> = ({ node, isLoading }) => {
const NodeTagsBlock: FC<IProps> = ({ node, canEdit, isLoading }) => {
const dispatch = useDispatch();
const history = useHistory();
const { is_user } = useUser();
@ -35,6 +36,13 @@ const NodeTagsBlock: FC<IProps> = ({ node, isLoading }) => {
[history, node]
);
const onTagDelete = useCallback(
(tagId: ITag['ID']) => {
dispatch(nodeDeleteTag(node.id, tagId));
},
[dispatch, node.id]
);
if (isLoading) {
return null;
}
@ -42,9 +50,11 @@ const NodeTagsBlock: FC<IProps> = ({ node, isLoading }) => {
return (
<NodeTags
is_editable={is_user}
is_deletable={canEdit}
tags={node.tags}
onChange={onTagsChange}
onTagClick={onTagClick}
onTagDelete={onTagDelete}
/>
);
};