Fixed dashboard ordering issue. Closes #1414

This commit is contained in:
Mike Cao 2022-08-29 20:57:34 -07:00
parent d4eddaa636
commit fb39ce8822
4 changed files with 21 additions and 14 deletions

View file

@ -3,7 +3,7 @@ import { defineMessages, useIntl } from 'react-intl';
import { DragDropContext, Draggable, Droppable } from 'react-beautiful-dnd';
import classNames from 'classnames';
import Button from 'components/common/Button';
import { sortArrayByMap } from 'lib/array';
import { firstBy } from 'thenby';
import useDashboard, { saveDashboard } from 'store/dashboard';
import styles from './DashboardEdit.module.css';
@ -21,7 +21,13 @@ export default function DashboardEdit({ websites }) {
const { formatMessage } = useIntl();
const [order, setOrder] = useState(websiteOrder || []);
const ordered = useMemo(() => sortArrayByMap(websites, order, 'website_id'), [websites, order]);
const ordered = useMemo(
() =>
websites
.map(website => ({ ...website, order: order.indexOf(website.website_id) }))
.sort(firstBy('order')),
[websites, order],
);
function handleWebsiteDrag({ destination, source }) {
if (!destination || destination.index === source.index) return;

View file

@ -6,8 +6,8 @@ import EmptyPlaceholder from 'components/common/EmptyPlaceholder';
import Arrow from 'assets/arrow-right.svg';
import styles from './WebsiteList.module.css';
import useDashboard from 'store/dashboard';
import { sortArrayByMap } from 'lib/array';
import { useMemo } from 'react';
import { firstBy } from 'thenby';
const messages = defineMessages({
noWebsites: {
@ -25,7 +25,10 @@ export default function WebsiteList({ websites, showCharts, limit }) {
const { formatMessage } = useIntl();
const ordered = useMemo(
() => sortArrayByMap(websites, websiteOrder, 'website_id'),
() =>
websites
.map(website => ({ ...website, order: websiteOrder.indexOf(website.website_id) || 0 }))
.sort(firstBy('order')),
[websites, websiteOrder],
);