Update store badges to use configured colors from the administration module

Modify the Dashboard component to dynamically set the background and border colors of participating store badges based on the `group.color` property, enhancing visual consistency with store configurations. The `selectedStoreId` prop is used to apply a ring effect to the currently active store.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 98f01874-e00c-4bbe-9d71-b0b338001848
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/98f01874-e00c-4bbe-9d71-b0b338001848/XDIQsDu
This commit is contained in:
michaelschal committed 2025-09-01 20:23:25 +00:00
1 parent 5fbdc67153
commit d9120a3e6b
1 file changed
+17 -12
+17 -12
View File
@@ -568,18 +568,23 @@ export default function Dashboard() {
<span className="text-red-400">Aucun magasin</span>
) : (
<div className="flex flex-wrap gap-1">
{participatingStores.map((participation: any) => (
<Badge
key={participation.groupId}
className={`text-xs ${
selectedStoreId && participation.groupId === parseInt(selectedStoreId.toString())
? 'bg-green-100 text-green-800 border border-green-300'
: 'bg-gray-100 text-gray-700'
}`}
>
{participation.group.name}
</Badge>
))}
{participatingStores.map((participation: any) => {
const isCurrentStore = selectedStoreId && participation.groupId === parseInt(selectedStoreId.toString());
const groupColor = participation.group?.color || '#1976D2';
return (
<Badge
key={participation.groupId}
className={`text-xs text-white border ${isCurrentStore ? 'ring-2 ring-white ring-offset-1' : ''}`}
style={{
backgroundColor: groupColor,
borderColor: groupColor
}}
>
{participation.group.name}
</Badge>
);
})}
</div>
)}
</div>