Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: enable delete feedback based on BE info #2

Merged
merged 3 commits into from
Mar 4, 2024
Merged

feat: enable delete feedback based on BE info #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
782613e
feat: enable delete feedback based on BE info
giuliaghisini Feb 15, 2024
e765d38
fix: linters
pnicolli Mar 4, 2024
6c05f92
Merge branch 'main' into can_delete_feedbacks
giuliaghisini Mar 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
112 changes: 63 additions & 49 deletions src/components/manage/VFPanel/VFPanel.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -158,6 +158,11 @@ const VFPanel = ({ moment: Moment, toastify }) => {
}, [searchableText]);

const feedbacks = useSelector((state) => state.getFeedbacks);
const can_delete_feedbacks = useSelector(
(state) =>
state.getFeedbacks.result?.actions?.can_delete_feedbacks ?? false,
);

const isUnauthorized = useMemo(
() => feedbacks?.error && feedbacks?.error?.status === 401,
// eslint-disable-next-line react-hooks/exhaustive-deps
Expand Down Expand Up @@ -251,7 +256,10 @@ const VFPanel = ({ moment: Moment, toastify }) => {
{intl.formatMessage(messages.feedbacks_controlpanel)}
</Segment>

<VFPanelMenu doSearch={doSearch} />
<VFPanelMenu
doSearch={doSearch}
can_delete_feedbacks={can_delete_feedbacks}
/>

<Segment>
{itemsSelected.length > 0 && (
Expand All @@ -261,13 +269,15 @@ const VFPanel = ({ moment: Moment, toastify }) => {
{intl.formatMessage(messages.items_selected)}
</div>
<div className="actions">
<Button
type="button"
color="red"
onClick={() => setShowConfirmDelete(true)}
>
{intl.formatMessage(messages.reset_feedbacks)}
</Button>
{can_delete_feedbacks && (
<Button
type="button"
color="red"
onClick={() => setShowConfirmDelete(true)}
>
{intl.formatMessage(messages.reset_feedbacks)}
</Button>
)}
</div>
</Message>
)}
Expand All @@ -293,27 +303,29 @@ const VFPanel = ({ moment: Moment, toastify }) => {
>
<Table.Header>
<Table.Row>
<Table.HeaderCell
width={1}
textAlign="center"
verticalAlign="middle"
>
<Checkbox
title={intl.formatMessage(messages.select_all)}
checked={
feedbacks?.result?.items?.length !== 0 &&
itemsSelected?.length ===
feedbacks?.result?.items?.length
}
onChange={(e, o) => {
if (o.checked) {
setItemsSelected(feedbacks?.result?.items);
} else {
setItemsSelected([]);
{can_delete_feedbacks && (
<Table.HeaderCell
width={1}
textAlign="center"
verticalAlign="middle"
>
<Checkbox
title={intl.formatMessage(messages.select_all)}
checked={
feedbacks?.result?.items?.length !== 0 &&
itemsSelected?.length ===
feedbacks?.result?.items?.length
}
}}
/>
</Table.HeaderCell>
onChange={(e, o) => {
if (o.checked) {
setItemsSelected(feedbacks?.result?.items);
} else {
setItemsSelected([]);
}
}}
/>
</Table.HeaderCell>
)}
<Table.HeaderCell
sorted={
sort_on === 'title' ? fixSemanticOrdering() : null
Expand Down Expand Up @@ -427,27 +439,29 @@ const VFPanel = ({ moment: Moment, toastify }) => {
{feedbacks?.loaded &&
feedbacks.result?.items?.map((item) => (
<tr key={item.uid}>
<Table.Cell textAlign="center">
<Checkbox
title={intl.formatMessage(messages.select_item)}
checked={itemsSelected.some(
(is) => is.url === item.url,
)}
onChange={(e, o) => {
if (o.checked) {
let s = [...itemsSelected];
s.push(item);
setItemsSelected(s);
} else {
setItemsSelected(
itemsSelected.filter(
(i) => i.url !== item.url,
),
);
}
}}
/>
</Table.Cell>
{can_delete_feedbacks && (
<Table.Cell textAlign="center">
<Checkbox
title={intl.formatMessage(messages.select_item)}
checked={itemsSelected.some(
(is) => is.url === item.url,
)}
onChange={(e, o) => {
if (o.checked) {
let s = [...itemsSelected];
s.push(item);
setItemsSelected(s);
} else {
setItemsSelected(
itemsSelected.filter(
(i) => i.url !== item.url,
),
);
}
}}
/>
</Table.Cell>
)}
<Table.Cell>
<a
href={flattenToAppURL(item.url)}
Expand Down
34 changes: 18 additions & 16 deletions src/components/manage/VFPanel/VFPanelMenu.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ const messages = defineMessages({
defaultMessage: 'Loading...',
},
});
const VFPanelMenu = ({ toastify, doSearch }) => {
const VFPanelMenu = ({ toastify, doSearch, can_delete_feedbacks }) => {
const intl = useIntl();
const dispatch = useDispatch();
const [openConfirm, setOpenConfirm] = useState(false);
Expand Down Expand Up @@ -99,21 +99,23 @@ const VFPanelMenu = ({ toastify, doSearch }) => {
</Button>
</Menu.Item>

<Menu.Menu position="right">
<Menu.Item>
<Button
color="red"
icon
labelPosition="right"
onClick={() => setOpenConfirm(true)}
>
{intl.formatMessage(messages.delete_all)}
<i className="icon">
<Icon name={trashSVG} size="20px" />
</i>
</Button>
</Menu.Item>
</Menu.Menu>
{can_delete_feedbacks && (
<Menu.Menu position="right">
<Menu.Item>
<Button
color="red"
icon
labelPosition="right"
onClick={() => setOpenConfirm(true)}
>
{intl.formatMessage(messages.delete_all)}
<i className="icon">
<Icon name={trashSVG} size="20px" />
</i>
</Button>
</Menu.Item>
</Menu.Menu>
)}
<Confirm
cancelButton={intl.formatMessage(messages.cancel)}
open={openConfirm}
Expand Down