({
+ getComponent: (name, fallback) => fallback,
+ getIsAllowed: () => true,
+});
+
+export const useCustomization = () => useContext(Context);
+
+interface IProps {
+ children: React.ReactNode;
+ value: IContext;
+}
+
+const CustomizationProvider = ({children, value}: IProps) => {
+ return {children};
+};
+
+export default CustomizationProvider;
diff --git a/web/src/providers/Customization/WithCustomization.tsx b/web/src/providers/Customization/WithCustomization.tsx
new file mode 100644
index 0000000000..d71cc9c009
--- /dev/null
+++ b/web/src/providers/Customization/WithCustomization.tsx
@@ -0,0 +1,14 @@
+import {useCustomization} from './Customization.provider';
+
+const withCustomization = (Component: React.ComponentType
, id: string) => {
+ const WrappedComponent = (props: P) => {
+ const {getComponent} = useCustomization();
+ const CustomizedComponent = getComponent(id, Component);
+
+ return ;
+ };
+
+ return WrappedComponent;
+};
+
+export default withCustomization;
diff --git a/web/src/providers/Customization/index.ts b/web/src/providers/Customization/index.ts
new file mode 100644
index 0000000000..5e2ae6b66e
--- /dev/null
+++ b/web/src/providers/Customization/index.ts
@@ -0,0 +1,3 @@
+// eslint-disable-next-line no-restricted-exports
+export {default, useCustomization, Operation} from './Customization.provider';
+export {default as withCustomization} from './WithCustomization';