Postfix *Slice.js in slices folder

Gängige Praxis: *Slice.js
Verwendung: Wenn du Redux Toolkit und createSlice nutzt, ist der Postfix Slice gängiger.
Begründung:
createSlice ist ein Begriff aus Redux Toolkit.
Der Name vermittelt, dass die Datei nicht nur den Reducer enthält, sondern auch Aktionen und den initialen Zustand.
Häufig in modernen Projekten verwendet.

components/DataSheet.js

@@ -2,12 +2,12 @@ import React, { useEffect, useState } from "react";
 import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil";
 import { gisStationsStaticDistrictState } from "../redux/slices/gisStationsStaticDistrictSlice";
 import { gisSystemStaticState } from "../redux/slices/gisSystemStaticSlice";
-import { mapLayersState } from "../redux/slices/mapLayersState";
-import { selectedAreaState } from "../redux/slices/selectedAreaState";
-import { zoomTriggerState } from "../redux/slices/zoomTriggerState.js";
-import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleState";
+import { mapLayersState } from "../redux/slices/mapLayersSlice";
+import { selectedAreaState } from "../redux/slices/selectedAreaSlice";
+import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js";
+import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleStateSlice";
 import EditModeToggle from "./EditModeToggle";
-import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleState"; // Import für Polyline-Visibility
+import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; // Import für Polyline-Visibility
 
 function DataSheet() {
   const [editMode, setEditMode] = useState(false); // Zustand für editMode

components/MapComponent.js

@@ -11,19 +11,19 @@ import DataSheet from "./DataSheet.js";
 import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil";
 import { gisStationsStaticDistrictState } from "../redux/slices/gisStationsStaticDistrictSlice";
 import { gisSystemStaticState } from "../redux/slices/gisSystemStaticSlice";
-import { mapLayersState } from "../redux/slices/mapLayersState";
-import { selectedAreaState } from "../redux/slices/selectedAreaState";
-import { zoomTriggerState } from "../redux/slices/zoomTriggerState.js";
+import { mapLayersState } from "../redux/slices/mapLayersSlice";
+import { selectedAreaState } from "../redux/slices/selectedAreaSlice";
+import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js";
 import AddPoiModalWindow from "./pois/AddPoiModalWindow.js";
 import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice";
 import { InformationCircleIcon } from "@heroicons/react/20/solid"; // oder 'outline'
 import PoiUpdateModal from "./pois/PoiUpdateModal.js";
-import { selectedPoiState } from "../redux/slices/selectedPoiState.js";
-import { currentPoiState } from "../redux/slices/currentPoiState.js";
+import { selectedPoiState } from "../redux/slices/selectedPoiSlice.js";
+import { currentPoiState } from "../redux/slices/currentPoiSlice.js";
 import { ToastContainer, toast } from "react-toastify";
 import "react-toastify/dist/ReactToastify.css";
-import { mapIdState, userIdState } from "../redux/slices/urlParameterState.js";
-import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleState.js";
+import { mapIdState, userIdState } from "../redux/slices/urlParameterSlice.js";
+import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleStateSlice.js";
 import plusRoundIcon from "./PlusRoundIcon.js";
 import { createAndSetDevices } from "../utils/createAndSetDevices.js";
 import { restoreMapSettings, checkOverlappingMarkers } from "../utils/mapUtils.js";
@@ -48,9 +48,9 @@ import useLineData from "../hooks/useLineData.js";
 
 //import { useCreateAndSetDevices } from "../hooks/useCreateAndSetDevices";
 import { useMapComponentState } from "../hooks/useMapComponentState";
-import { polylineEventsDisabledState } from "../redux/slices/polylineEventsDisabledState";
+import { polylineEventsDisabledState } from "../redux/slices/polylineEventsDisabledSlice";
 import { disablePolylineEvents, enablePolylineEvents } from "../utils/setupPolylines";
-import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleState";
+import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice";
 
 const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const polylineVisible = useRecoilValue(polylineLayerVisibleState);

components/MapComponent.test.js

@@ -2,8 +2,8 @@ import React from "react";
 import { render, screen, fireEvent } from "@testing-library/react";
 import { RecoilRoot } from "recoil";
 import MapComponent from "./MapComponent";
-import { mapLayersState } from "../store/atoms/mapLayersState";
-import { poiLayerVisibleState } from "../store/atoms/poiLayerVisibleState";
+import { mapLayersState } from "../store/atoms/mapLayersSlice";
+import { poiLayerVisibleState } from "../store/atoms/poiLayerVisibleStateSlice";
 import "@testing-library/jest-dom";
 
 describe("MapComponent - TK-Komponenten Tests", () => {

components/PoiUpdateModal.js

@@ -2,8 +2,8 @@
 
 import React, { useState, useEffect } from "react";
 import { useRecoilValue } from "recoil";
-import { selectedPoiState } from "../redux/slices/selectedPoiState";
-import { currentPoiState } from "../redux/slices/currentPoiState";
+import { selectedPoiState } from "../redux/slices/selectedPoiSlice";
+import { currentPoiState } from "../redux/slices/currentPoiSlice";
 
 const PoiUpdateModal = ({ onClose, poiData }) => {
   const currentPoi = useRecoilValue(currentPoiState);

components/ShowAddStationPopup.js

@@ -2,7 +2,7 @@
 import React, { useState, useEffect, use } from "react";
 import ReactDOM from "react-dom";
 import { useRecoilValue, useRecoilState, useSetRecoilState } from "recoil";
-import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStore.js";
+import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStoreSlice.js";
 import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice";
 
 const ShowAddStationPopup = ({ onClose, map, latlng }) => {

components/pois/AddPoiModalWindow.js

@@ -2,7 +2,7 @@
 import React, { useState, useEffect } from "react";
 import Select from "react-select"; // Importiere react-select
 import { useSetRecoilState, useRecoilState } from "recoil";
-import { mapLayersState } from "../../redux/slices/mapLayersState";
+import { mapLayersState } from "../../redux/slices/mapLayersSlice";
 import { poiReadFromDbTriggerAtom } from "../../redux/slices/poiReadFromDbTriggerSlice";
 
 const AddPoiModalWindow = ({ onClose, map, latlng }) => {

components/pois/PoiUpdateModal.js

@@ -2,9 +2,9 @@
 import React, { useState, useEffect } from "react";
 import Select from "react-select"; // Importiere react-select
 import { useRecoilState } from "recoil";
-import { selectedPoiState } from "../../redux/slices/selectedPoiState";
-import { currentPoiState } from "../../redux/slices/currentPoiState";
-import { mapLayersState } from "../../redux/slices/mapLayersState";
+import { selectedPoiState } from "../../redux/slices/selectedPoiSlice";
+import { currentPoiState } from "../../redux/slices/currentPoiSlice";
+import { mapLayersState } from "../../redux/slices/mapLayersSlice";
 
 const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => {
   const currentPoi = useRecoilState(currentPoiState);

components/pois/PoiUpdateModalWrapper.js

@@ -2,7 +2,7 @@
 import React, { useState } from "react";
 import PoiUpdateModal from "./PoiUpdateModal";
 import { useRecoilValue, useSetRecoilState } from "recoil";
-import { currentPoiState, selectedPoiState } from "../../redux/slices/currentPoiState";
+import { currentPoiState, selectedPoiState } from "../../redux/slices/currentPoiSlice";
 import { poiReadFromDbTriggerAtom } from "../../redux/slices/poiReadFromDbTriggerSlice";
 
 const PoiUpdateModalWrapper = ({ show, onClose, latlng }) => {

hooks/useCreateAndSetDevices.js

@@ -1,7 +1,7 @@
 // /hooks/useCreateAndSetDevices.js
 import { useEffect } from "react";
 import { useRecoilState } from "recoil";
-import { polylineEventsDisabledState } from "../redux/slices/polylineEventsDisabledState";
+import { polylineEventsDisabledState } from "../redux/slices/polylineEventsDisabledSlice";
 import { createAndSetDevices } from "../utils/createAndSetDevices";
 
 const useCreateAndSetDevices = (systemId, setMarkersFunction, GisSystemStatic, priorityConfig) => {

hooks/useMapComponentState.js

@@ -2,7 +2,7 @@
 import { useState, useEffect } from "react";
 import usePoiTypData from "./usePoiTypData";
 import { useRecoilValue } from "recoil";
-import { poiLayerVisibleState } from "../redux/slices/poiLayerVisible";
+import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice";
 
 export const useMapComponentState = () => {
   const { poiTypData, isPoiTypLoaded } = usePoiTypData("/api/talas_v5_DB/poiTyp/readPoiTyp");

hooks/useMarkerLayers.js

@@ -1,7 +1,7 @@
 // hooks/useMarkerLayers.js
 import { useEffect } from "react";
 import { useRecoilValue } from "recoil";
-import { mapLayersState } from "../redux/slices/mapLayersState";
+import { mapLayersState } from "../redux/slices/mapLayersSlice";
 
 const useMarkerLayers = (map, markers, layerType) => {
   const mapLayersVisibility = useRecoilValue(mapLayersState);

pages/index.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 import dynamic from "next/dynamic";
 import { useRecoilState, useRecoilValue } from "recoil";
-import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStore.js";
+import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStoreSlice.js";
 import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice";
 
 const MapComponentWithNoSSR = dynamic(() => import("../components/MapComponent"), { ssr: false });

utils/createAndSetDevices.js

@@ -6,7 +6,7 @@ import "leaflet.smooth_marker_bouncing";
 import { toast } from "react-toastify";
 import * as config from "../config/config.js";
 import { disablePolylineEvents, enablePolylineEvents } from "./setupPolylines"; // Importiere die Funktion zum Deaktivieren der Polyline-Ereignisse
-import { setPolylineEventsDisabled } from "../redux/slices/polylineEventsDisabledState"; // Importiere den Recoil-Atom-Zustand
+import { setPolylineEventsDisabled } from "../redux/slices/polylineEventsDisabledSlice"; // Importiere den Recoil-Atom-Zustand
 import { SERVER_URL } from "../config/urls.js";
 
 // Funktion zum Bestimmen der Priorität basierend auf dem Icon-Pfad

utils/setupPolylines.js

@@ -10,7 +10,7 @@ import endIcon from "../components/gisPolylines/icons/EndIcon";
 import { redrawPolyline } from "./mapUtils";
 import { openInNewTab } from "./openInNewTab";
 import { toast } from "react-toastify";
-import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleState";
+import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice";
 import { useRecoilValue } from "recoil";
 
 const protocol = window.location.protocol; // z. B. 'http:' oder 'https:'