@applica-software-guru/react-admin 1.4.226 → 1.5.228

package/src/playground/components/ra-forms/TestModelForm.jsx

@@ -1,18 +1,20 @@
 import { LongForm, MainCard, TextInput } from '@applica-software-guru/react-admin';
 import { Grid } from '@mui/material';
 
-const TestModelForm = () => (
-  <LongForm>
-    <LongForm.Tab id="root" label="Root">
-      <MainCard title="Info">
-        <Grid container spacing={2}>
-          <Grid item xs={12}>
-            <TextInput source="name" fullWidth />
+function TestModelForm() {
+  return (
+    <LongForm>
+      <LongForm.Tab id="root" label="Root">
+        <MainCard title="Info">
+          <Grid container spacing={2}>
+            <Grid item xs={12}>
+              <TextInput source="name" fullWidth />
+            </Grid>
           </Grid>
-        </Grid>
-      </MainCard>
-    </LongForm.Tab>
-  </LongForm>
-);
+        </MainCard>
+      </LongForm.Tab>
+    </LongForm>
+  );
+}
 
-export default TestModelForm;
+export { TestModelForm };

package/src/playground/components/ra-forms/UserForm.jsx

@@ -1,6 +1,8 @@
 import {
   ArrayInput,
   BooleanInput,
+  CreateInDialogButton,
+  EditInDialogButton,
   ImageInput,
   SelectArrayInput,
   SimpleForm,
@@ -9,12 +11,10 @@ import {
   TextInput,
   useThemeConfig
 } from '@applica-software-guru/react-admin';
-
 import { Grid } from '@mui/material';
 import PropTypes from 'prop-types';
-import { CreateInDialogButton, EditInDialogButton } from '../../../components';
 
-const UserForm = ({ configuredRoles }) => {
+function UserForm({ roles }) {
   const { spacing } = useThemeConfig();
   return (
     <SimpleForm defaultValues={{ active: true }}>
@@ -29,40 +29,15 @@ const UserForm = ({ configuredRoles }) => {
           <TextInput source="name" fullWidth />
         </Grid>
         <Grid item lg={12} xs={12}>
-          <SelectArrayInput source="roles" label="ra.user.roles" choices={configuredRoles} fullWidth />
+          <SelectArrayInput source="roles" label="ra.user.roles" choices={roles} fullWidth />
         </Grid>
         <Grid item lg={12} xs={12}>
           <ImageInput source="image" accept="image/*" multiple={false} fullWidth />
         </Grid>
-        <Grid item lg={12} xs={12}>
-          <ArrayInput source="items" label={false}>
-            <TableFormIterator label="Informazioni utente">
-              <TextInput source="name" label="Name" sx={{ minWidth: 200 }} />
-              <TextInput source="surname" label="Surname" sx={{ minWidth: 150 }} />
-              <SelectArrayInput source="roles" label="Ruoli" choices={configuredRoles} />
-            </TableFormIterator>
-          </ArrayInput>
-        </Grid>
       </Grid>
-      <EditInDialogButton>
-        <TabbedForm>
-          <TabbedForm.Tab label="ciaooo">
-            <TextInput source="ciao" />
-          </TabbedForm.Tab>
-        </TabbedForm>
-      </EditInDialogButton>
-      <CreateInDialogButton>
-        <SimpleForm>
-          <TextInput source="ciao" />
-        </SimpleForm>
-      </CreateInDialogButton>
       <BooleanInput source="active" />
     </SimpleForm>
   );
-};
-
-UserForm.propTypes = {
-  configuredRoles: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string, name: PropTypes.string })).isRequired
-};
+}
 
-export default UserForm;
+export { UserForm };

package/src/playground/components/ra-forms/index.jsx

@@ -1,3 +1,4 @@
-export { default as DeviceForm } from './DeviceForm';
-export { default as I18nMessageForm } from './I18nMessageForm';
-export { default as UserForm } from './UserForm';
+export * from './DeviceForm';
+export * from './I18nMessageForm';
+export * from './TestModelForm';
+export * from './UserForm';

package/src/playground/components/ra-inputs/LangSelectInput.jsx

@@ -1,4 +1,8 @@
-import { SelectInput } from '@applica-software-guru/react-admin';
-const LangSelectInput = (props) => <SelectInput {...props} choices={[{ id: 'it', name: 'Italiano' }]} />;
+import { SelectInput, useLocales } from '@applica-software-guru/react-admin';
 
-export default LangSelectInput;
+function LangSelectInput(props) {
+  const locales = useLocales();
+  return <SelectInput {...props} choices={locales.map(({ locale, name }) => ({ id: locale, name }))} />;
+}
+
+export { LangSelectInput };

package/src/playground/components/ra-inputs/YesOrNoSelectInput.jsx

@@ -1,14 +1,17 @@
 import { SelectInput } from '@applica-software-guru/react-admin';
-const YesOrNoSelectInput = (props) => (
-  <SelectInput
-    {...props}
-    display="legend"
-    emptyText={'ra.boolean.null'}
-    choices={[
-      { id: true, name: 'ra.yes' },
-      { id: false, name: 'ra.no' }
-    ]}
-  />
-);
 
-export default YesOrNoSelectInput;
+function YesOrNoSelectInput(props) {
+  return (
+    <SelectInput
+      {...props}
+      display="legend"
+      emptyText={'ra.boolean.null'}
+      choices={[
+        { id: true, name: 'ra.yes' },
+        { id: false, name: 'ra.no' }
+      ]}
+    />
+  );
+}
+
+export { YesOrNoSelectInput };

package/src/playground/components/ra-inputs/index.jsx

@@ -1,3 +1,2 @@
-import LangSelectInput from './LangSelectInput';
-import YesOrNoSelectInput from './YesOrNoSelectInput';
-export { LangSelectInput, YesOrNoSelectInput };
+export * from './LangSelectInput';
+export * from './YesOrNoSelectInput';

package/src/playground/components/ra-lists/DeviceList.jsx

@@ -1,8 +1,7 @@
 import { Datagrid, DateField, List, SearchInput, TextField, useThemeConfig, useTranslate } from '@applica-software-guru/react-admin';
-
 import { Alert } from '@mui/material';
 
-const AlertBox = () => {
+function AlertBox() {
   const { spacing } = useThemeConfig();
   const translate = useTranslate();
   return (
@@ -10,16 +9,18 @@ const AlertBox = () => {
       {translate('resources.entities/device.alert')}
     </Alert>
   );
-};
-const DeviceList = () => (
-  <List perPage={25} filters={[<SearchInput key="keyword" source="keyword" alwaysOn />]}>
-    <AlertBox />
-    <Datagrid rowClick="edit">
-      <TextField source="id" />
-      <TextField source="code" />
-      <DateField source="registrationDate" showTime />
-    </Datagrid>
-  </List>
-);
+}
+function DeviceList() {
+  return (
+    <List perPage={25} filters={[<SearchInput key="keyword" source="keyword" alwaysOn />]}>
+      <AlertBox />
+      <Datagrid rowClick="edit">
+        <TextField source="id" />
+        <TextField source="code" />
+        <DateField source="registrationDate" showTime />
+      </Datagrid>
+    </List>
+  );
+}
 
-export default DeviceList;
+export { DeviceList };

package/src/playground/components/ra-lists/I18nMessageList.jsx

@@ -1,15 +1,16 @@
 import { ActionsField, BooleanField, Datagrid, List, RecordInput, SearchInput, TextField } from '@applica-software-guru/react-admin';
 
-const I18nMessageList = () => (
-  <List perPage={25} filters={[<SearchInput key="keyword" source="keyword" alwaysOn />]}>
-    <Datagrid>
-      <TextField source="lang" />
-      <RecordInput source="code" />
-      <RecordInput source="text" />
-      <BooleanField source="translated" />
-      <ActionsField />
-    </Datagrid>
-  </List>
-);
-
-export default I18nMessageList;
+function I18nMessageList() {
+  return (
+    <List perPage={25} filters={[<SearchInput key="keyword" source="keyword" alwaysOn />]}>
+      <Datagrid>
+        <TextField source="lang" />
+        <RecordInput source="code" />
+        <RecordInput source="text" />
+        <BooleanField source="translated" />
+        <ActionsField />
+      </Datagrid>
+    </List>
+  );
+}
+export { I18nMessageList };

package/src/playground/components/ra-lists/UserList.jsx

@@ -15,35 +15,57 @@ import {
 } from '@applica-software-guru/react-admin';
 import { Chip, useMediaQuery } from '@mui/material';
 
-import PropTypes from 'prop-types';
-
-const sortRoles = (roles, configuredRoles) => {
-  return roles
-    ?.filter((r) => configuredRoles.find((cr) => cr.id === r))
+function sortRoles(userRoles, roles) {
+  return userRoles
+    ?.filter((r) => roles.find((cr) => cr.id === r))
     .sort((a, b) => {
-      const aIndex = configuredRoles.findIndex((r) => r.id === a);
-      const bIndex = configuredRoles.findIndex((r) => r.id === b);
+      const aIndex = roles.findIndex((r) => r.id === a);
+      const bIndex = roles.findIndex((r) => r.id === b);
 
       return aIndex - bIndex;
     });
-};
-const UserList = ({ configuredRoles }) => {
+}
+
+function RolesInput({ record, source, roles, ...props }) {
+  return (
+    <SelectInput
+      source={source}
+      choices={roles}
+      format={(v) => v}
+      parse={(v) => v}
+      alwaysOn
+      emptyText="ra.action.view_all"
+      display="legend"
+      {...props}
+    />
+  );
+}
+
+function ImageField({ record }) {
+  return <CoverField source="image" record={record} width={50} height={50} circle />;
+}
+
+function NameField({ record }) {
+  return record.name;
+}
+
+function SecondaryField({ record }) {
+  return record.email;
+}
+
+function UserList({ roles }) {
   const isSmall = useMediaQuery((theme) => theme.breakpoints.down('sm'));
   return (
     <List
       perPage={25}
       filters={[
         <SearchInput key="keyword" source="keyword" alwaysOn fullWidth />,
-        <SelectInput key="role" source="role" choices={configuredRoles} alwaysOn emptyText="ra.action.view_all" display="legend" />,
+        <RolesInput key="role" source="role" choices={roles} />,
         <BooleanInput key="active" source="active" display="legend" />
       ]}
     >
       {isSmall ? (
-        <SimpleList
-          leftAvatar={(record) => <CoverField source="image" circle width={50} height={50} justify="flex-end" record={record} />}
-          primaryText={(record) => record.name}
-          secondaryText={(record) => record.email}
-        />
+        <SimpleList leftAvatar={ImageField} primaryText={NameField} secondaryText={SecondaryField} />
       ) : (
         <Datagrid rowClick="edit">
           <CoverField source="image" sortable={false} label="" width={50} height={50} circle />
@@ -51,23 +73,11 @@ const UserList = ({ configuredRoles }) => {
           <TextField source="name" sortBy="username" />
           <EmailField source="email" />
           <DateField source="registrationDate" showTime />
-          <FunctionField
-            label="ra.user.roles"
-            render={(record) =>
-              sortRoles(record?.roles, configuredRoles)?.map((role) => (
-                <Chip label={configuredRoles.find((r) => r.id === role)?.name} key={role} sx={{ mr: 1, mt: 1 }} color="secondary" />
-              ))
-            }
-          />
           <ImpersonateUserButton />
         </Datagrid>
       )}
     </List>
   );
-};
-
-UserList.propTypes = {
-  configuredRoles: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string, name: PropTypes.string })).isRequired
-};
+}
 
-export default UserList;
+export { UserList };

package/src/playground/components/ra-lists/index.jsx

@@ -1,3 +1,3 @@
-export { default as DeviceList } from './DeviceList';
-export { default as I18nMessageList } from './I18nMessageList';
-export { default as UserList } from './UserList';
+export * from './DeviceList';
+export * from './I18nMessageList';
+export * from './UserList';

package/src/playground/config.jsx

@@ -4,12 +4,14 @@ if (appUrl.endsWith(':3000/') || appUrl.indexOf(':51') !== -1) {
   appUrl = 'http://localhost:8080/';
   environment = 'DEVELOPER';
 }
-export const APP_NAME = 'RApplica';
-export const APP_URL = appUrl;
-export const API_URL = `${APP_URL}api`;
-export const ENVIRONMENT = environment;
+const APP_NAME = 'RApplica';
+const APP_URL = appUrl;
+const API_URL = `${APP_URL}api`;
+const ENVIRONMENT = environment;
 
-export const CONFIGURED_ROLES = [
+const ROLES = [
   { id: 'ROLE_ADMIN', name: 'Admin' },
   { id: 'ROLE_USER', name: 'User' }
 ];
+
+export { API_URL, APP_NAME, APP_URL, ENVIRONMENT, ROLES };

package/src/playground/entities/device.jsx

@@ -1,17 +1,22 @@
+import { DeviceForm, DeviceList } from '@/playground/components';
 import { Create, Edit } from '@applica-software-guru/react-admin';
-import { DeviceForm, DeviceList } from '../components';
-const DeviceCreate = () => (
-  <Create>
-    <DeviceForm />
-  </Create>
-);
-const DeviceEdit = () => (
-  <Edit>
-    <DeviceForm />
-  </Edit>
-);
 
-const config = {
+function DeviceCreate() {
+  return (
+    <Create>
+      <DeviceForm />
+    </Create>
+  );
+}
+function DeviceEdit() {
+  return (
+    <Edit>
+      <DeviceForm />
+    </Edit>
+  );
+}
+
+export const device = {
   list: DeviceList,
   edit: DeviceEdit,
   create: DeviceCreate,
@@ -19,5 +24,3 @@ const config = {
     group: 'control-panel'
   }
 };
-
-export default config;

package/src/playground/entities/i18n-message.jsx

@@ -1,28 +1,28 @@
-import { Create, Edit } from '@applica-software-guru/react-admin';
-import { I18nMessageForm, I18nMessageList } from '../components';
-
+import { I18nMessageForm, I18nMessageList } from '@/playground/components';
 import { FlagOutlined } from '@ant-design/icons';
+import { Create, Edit } from '@applica-software-guru/react-admin';
 
-const MessageCreate = () => (
-  <Create>
-    <I18nMessageForm />
-  </Create>
-);
+function MessageCreate() {
+  return (
+    <Create>
+      <I18nMessageForm />
+    </Create>
+  );
+}
 
-const MessageEdit = () => (
-  <Edit>
-    <I18nMessageForm />
-  </Edit>
-);
+function MessageEdit() {
+  return (
+    <Edit>
+      <I18nMessageForm />
+    </Edit>
+  );
+}
 
-const config = {
+export const i18nMessage = {
   list: I18nMessageList,
   edit: MessageEdit,
   create: MessageCreate,
   options: {
-    group: 'control-panel',
-    icon: FlagOutlined
+    group: 'control-panel'
   }
 };
-
-export default config;

package/src/playground/entities/index.jsx

@@ -1,4 +1,4 @@
-export { default as user } from './user';
-export { default as notification } from './notification';
-export { default as i18nMessage } from './i18n-message';
-export { default as device } from './device';
+export * from './device';
+export * from './i18n-message';
+export * from './notification';
+export * from './user';

package/src/playground/entities/notification.jsx

@@ -1,16 +1,15 @@
 import { NotificationList as BaseNotificationList, List } from '@applica-software-guru/react-admin';
 
-import React from 'react';
-
-const NotificationList = () => (
-  <List>
-    <BaseNotificationList />
-  </List>
-);
-const config = {
+function NotificationList() {
+  return (
+    <List>
+      <BaseNotificationList />
+    </List>
+  );
+}
+export const notification = {
   list: NotificationList,
   options: {
     group: 'dashboard'
   }
 };
-export default config;

package/src/playground/entities/user.jsx

@@ -1,28 +1,27 @@
-import { Create, Edit } from '@applica-software-guru/react-admin';
-import { UserForm, UserList } from '../components';
-
-import { CONFIGURED_ROLES } from '../config';
+import { UserForm, UserList } from '@/playground/components';
+import { ROLES } from '@/playground/config';
 import { UserOutlined } from '@ant-design/icons';
+import { Create, Edit } from '@applica-software-guru/react-admin';
 
-const UserCreate = () => (
-  <Create>
-    <UserForm configuredRoles={CONFIGURED_ROLES} />
-  </Create>
-);
-const UserEdit = () => (
-  <Edit mutationMode="pessimistic">
-    <UserForm configuredRoles={CONFIGURED_ROLES} />
-  </Edit>
-);
-
-const config = {
-  list: <UserList configuredRoles={CONFIGURED_ROLES} />,
+function UserCreate() {
+  return (
+    <Create>
+      <UserForm roles={ROLES} />
+    </Create>
+  );
+}
+function UserEdit() {
+  return (
+    <Edit mutationMode="pessimistic">
+      <UserForm roles={ROLES} />
+    </Edit>
+  );
+}
+export const user = {
+  list: <UserList roles={ROLES} />,
   edit: UserEdit,
   create: UserCreate,
   options: {
-    icon: UserOutlined,
     group: 'control-panel'
   }
 };
-
-export default config;

package/src/playground/index.jsx

@@ -1,6 +1,5 @@
 import App from './App';
 import { createRoot } from 'react-dom/client';
-import reportWebVitals from './reportWebVitals';
 
 const container = document.getElementById('root');
 const root = createRoot(container);

package/src/playground/menu.jsx

@@ -1,6 +1,6 @@
 import { DashboardOutlined, FlagOutlined, NotificationOutlined, TableOutlined, UserOutlined } from '@ant-design/icons';
 
-const config = [
+export const menu = [
   {
     id: 'dashboard',
     title: 'Dashboard AA',
@@ -76,5 +76,3 @@ const config = [
     ]
   }
 ];
-
-export default config;

package/src/playground/theme.jsx

@@ -1,3 +1,5 @@
-const theme = () => ({});
+function theme() {
+  return {};
+}
 
-export default theme;
+export { theme };

package/src/tests/example.test.js

@@ -0,0 +1,11 @@
+import { ApplicaDataProvider } from '@applica-software-guru/crud-client';
+import { describe, expect, test } from 'vitest';
+
+describe('dataProvider', () => {
+  var dataProvider = new ApplicaDataProvider({
+    apiUrl: 'http://baseurl.com'
+  });
+  test('should return an array of objects', () => {
+    expect(dataProvider.getOne).toBeDefined();
+  });
+});

package/src/themes/{getColors.jsx → getColors.ts}

@@ -1,4 +1,6 @@
-const getColors = (theme, color) => {
+import { ThemeProps } from '@/themes/types';
+
+function getColors(theme: ThemeProps, color: 'primary' | 'secondary' | 'error' | 'warning' | 'info' | 'success') {
   switch (color) {
     case 'secondary':
       return theme.palette.secondary;
@@ -13,6 +15,6 @@ const getColors = (theme, color) => {
     default:
       return theme.palette.primary;
   }
-};
+}
 
-export default getColors;
+export { getColors };

package/src/themes/{getShadow.jsx → getShadow.ts}

@@ -1,6 +1,21 @@
-import PropTypes from 'prop-types';
+import { ThemeProps } from '@/themes/types';
 
-const getShadow = (theme, shadow) => {
+function getShadow(
+  theme: ThemeProps,
+  shadow:
+    | 'primary'
+    | 'secondary'
+    | 'error'
+    | 'warning'
+    | 'info'
+    | 'success'
+    | 'primaryButton'
+    | 'secondaryButton'
+    | 'errorButton'
+    | 'warningButton'
+    | 'infoButton'
+    | 'successButton'
+) {
   switch (shadow) {
     case 'secondary':
       return theme.customShadows.secondary;
@@ -27,11 +42,6 @@ const getShadow = (theme, shadow) => {
     default:
       return theme.customShadows.primary;
   }
-};
+}
 
-getShadow.propTypes = {
-  theme: PropTypes.object,
-  shadow: PropTypes.string
-};
-
-export default getShadow;
+export { getShadow };