Sync data

.gitignore

@@ -5,6 +5,7 @@ node_modules/
 
 # Expo
 .expo/
+.idea/
 dist/
 web-build/
 expo-env.d.ts

app/(main)/teams.tsx

@@ -35,7 +35,6 @@ const TeamsScreen = () => {
 
     useEffect(() => {
         if (teams.length < currentPage * perPage && hasMoreTeamsLocal) {
-            console.log("wywołuje");
             getData();
         }
     }, [currentPage]);

app/_layout.tsx

@@ -1,4 +1,4 @@
 import { store } from "@/core/store";
 import { useColorScheme } from "@/hooks/useColorScheme";
 import { BottomSheetModalProvider } from "@gorhom/bottom-sheet";
 import { DarkTheme, DefaultTheme, ThemeProvider } from "@react-navigation/native";
@@ -7,13 +7,19 @@
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import "react-native-reanimated";
 import { Provider } from "react-redux";
+import React from 'react';
+
+import { EchoListener } from "@/components/EchoListener"; // nowy komponent (poniżej)
+
 export default function RootLayout() {
     const colorScheme = useColorScheme();
+
     return (
         <Provider store={store}>
             <ThemeProvider value={colorScheme === "dark" ? DarkTheme : DefaultTheme}>
-                <GestureHandlerRootView>
+                <GestureHandlerRootView style={{ flex: 1 }}>
                     <BottomSheetModalProvider>
+                        <EchoListener />
                         <Stack>
                             <Stack.Screen name="(auth)/index" options={{ headerShown: false }} />
                             <Stack.Screen name="(main)" options={{ headerShown: false }} />
@@ -25,4 +31,4 @@
             </ThemeProvider>
         </Provider>
     );
-}
+}

components/EchoListener.tsx

@@ -0,0 +1,115 @@
+import { useEffect } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import { getEcho } from "@/scripts/echo";
+import { selectSyncVersion, selectUser } from "@/core/slices/authSlice";
+import { DataCategories } from "@/core/DataCategoriesManager";
+import { currentTeamsPage, resetTeams } from "@/core/slices/teamSlice";
+import { resetSshSlice } from "@/core/slices/sshSlice";
+import { addTeamMember, PageData, resetTeamMembers, teamCurrentPage } from "@/core/slices/teamsMembersSlice";
+import { getMembers, getTeams } from "@/core/teamManager";
+import { TeamType } from "@/types/Team";
+import { addTeam as addTeamToSlice } from "@/core/slices/teamSlice";
+
+export const EchoListener = () => {
+    const user = useSelector(selectUser);
+    const syncVersion = useSelector(selectSyncVersion);
+    const dispatch = useDispatch();
+    const teamCurrnetPage = useSelector(currentTeamsPage);
+
+    useEffect(() => {
+        if (!user?.id) return;
+
+        let channel: any;
+
+        const initEcho = async () => {
+            const echo = await getEcho();
+            const channelName = `sync.user.${user.id}`;
+            channel = echo.private(channelName);
+
+            channel.listen('.sync.nots', async (event: any) => {
+                const data = JSON.parse(event?.message);
+                if (!data || event.user_id !== user.id) return;
+
+                if (data.type !== "report_new_sync_version") return;
+
+                if (syncVersion >= data.new_synchronization_version) return;
+
+                switch (data.category) {
+                    case DataCategories.ssh:
+                        dispatch(resetSshSlice());
+                        break;
+                    case DataCategories.team:
+                        const maxPage = teamCurrnetPage || 1;
+                        dispatch(
+                            resetTeams(),
+                        );
+
+                        for (let page = 1; page <= maxPage; page++) {
+                            try {
+                                const data = await getTeams(page);
+                                if (data?.teams && Array.isArray(data.teams)) {
+                                    data.teams.forEach((team: TeamType) => {
+                                        dispatch(addTeamToSlice({
+                                            team,
+                                            totalPages: data.total_pages,
+                                            currentPage: data.current_page,
+                                        }));
+                                    });
+                                }
+                            } catch (error) {
+                                console.error(error);
+                                break;
+                            }
+                        }
+                        break;
+                    case DataCategories.members:
+                        dispatch(resetTeamMembers());
+
+                        if (data?.team_id) {
+                            const teamId = data.team_id;
+                            const teamPageData = useSelector(PageData);
+                            const maxPage = teamCurrentPage(teamPageData, teamId);
+
+                            try {
+                                for (let page = 1; page <= maxPage; page++) {
+                                    const response = await getMembers(teamId, 1);
+                                    if (response.ok) {
+                                        const membersData = await response.json();
+                                        membersData.members.forEach((member: any) => {
+                                            dispatch(addTeamMember({
+                                                members: member,
+                                                pageData: {
+                                                    team_id: teamId, current_page: 1, total_pages: 1,
+                                                    total_members: 0
+                                                },
+                                            }));
+                                        });
+                                    } else {
+                                        console.error(`Błąd ${response.status}: ${response.statusText}`);
+                                    }
+                                }
+                            } catch (error) {
+                                console.error("Network error:", error);
+                            }
+                        }
+
+                        break;
+                    default:
+                        console.warn("Nieobsługiwana kategoria:", data.category);
+                        break;
+                }
+            });
+        };
+
+        initEcho();
+
+        return () => {
+            if (channel) {
+                channel.stopListening('.sync.nots');
+            }
+        };
+    }, [user?.id, syncVersion]);
+
+
+    return null;
+};

components/TeamAddModal.tsx

@@ -18,8 +18,8 @@ export function TeamAddModal({ modalVisible, setModalVisible }: ServerModalProps
 
     const save = async () => {
         const data = await addTeam(teamName);
-        if (data.team) {
-            setModalVisible(!modalVisible);
+        setModalVisible(!modalVisible);
+        if (data?.team) {
             dispatch(
                 createTeam({
                     team: data.team,

components/TeamRemoveButtonAndModal.tsx

@@ -21,9 +21,9 @@ const TeamRemoveButtonAndModal: React.FC<TeamRemoveButtonAndModalProps> = ({ tea
     };
 
     const handleConfirmDelete = async () => {
-        const reponse = await deleteTeam(teamId);
+        const response = await deleteTeam(teamId);
 
-        if (reponse !== null) {
+        if (response !== null) {
             dispatch(removeTeam(teamId));
         }
 

core/DataCategoriesManager.ts

@@ -0,0 +1,7 @@
+export enum DataCategories {
+    team = "team",
+    gpg_keys = "keys",
+    users = "users",
+    ssh = "ssh",
+    members = "members",
+}

core/customFetch.ts

@@ -1,5 +1,6 @@
-import { endpoint } from "@/constants/api";
+import { endpoint } from "../constants/api";
 import { read, store } from "./settings";
+import {setSyncVersion} from "./slices/authSlice";
 
 export async function fetchApi(url: string, options: RequestInit = {}) {
     const headers = {
@@ -43,6 +44,8 @@ export async function fetchApi(url: string, options: RequestInit = {}) {
                         headers,
                     });
                     if (retryResponse.ok) {
+                        await changeSyncVersion(response);
+
                         return retryResponse;
                     }
                 } catch (error) {
@@ -54,9 +57,25 @@ export async function fetchApi(url: string, options: RequestInit = {}) {
             }
         }
 
+        if (response.ok) {
+            await changeSyncVersion(response);
+        }
+
         return response;
     } catch (error) {
         console.error("Fetch error:", error);
         throw error;
     }
 }
+
+export async function changeSyncVersion(response: Response) {
+    const clone = response.clone();
+    try {
+        const data = await clone.json();
+        if (data?.sync_version) {
+            setSyncVersion(data.sync_version);
+        }
+    } catch (err) {
+        console.warn("Nie udało się odczytać sync_version:", err);
+    }
+}

core/slices/authSlice.ts

@@ -6,6 +6,7 @@ export const authSlice = createSlice({
         apiToken: null,
         refreshToken: null,
         isLoggedIn: false,
+        sync_version: null,
     },
     reducers: {
         setUser: (state, action) => {
@@ -26,8 +27,16 @@ export const authSlice = createSlice({
             state.refreshToken = null;
             state.isLoggedIn = false;
         },
+        setSyncVersion: (state, action) => {
+            state.sync_version = action.payload;
+        },
+
+        resetUser(state) {
+            state.user = null
+        }
     },
 });
 export const selectUser = (state: { auth: { user: User } }) => state.auth.user;
+export const selectSyncVersion = (state: { auth: { sync_version: number } }) => state.auth.sync_version;
 export const selectIsLoggedIn = (state: { auth: { isLoggedIn: boolean } }) => state.auth.isLoggedIn;
-export const { setUser, setApiToken, setRefreshToken, setIsLoggedIn, logout } = authSlice.actions;
+export const { setUser, setApiToken, setRefreshToken, setIsLoggedIn, logout, setSyncVersion } = authSlice.actions;

core/slices/sshSlice.ts

@@ -24,6 +24,13 @@ export const sshSlice = createSlice({
                 state.servers = array;
             }
         },
+
+
+        resetSshSlice(state){
+            state.servers = [];
+        }
+    },
+});
         setKeys: (state, action: { payload: KeyType[] }) => {
             state.keys = action.payload;
         },