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

Evol/log api #6

Open
wants to merge 30 commits into
base: evol/drawer
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
30 commits
Select commit Hold shift + click to select a range
1364929
start implem log api
lucas-amiaud Feb 18, 2022
4c8c494
start implem log api
lucas-amiaud Feb 18, 2022
f7507c6
add route for log API
lucas-amiaud Feb 18, 2022
2623ae9
implem log API filters
lucas-amiaud Feb 18, 2022
d0bd4b1
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Feb 18, 2022
8d96127
add log api sorting
lucas-amiaud Feb 18, 2022
b22f0aa
add log api js filter
lucas-amiaud Feb 21, 2022
4259ac3
merge evols
lucas-amiaud Apr 13, 2022
467076b
add message and titles
lucas-amiaud Apr 13, 2022
652cd0f
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Apr 20, 2022
4b02b09
merge new libraries
lucas-amiaud Apr 20, 2022
454faad
wip add radio buttons
lucas-amiaud Apr 27, 2022
bb4153d
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Apr 27, 2022
347167b
clean single choice filter menu
lucas-amiaud Apr 27, 2022
5c6eed1
clean log API
lucas-amiaud Apr 29, 2022
86bd602
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Apr 29, 2022
dc83335
clean log API
lucas-amiaud Apr 29, 2022
24d5896
add date pickers
lucas-amiaud May 3, 2022
b1a27df
fix style pickers
lucas-amiaud May 3, 2022
fb9e326
esling fixes
lucas-amiaud May 3, 2022
3170d3e
merge drawer
lucas-amiaud May 3, 2022
c874a49
merge drawer branch
lucas-amiaud May 25, 2022
568b433
add readonly props on inputs
lucas-amiaud May 25, 2022
e85c71a
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Jun 9, 2022
5abaf91
merge evol/drawer
lucas-amiaud Jun 14, 2022
c2be5ea
eslint fix
lucas-amiaud Jun 14, 2022
582811b
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Jun 14, 2022
1f5a056
eslint fix
lucas-amiaud Jun 14, 2022
1919d58
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Oct 17, 2023
4e81d25
Merge branch 'evol/drawer' into evol/log-api
lucas-amiaud Oct 17, 2023
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
1 change: 1 addition & 0 deletions templates/admin/assets/scss/features/_index.scss
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
@forward 'login';
@forward 'log-api';
48 changes: 48 additions & 0 deletions templates/admin/assets/scss/features/_log-api.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
@use 'assets/scss/variables' as *;

$log-api-ok: #49cc90;
$log-api-warning: #fca130;
$log-api-error: #f93e3e;

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

On pourrait reprendre les couleurs qu'on a déjà non ? Et limite eclaircir ou foncer ?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Il faudrait aussi déclarer les variable dans le scope de log api, sinon elles sont globales


.log-api-tile {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
cursor: pointer;

* {
flex-shrink: 0;
}

.log-api-data {
height: 100%;
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
font-size: $font-size-normal;

.data {
display: flex;
width: 15%;
height: 40px;

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ça doit dépendre de la taille de la police je pense

flex-direction: column;
align-items: flex-start;
justify-content: center;
padding: 0 $spacer-2;
margin-left: $spacer-3;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

&--large {
width: 40%;
}
&--small {
width: 30px;
}
}
}
}
4 changes: 3 additions & 1 deletion templates/admin/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
"@emotion/styled": "^11.10.4",
"@fontsource/roboto": "^4.5.8",
"@mui/icons-material": "^5.10.9",
"@mui/lab": "5.0.0-alpha.49",
"@mui/material": "^5.10.9",
"@mui/styles": "^5.10.9",
"@mui/system": "^5.10.9",
Expand Down Expand Up @@ -86,7 +87,8 @@
"eslint": "eslint src --ext .ts,.tsx",
"typescript": "tsc --noEmit",
"test": "jest --config jest.config.js",
"coverage": "jest --config jest.config.js --coverage --watchAll=false"
"coverage": "jest --config jest.config.js --coverage --watchAll=false",
"lint": "yarn typescript && yarn eslint"
},
"packageManager": "[email protected]",
"engines": {
Expand Down
1 change: 1 addition & 0 deletions templates/admin/src/components/Routes.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
export const HOME: string = '/home';
export const USERS: string = '/users';
export const LOG_API: string = '/log-api';

export const LOGIN: string = '/login';
29 changes: 18 additions & 11 deletions templates/admin/src/components/layout/Router.tsx
Original file line number Diff line number Diff line change
@@ -1,29 +1,36 @@
import React from 'react';
import {
Routes,
Route,
Navigate,
} from 'react-router-dom';
import { getGlobalInstance } from 'plume-ts-di';
import Home from '../features/Home';
import React from 'react';
import { Route, Routes } from 'react-router-dom';
import LogApi from '../../lib/plume-admin-log-api/pages/LogApi';
import Users from '../../lib/plume-admin-users/pages/Users';
import PermissionRoute from '../theme/routes/PermissionRoute';
import Permission from '../../services/session/Permission';
import { HOME, USERS } from '../Routes';
import Home from '../features/Home';
import { HOME, LOG_API, USERS } from '../Routes';
import PermissionRoute from '../theme/routes/PermissionRoute';

export default function Router() {
const users: Users = getGlobalInstance(Users);
const logApi: LogApi = getGlobalInstance(LogApi);

return (
<Routes>
<Route
path={`${USERS}/*`}
element={
<PermissionRoute permission={Permission.MANAGE_USERS}><users.render /></PermissionRoute>
<PermissionRoute permission={Permission.MANAGE_USERS}>
<users.render />
</PermissionRoute>
}
/>
<Route
path={`${LOG_API}/*`}
element={
<PermissionRoute permission={Permission.MANAGE_API_LOGS}>
<logApi.render />
</PermissionRoute>
}
/>
<Route path={HOME} element={<Home />} />
<Route path="*" element={<Navigate to={{ pathname: HOME }} />} />
</Routes>
);
}
15 changes: 14 additions & 1 deletion templates/admin/src/components/navigation/Navigation.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { getGlobalInstance } from 'plume-ts-di';
import useToggle from '../../lib/react-hook-toggle/ReactHookToggle';
import Permission from '../../services/session/Permission';
import SessionService from '../../services/session/SessionService';
import { HOME, USERS } from '../Routes';
import { HOME, LOG_API, USERS } from '../Routes';
import LinkListItem from './LinkListItem';
import NestedListItem from './NestedListItem';
import plumeLogo from '../../../assets/icons/plume_logo.png';
Expand Down Expand Up @@ -55,6 +55,19 @@ export default function Navigation() {
</NestedListItem>
)
}
{
sessionService.hasPermission(Permission.MANAGE_SYSTEM)

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

La permission c'est pas plutôt MANAGE_API_LOGS ? Ou les deux ?

&& (
<NestedListItem icon="settings" label={messages.nav.settings} drawerOpen={isDrawerOpened}>
<LinkListItem
icon="http"
route={LOG_API}
label={messages.nav.log_api}
drawerOpen={isDrawerOpened}
/>
</NestedListItem>
)
}
</List>
</nav>
);
Expand Down
31 changes: 28 additions & 3 deletions templates/admin/src/components/theme/AdminTheme.ts
Original file line number Diff line number Diff line change
@@ -1,31 +1,38 @@
import { JSX } from 'react';
import {
ActionButtonProps,
ActionContainerProps,
ActionLinkProps,
} from '../../lib/plume-admin-theme/action/ActionProps';
import {
DrawerTypeProps, UncontrolledDrawerTypeProps,
DrawerTypeProps,
UncontrolledDrawerTypeProps,
} from '../../lib/plume-admin-theme/drawer/DrawerProps';
import {
FormFieldProps,
} from '../../lib/plume-admin-theme/form/FormFieldProps';
import {
InputDateProps, InputDateRangeProps,
InputSelectProps,
InputTextProps,
} from '../../lib/plume-admin-theme/form/FormInputProps';
import {
LayoutPageBlocColumnProps,
LayoutPageBlocProps,
LayoutPageTitleProps,
PanelProps, StatusDotProps,
PanelProps,
StatusDotProps,
} from '../../lib/plume-admin-theme/layout/LayoutProps';
import {
MultipleChoiceObjectFilterMenuProps,
MultipleChoiceRawFilterMenuProps,
SingleChoiceObjectFilterMenuProps,
SingleChoiceRawFilterMenuProps,
} from '../../lib/plume-admin-theme/list/filter/FilterProps';
import {
ListElementsProps,
ListHeaderProps, ListSingleElementProps,
ListHeaderProps,
ListSingleElementProps,
} from '../../lib/plume-admin-theme/list/ListProps';
import {
SearchBarProps,
Expand All @@ -39,6 +46,9 @@ import {
import { ActionButton, ActionLink, ActionsContainer } from './action/Actions';
import Drawer from './drawer/Drawer';
import UncontrolledDrawer from './drawer/UncontrolledDrawer';
import InputDatePicker from './form/fields/InputDatePicker';
import InputDateRangePicker from './form/fields/InputDateRangePicker';
import InputDateTimePicker from './form/fields/InputDateTimePicker';
import InputSelect from './form/fields/InputSelect';
import InputText from './form/fields/InputText';
import FormField from './form/FormField';
Expand All @@ -49,6 +59,9 @@ import StatusDot from './layout/StatusDot';
import MultipleChoiceFilterMenu, {
MultipleChoiceObjectFilterMenu,
} from './list/filter/MultipleChoiceFilterMenu';
import SingleChoiceFilterMenu, {
SingleObjectChoiceFilterMenu,
} from './list/filter/SingleChoiceFilterMenu';
import { ListElements, ListSingleElement } from './list/ListElements';
import ListHeader from './list/ListHeader';
import SearchBar from './list/search/SearchBar';
Expand Down Expand Up @@ -82,6 +95,12 @@ export default class AdminTheme implements PlumeAdminTheme {
props: MultipleChoiceObjectFilterMenuProps<T>,
) => JSX.Element = MultipleChoiceObjectFilterMenu;

singleChoiceFilterMenu: (props: SingleChoiceRawFilterMenuProps) => JSX.Element = SingleChoiceFilterMenu;

singleChoiceObjectFilterMenu: <T>(
props: SingleChoiceObjectFilterMenuProps<T>,
) => JSX.Element = SingleObjectChoiceFilterMenu;

listHeader: (props: ListHeaderProps) => JSX.Element = ListHeader;

listElements: (props: ListElementsProps) => JSX.Element = ListElements;
Expand All @@ -103,4 +122,10 @@ export default class AdminTheme implements PlumeAdminTheme {
inputText: (props: InputTextProps) => JSX.Element = InputText;

inputSelect: (props: InputSelectProps) => JSX.Element = InputSelect;

inputDate: (props: InputDateProps) => JSX.Element = InputDatePicker;

inputDateTime: (props: InputDateProps) => JSX.Element = InputDateTimePicker;

inputDateRange: (props: InputDateRangeProps) => JSX.Element = InputDateRangePicker;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
import { DatePicker, LocalizationProvider } from '@mui/lab';
import DateAdapter from '@mui/lab/AdapterDayjs';
import { MuiTextFieldProps } from '@mui/lab/internal/pickers/PureDateInput';
import { TextField } from '@mui/material';
import { Dayjs } from 'dayjs';
import React from 'react';
import { useController } from 'react-hook-form';
import useMessages from '../../../../i18n/hooks/messagesHook';
import {
InputDateProps,
} from '../../../../lib/plume-admin-theme/form/FormInputProps';

function InputDatePicker(
{
placeholder,
label,
name,
id,
useNameAsId,
control,
rules,
disabled,
defaultValue,
onDateChange,
autoComplete,
showTodayButton,
disableFuture,
disableOpenPicker,
locale,
}: InputDateProps) {
const fieldId: string = (useNameAsId ? name : (id ?? name)) || '';
const { messages } = useMessages();

const { field } = useController({
name: fieldId,
control,
rules,
defaultValue: defaultValue || null,
});

const onChangeCombined = (value: Dayjs | null) => {
field.onChange(value);
if (value && onDateChange) {
onDateChange(value);
}
};

return (
<LocalizationProvider dateAdapter={DateAdapter} locale={locale}>
<DatePicker
onChange={onChangeCombined}
value={field.value}
disableOpenPicker={disableOpenPicker}
showTodayButton={showTodayButton ?? false}
disableFuture={disableFuture ?? false}
inputFormat={messages.format.date}
mask={messages.format.date_mask}
renderInput={(params: MuiTextFieldProps) => (
<TextField
// eslint-disable-next-line react/jsx-props-no-spreading
{...params}
ref={params.inputRef}
inputRef={field.ref}
id={fieldId}
name={name}
label={label}
inputProps={{
...params.inputProps,
placeholder: placeholder || messages.format.date,
}}
autoComplete={autoComplete}
disabled={disabled ?? false}
onBlur={field.onBlur}
required
/>
)}
/>
</LocalizationProvider>
);
}

export default (InputDatePicker);
Loading