Create redux store for shlink-web-component

src/container/index.ts

@@ -8,7 +8,7 @@ import { provideServices as provideCommonServices } from '../common/services/pro
 import { provideServices as provideMercureServices } from '../mercure/services/provideServices';
 import { provideServices as provideServersServices } from '../servers/services/provideServices';
 import { provideServices as provideSettingsServices } from '../settings/services/provideServices';
-import { provideServices as provideWebComponentServices } from '../shlink-web-component/container';
+import { provideServices as provideWebComponentServices } from '../shlink-web-component/container/provideServices';
 import { provideServices as provideDomainsServices } from '../shlink-web-component/domains/services/provideServices';
 import { provideServices as provideShortUrlsServices } from '../shlink-web-component/short-urls/services/provideServices';
 import { provideServices as provideTagsServices } from '../shlink-web-component/tags/services/provideServices';

src/shlink-web-component/container/index.ts

@@ -1,22 +1,2 @@
-import type Bottle from 'bottlejs';
-import { ShlinkWebComponent } from '../ShlinkWebComponent';
-
-// TODO Build sub-container
-
-export const provideServices = (bottle: Bottle) => {
-  bottle.serviceFactory(
-    'ShlinkWebComponent',
-    ShlinkWebComponent,
-    'TagsList',
-    'ShortUrlsList',
-    'CreateShortUrl',
-    'ShortUrlVisits',
-    'TagVisits',
-    'DomainVisits',
-    'OrphanVisits',
-    'NonOrphanVisits',
-    'Overview',
-    'EditShortUrl',
-    'ManageDomains',
-  );
-};
+// TODO Create a separated container here
+export { container } from '../../container';

src/shlink-web-component/container/provideServices.ts

@@ -0,0 +1,20 @@
+import type Bottle from 'bottlejs';
+import { ShlinkWebComponent } from '../ShlinkWebComponent';
+
+export const provideServices = (bottle: Bottle) => {
+  bottle.serviceFactory(
+    'ShlinkWebComponent',
+    ShlinkWebComponent,
+    'TagsList',
+    'ShortUrlsList',
+    'CreateShortUrl',
+    'ShortUrlVisits',
+    'TagVisits',
+    'DomainVisits',
+    'OrphanVisits',
+    'NonOrphanVisits',
+    'Overview',
+    'EditShortUrl',
+    'ManageDomains',
+  );
+};

src/shlink-web-component/container/store.ts

@@ -0,0 +1,34 @@
+import { combineReducers, configureStore } from '@reduxjs/toolkit';
+import type { IContainer } from 'bottlejs';
+
+const isProduction = process.env.NODE_ENV === 'production';
+
+export const setUpStore = (container: IContainer) => configureStore({
+  devTools: !isProduction,
+  reducer: combineReducers({
+    // TODO Check if this should be here or not
+    mercureInfo: container.mercureInfoReducer,
+
+    // Nested shlink-web-component reducers
+    shortUrlsList: container.shortUrlsListReducer,
+    shortUrlCreation: container.shortUrlCreationReducer,
+    shortUrlDeletion: container.shortUrlDeletionReducer,
+    shortUrlEdition: container.shortUrlEditionReducer,
+    shortUrlDetail: container.shortUrlDetailReducer,
+    shortUrlVisits: container.shortUrlVisitsReducer,
+    tagVisits: container.tagVisitsReducer,
+    domainVisits: container.domainVisitsReducer,
+    orphanVisits: container.orphanVisitsReducer,
+    nonOrphanVisits: container.nonOrphanVisitsReducer,
+    tagsList: container.tagsListReducer,
+    tagDelete: container.tagDeleteReducer,
+    tagEdit: container.tagEditReducer,
+    domainsList: container.domainsListReducer,
+    visitsOverview: container.visitsOverviewReducer,
+  }),
+  middleware: (defaultMiddlewaresIncludingReduxThunk) => defaultMiddlewaresIncludingReduxThunk({
+    // State is too big for these
+    immutableCheck: false,
+    serializableCheck: false,
+  }),
+});

src/shlink-web-component/index.ts

@@ -1 +1,5 @@
-export * from './ShlinkWebComponent';
+import { container } from './container';
+
+export const { ShlinkWebComponent } = container;
+
+export type { ShlinkWebComponentType } from './ShlinkWebComponent';