Skip to content

Commit

Permalink
feat(redmine 1298964): Add reactivitiy for remove button
Browse files Browse the repository at this point in the history
  • Loading branch information
pereag committed Jun 13, 2024
1 parent 6dc8c53 commit 8cae60c
Showing 1 changed file with 165 additions and 125 deletions.
290 changes: 165 additions & 125 deletions packages/storybook-pages/src/Pages/AgendaPage/AgendaPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,140 +2,180 @@

import type { ReactElement } from 'react';

import { Badge, Group } from '@mantine/core';
import { Badge, Button, Group } from '@mantine/core';
import { PencilSimple, Trash } from '@phosphor-icons/react';
import { Table } from '@smile/haring-react-table';
import { useState } from 'react';

/**
* Primary UI component for user interaction
*/
export function AgendaPage(): ReactElement {
const [data, setData] = useState([

Check failure on line 11 in packages/storybook-pages/src/Pages/AgendaPage/AgendaPage.tsx

View workflow job for this annotation

GitHub Actions / test

'data' is assigned a value but never used. Allowed unused elements of array destructuring patterns must match /^_/u

Check failure on line 11 in packages/storybook-pages/src/Pages/AgendaPage/AgendaPage.tsx

View workflow job for this annotation

GitHub Actions / test

'setData' is assigned a value but never used. Allowed unused elements of array destructuring patterns must match /^_/u
{
id: 0,
indicator: [{ color: 'blue', value: 'DEV' }],
schedules: { startTime: '9h30' },
subject: {
content:
'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.',
title: 'Dally MFC',
},
},
{
id: 1,
indicator: [
{ color: 'blue', value: 'DEV' },
{ color: 'green', value: 'UI' },
],
schedules: { endTime: '12h', startTime: '11h' },
subject: {
content:
'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.',
title: 'AMF review sprint 2',
},
},
{
id: 2,
indicator: [
{ color: 'orange', value: 'UX' },
{ color: 'green', value: 'UI' },
],
schedules: { endTime: '18h', startTime: '16h30' },
subject: {
content:
'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.',
title: 'Brainstorming Maquettes TTTS',
},
},
]);
return (
<Table
actions={[
{
icon: <PencilSimple />,
id: 'edit',
label: 'Edit document',
onAction: () => {
console.log('Edit');
<>
<Button>Ajouter un sujet</Button>
<Table
actions={[
{
icon: <PencilSimple />,
id: 'edit',
label: 'Edit document',
onAction: () => {
window.parent.location.href =
'http://localhost:6006/?path=/story/3-custom-pages-agendaitempage--agenda-item-page';
},
},
},
{
color: 'red',
confirmModalProps: {
children: 'Are you sure you want to delete ?',
confirmColor: 'red',
confirmLabel: 'Delete',
onCancel: () => {
console.log('Delete:cancel');
{
color: 'red',
confirmModalProps: {
children: 'Are you sure you want to delete ?',
confirmColor: 'red',
confirmLabel: 'Delete',
onCancel: () => {
console.log('Delete:cancel');

Check warning on line 70 in packages/storybook-pages/src/Pages/AgendaPage/AgendaPage.tsx

View workflow job for this annotation

GitHub Actions / test

Unexpected console statement
},
onConfirm: () => {
console.log('Delete:Confirm');

Check warning on line 73 in packages/storybook-pages/src/Pages/AgendaPage/AgendaPage.tsx

View workflow job for this annotation

GitHub Actions / test

Unexpected console statement
},
title: 'Delete ?',
},
onConfirm: () => {
console.log('Delete:Confirm');
confirmation: true,
icon: <Trash />,
id: 'delete',
isMassAction: true,
label: 'Delete',
onAction: () => {
console.log('Delete');

Check warning on line 83 in packages/storybook-pages/src/Pages/AgendaPage/AgendaPage.tsx

View workflow job for this annotation

GitHub Actions / test

Unexpected console statement
},
title: 'Delete ?',
},
confirmation: true,
icon: <Trash />,
id: 'delete',
isMassAction: true,
label: 'Delete',
onAction: () => {
console.log('Delete');
]}
columns={[
{
accessorKey: 'subject',
header: 'Sujets',
},
{
accessorKey: 'indicator',
header: 'Indicateurs',
},
{
accessorKey: 'schedules',
header: 'Horaires',
},
]}
data={[
{
indicator: (
<Group gap="5px">
<Badge color="blue">DEV</Badge>
</Group>
),
schedules: (
<div>
<p>
<strong>À 9h30</strong>
</p>
</div>
),
subject: (
<div>
<strong>Dally MFC </strong>
<br />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
do eiusmod tempor incididunt.
</p>
</div>
),
},
{
indicator: (
<Group gap="5px">
<Badge color="blue">Dev</Badge>
<Badge>UI</Badge>
</Group>
),
schedules: (
<div>
<p>
<strong>De 11h à 12h</strong>
</p>
</div>
),
subject: (
<div>
<strong>AMF review sprint 2 </strong>
<br />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
do eiusmod tempor incididunt.
</p>
</div>
),
},
{
indicator: (
<Group gap="5px">
<Badge color="orange">UX</Badge>
<Badge>UI</Badge>
</Group>
),
schedules: (
<div>
<p>
<strong>De 16h30 à 18h</strong>
</p>
</div>
),
subject: (
<div>
<strong>Brainstorming Maquettes TTTS </strong>
<br />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
do eiusmod tempor incididunt.
</p>
</div>
),
},
},
]}
columns={[
{
accessorKey: 'subject',
header: 'Sujets',
},
{
accessorKey: 'indicator',
header: 'Indicateurs',
},
{
accessorKey: 'schedules',
header: 'Horaires',
},
]}
data={[
{
indicator: (
<Group gap="5px">
<Badge color="blue">DEV</Badge>
</Group>
),
schedules: (
<div>
<p>
<strong>À 9h30</strong>
</p>
</div>
),
subject: (
<div>
<strong>Dally MFC </strong>
<br />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt.
</p>
</div>
),
},
{
indicator: (
<Group gap="5px">
<Badge color="blue">Dev</Badge>
<Badge>UI</Badge>
</Group>
),
schedules: (
<div>
<p>
<strong>De 11h à 12h</strong>
</p>
</div>
),
subject: (
<div>
<strong>AMF review sprint 2 </strong>
<br />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt.
</p>
</div>
),
},
{
indicator: (
<Group gap="5px">
<Badge color="orange">UX</Badge>
<Badge>UI</Badge>
</Group>
),
schedules: (
<div>
<p>
<strong>De 16h30 à 18h</strong>
</p>
</div>
),
subject: (
<div>
<strong>Brainstorming Maquettes TTTS </strong>
<br />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt.
</p>
</div>
),
},
]}
rowActionNumber={2}
/>
]}
rowActionNumber={2}
/>
</>
);
}

0 comments on commit 8cae60c

Please sign in to comment.