Skip to content

Design/updating ds page #281

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

Open
Arbyhisenaj wants to merge 12 commits into
base: main
Choose a base branch
from
Open

Design/updating ds page #281

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
b8476c6
clustering
Arbyhisenaj Jan 21, 2026
5369fc4
removed use memo
Arbyhisenaj Jan 21, 2026
14fc517
colours pre-back end
Arbyhisenaj Jan 21, 2026
8714588
colour preservation using config
Arbyhisenaj Jan 21, 2026
546f161
individual marker colours
Arbyhisenaj Jan 21, 2026
a649bd6
folder colours and drag preview
Arbyhisenaj Jan 21, 2026
328f1fd
rearrange display as order
Arbyhisenaj Jan 21, 2026
c615633
lint fix
Arbyhisenaj Jan 21, 2026
9650f63
init
Arbyhisenaj Jan 21, 2026
10c60a7
update colours
Arbyhisenaj Jan 21, 2026
5c63bbb
Update UserDataSourcesList.tsx
Arbyhisenaj Jan 21, 2026
b8588ed
formatting
Arbyhisenaj Jan 22, 2026
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
45 changes: 32 additions & 13 deletions src/app/(private)/data-sources/components/UserDataSourcesList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
"use client";

import { Boxes, Database, PlusIcon, Users } from "lucide-react";
import { Boxes, Database, PlusIcon, Users, UsersIcon } from "lucide-react";
import { useMemo, useState } from "react";
import { CollectionIcon } from "@/app/map/[id]/components/Icons";
import { mapColors } from "@/app/map/[id]/styles";
import { DataSourceItem } from "@/components/DataSourceItem";
import DataSourceRecordTypeIcon, {
dataSourceRecordTypeColors,
Expand All @@ -30,17 +28,39 @@ export default function UserDataSourcesList({

const memberDataSources = useMemo(
() =>
dataSources?.filter(
(dataSource) => dataSource.recordType === DataSourceRecordType.Members,
),
dataSources
?.filter(
(dataSource) =>
dataSource.recordType === DataSourceRecordType.Members,
)
.sort((a, b) => {
const aDate = a.importInfo?.lastCompleted
? new Date(a.importInfo.lastCompleted).getTime()
: 0;
const bDate = b.importInfo?.lastCompleted
? new Date(b.importInfo.lastCompleted).getTime()
: 0;
return bDate - aDate; // Most recent first
}),
[dataSources],
);

const otherDataSources = useMemo(
() =>
dataSources?.filter(
(dataSource) => dataSource.recordType !== DataSourceRecordType.Members,
),
dataSources
?.filter(
(dataSource) =>
dataSource.recordType !== DataSourceRecordType.Members,
)
.sort((a, b) => {
const aDate = a.importInfo?.lastCompleted
? new Date(a.importInfo.lastCompleted).getTime()
: 0;
const bDate = b.importInfo?.lastCompleted
? new Date(b.importInfo.lastCompleted).getTime()
: 0;
return bDate - aDate; // Most recent first
}),
[dataSources],
);

Expand Down Expand Up @@ -96,8 +116,8 @@ export default function UserDataSourcesList({

{/* Member Collections Section */}
<div>
<h2 className="text-lg font-semibold mb-4 flex items-center gap-2">
<CollectionIcon color={mapColors.member.color} />
<h2 className="text-lg font-medium mb-4 flex items-center gap-2">
<UsersIcon className="w-4 h-4 text-neutral-500" />
Member data sources
</h2>
<div className="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4 ">
Expand All @@ -122,8 +142,7 @@ export default function UserDataSourcesList({
{/* Other Data Sources Section */}
<div>
<div className="flex items-center mb-6 gap-4">
<h2 className="text-lg font-semibold flex items-center gap-2">
<CollectionIcon color={mapColors.dataSource.color} />
<h2 className="text-lg font-medium flex items-center gap-2">
Other data sources
</h2>
<div className="flex gap-2 flex-wrap">
Expand Down
Loading