From 79f0cf78748a70e9e7e50bd3ba10edc6dd37beb0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hugo=20H=C3=A4ggmark?= <hugo.haggmark@grafana.com>
Date: Mon, 22 Mar 2021 08:09:27 +0100
Subject: [PATCH] LibraryPanels: Changes to non readonly reducer (#32193)

---
 .../components/LibraryPanelsView/reducer.ts   | 71 ++++++++++---------
 1 file changed, 39 insertions(+), 32 deletions(-)

diff --git a/public/app/features/library-panels/components/LibraryPanelsView/reducer.ts b/public/app/features/library-panels/components/LibraryPanelsView/reducer.ts
index ea8f1c8375a..0dcf7f84f61 100644
--- a/public/app/features/library-panels/components/LibraryPanelsView/reducer.ts
+++ b/public/app/features/library-panels/components/LibraryPanelsView/reducer.ts
@@ -1,7 +1,8 @@
-import { createSlice, PayloadAction } from '@reduxjs/toolkit';
+import { createAction } from '@reduxjs/toolkit';
 import { LoadingState } from '@grafana/data';
 
 import { LibraryPanelDTO } from '../../types';
+import { AnyAction } from 'redux';
 
 export interface LibraryPanelsViewState {
   loadingState: LoadingState;
@@ -25,35 +26,41 @@ export const initialLibraryPanelsViewState: LibraryPanelsViewState = {
   currentPanelId: undefined,
 };
 
-const libraryPanelsViewSlice = createSlice({
-  name: 'libraryPanels/view',
-  initialState: initialLibraryPanelsViewState,
-  reducers: {
-    initSearch: (state) => {
-      state.loadingState = LoadingState.Loading;
-    },
-    searchCompleted: (
-      state,
-      action: PayloadAction<
-        Omit<LibraryPanelsViewState, 'currentPanelId' | 'searchString' | 'loadingState' | 'numberOfPages'>
-      >
-    ) => {
-      const { libraryPanels, page, perPage, totalCount } = action.payload;
-      state.libraryPanels = libraryPanels;
-      state.perPage = perPage;
-      state.totalCount = totalCount;
-      state.loadingState = LoadingState.Done;
-      state.numberOfPages = Math.ceil(totalCount / perPage);
-      state.page = page > state.numberOfPages ? page - 1 : page;
-    },
-    changeSearchString: (state, action: PayloadAction<Pick<LibraryPanelsViewState, 'searchString'>>) => {
-      state.searchString = action.payload.searchString;
-    },
-    changePage: (state, action: PayloadAction<Pick<LibraryPanelsViewState, 'page'>>) => {
-      state.page = action.payload.page;
-    },
-  },
-});
+export const initSearch = createAction('libraryPanels/view/initSearch');
+export const searchCompleted = createAction<
+  Omit<LibraryPanelsViewState, 'currentPanelId' | 'searchString' | 'loadingState' | 'numberOfPages'>
+>('libraryPanels/view/searchCompleted');
+export const changeSearchString = createAction<Pick<LibraryPanelsViewState, 'searchString'>>(
+  'libraryPanels/view/changeSearchString'
+);
+export const changePage = createAction<Pick<LibraryPanelsViewState, 'page'>>('libraryPanels/view/changePage');
 
-export const libraryPanelsViewReducer = libraryPanelsViewSlice.reducer;
-export const { initSearch, searchCompleted, changeSearchString, changePage } = libraryPanelsViewSlice.actions;
+export const libraryPanelsViewReducer = (state: LibraryPanelsViewState, action: AnyAction) => {
+  if (initSearch.match(action)) {
+    return { ...state, loadingState: LoadingState.Loading };
+  }
+
+  if (searchCompleted.match(action)) {
+    const { libraryPanels, page, perPage, totalCount } = action.payload;
+    const numberOfPages = Math.ceil(totalCount / perPage);
+    return {
+      ...state,
+      libraryPanels,
+      perPage,
+      totalCount,
+      loadingState: LoadingState.Done,
+      numberOfPages,
+      page: page > numberOfPages ? page - 1 : page,
+    };
+  }
+
+  if (changeSearchString.match(action)) {
+    return { ...state, searchString: action.payload.searchString };
+  }
+
+  if (changePage.match(action)) {
+    return { ...state, page: action.payload.page };
+  }
+
+  return state;
+};