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.

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

PoC sorting by binary index and municipality #632

Draft
wants to merge 1 commit into
base: staging
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
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
38 changes: 33 additions & 5 deletions components/ComparisonTable.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,4 @@
import {
Fragment, useEffect, useState,
} from 'react'
import { Dispatch, Fragment, SetStateAction, useEffect, useState } from 'react'
import { useRouter } from 'next/router'
import styled from 'styled-components'
import {
Expand Down Expand Up @@ -155,10 +153,21 @@ function ComparisonTable<T extends object>({
data,
columns,
dataType = 'municipalities',
hasBinaryIndexColumn,
renderSubComponent,
}: TableProps<T>) {
const { preparedColumns, defaultSorting } = prepareColumnsForDefaultSorting(columns)
const [sorting, setSorting] = useState<SortingState>(defaultSorting)
const customSort = [
{
id: 'index',
desc: false,
},
{
id: 'name',
desc: false,
},
]
const [sorting, setSorting] = useState<SortingState>(customSort)
const router = useRouter()
const [resizeCount, setResizeCount] = useState(0)

Expand All @@ -178,11 +187,30 @@ function ComparisonTable<T extends object>({
return index > 1
}

const sortIntercept: Dispatch<SetStateAction<SortingState>> = (newSort) => {
if (hasBinaryIndexColumn) {
// TODO Benni add check whether this is callable
const requestedSorting = newSort()

// If we're attempting to sort by the index column (first column)
if (requestedSorting[0].id === 'index') {
// Then add 'name' as secondary sorting column
requestedSorting.push({
id: 'name',
desc: false,
})
}
setSorting(requestedSorting)
} else {
setSorting(newSort)
}
}

const table = useReactTable({
data,
columns: preparedColumns,
state: { sorting },
onSortingChange: setSorting,
onSortingChange: sortIntercept,
enableExpanding,
getCoreRowModel: getCoreRowModel(),
getSortedRowModel: getSortedRowModel(),
Expand Down
18 changes: 15 additions & 3 deletions components/RegionalView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -109,6 +109,11 @@ const ComparisonContainer = styled.div<{ dataView: string }>`
}
`

const DATASETS_WITH_BINARY_INDEX_COLUMN: Array<DatasetKey> = [
'klimatplanerna',
'upphandlingarna',
]

type RegionalViewProps = {
municipalities: Array<Municipality>
selectedDataset: DatasetKey
Expand Down Expand Up @@ -166,9 +171,16 @@ function RegionalView({
</>
), [datasetDescription.boundaries, datasetDescription.labelRotateUp, datasetDescription.labels, municipalityData])

const renderList = useCallback(() => (
<ComparisonTable data={rankedData[selectedDataset]} columns={cols} />
), [rankedData, selectedDataset, cols])
const renderList = useCallback(
() => (
<ComparisonTable
data={rankedData[selectedDataset]}
columns={cols}
hasBinaryIndexColumn={DATASETS_WITH_BINARY_INDEX_COLUMN.includes(selectedDataset)}
/>
),
[rankedData, selectedDataset, cols],
)

const dataViews = {
lista: {
Expand Down