jamespot-react-core 1.1.6 → 1.1.13

package/.history/src/displayer/DisplayAttribute.component_20211214170208.tsx

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributeProps } from 'utils/types';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<DisplayAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just u
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211214170229.tsx

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributeProps } from 'utils/types';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<DisplayAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just abose the element value
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211214171848.tsx

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<DisplayAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just abose the element value
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211214180831.tsx

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just abose the element value
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211214181345.tsx

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215093641.tsx

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ * Note :
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215093839.tsx

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215093921.tsx

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Render a component depends on object type
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215094002.tsx

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Render a component
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215094023.tsx

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Choose the component to render according to the type of the object
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215152221.tsx

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Choose the component to render according to the type of the object
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return (
+            <Wrap>
+                <RenderAttribute attribute={attributeProps} object={object} />
+            </Wrap>
+        );
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215152233.tsx

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Choose the component to render according to the type of the object
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+    const WrapperComponent: React.FunctionComponent<any> = attribute.components.wrapper;
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return (
+            <Wrap>
+                <RenderAttribute attribute={attributeProps} object={object} />
+            </Wrap>
+        );
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215152236.tsx

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Choose the component to render according to the type of the object
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+    const WrapperComponent: React.FunctionComponent<any> = attribute.components.wrapper;
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return (
+            <WrapperComponent>
+                <RenderAttribute attribute={attributeProps} object={object} />
+            </WrapperComponent>
+        );
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215152249.tsx

@@ -0,0 +1,46 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Choose the component to render according to the type of the object
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        const WrapperComponent: React.FunctionComponent<any> = attribute.components.wrapper;
+
+        return (
+            <WrapperComponent>
+                <RenderAttribute attribute={attributeProps} object={object} />
+            </WrapperComponent>
+        );
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215152319.tsx

@@ -0,0 +1,41 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Choose the component to render according to the type of the object
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+    const WrapperComponent: React.FunctionComponent<any> = attribute.components.wrapper;
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};

package/.history/src/displayer/DisplayAttribute.component_20211215152321.tsx

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import { DisplayAttributesProps, RenderAttributeProps } from './types';
+
+/***
+ * Choose the component to render according to the type of the object
+ */
+const RenderAttribute = (props: RenderAttributeProps) => {
+    const { attribute } = props;
+    const RenderComponent: FunctionComponent<RenderAttributeProps> = attribute.components.render;
+    return <RenderComponent {...props} />;
+};
+
+/****
+ * The jamespot model depend on the platform
+ * For example a user can have the size attribute only for a given platform
+ * The model specifics of a platform are stored in J.model
+ *
+ * This component display an array of attributes only if this attribute is activated on the platform
+ *
+ * @param props.object the object to display (ie the user)
+ * @param props.attributesName an array of string : the list of attributes we want to display
+ * @param props.componentsOverride we can override the default render of the attribute
+ * @param props.componentsOverride.render the whole component logic (we override @DisplayList or @DisplaySingleValue for exemple)
+ * @param props.componentsOverride.wrapper the attribute is wrapped inside an element. For a list it can be an UL
+ * @param props.componentsOverride.element the component just above the element value
+ *  Note :If we override the "render" you can't override "wrapper" and "element" because the render rewrite everything
+ */
+export const DisplayAttributes = (props: DisplayAttributesProps) => {
+    const { attributesName, object, componentsOverride } = props;
+    const config = J.react.useDisplay(attributesName || [], object.type);
+
+    return config.map((attributeProps) => {
+        attributeProps.components = {
+            ...attributeProps.components,
+            ...componentsOverride[attributeProps.accessor],
+        };
+        return <RenderAttribute attribute={attributeProps} object={object} />;
+    });
+};