autoryzacja działa zarówno na android jak i ios

ArtisanConnect/api/categories.jsx

@@ -1,6 +1,6 @@
 import axios from "axios";
 
-const API_URL = "https://testowe.zikor.pl/api/v1";
+const API_URL = "https://hopp.zikor.pl/api/v1";
 
 export async function listCategories() {
     try {

ArtisanConnect/api/notices.jsx

@@ -1,12 +1,18 @@
 import axios from "axios";
 import FormData from 'form-data'
+import {useAuthStore} from "@/store/authStore";
 
-const API_URL = "https://testowe.zikor.pl/api/v1";
+// const API_URL = "https://testowe.zikor.pl/api/v1";
 
-// const API_URL = "http://172.20.10.2:8080/api/v1";
+const API_URL = "https://hopp.zikor.pl/api/v1";
 
 export async function listNotices() {
-    const response = await fetch(`${API_URL}/notices/get/all`);
+    const { token } = useAuthStore.getState();
+    const headers = token ? { 'Authorization': `Bearer ${token}` } : {};
+
+    const response = await fetch(`${API_URL}/notices/get/all`, {
+        headers: headers
+    });
     const data = await response.json();
     if (!response.ok) {
         throw new Error(response.toString());
@@ -17,11 +23,11 @@ export async function listNotices() {
 export async function getNoticeById(noticeId) {
     const response = await fetch(`${API_URL}/notices/get/${noticeId}`);
 
-  const data = await response.json();
-  if (!response.ok) {
-    throw new Error("Error");
-  }
-  return data;
+    const data = await response.json();
+    if (!response.ok) {
+        throw new Error("Error");
+    }
+    return data;
 }
 
 export async function createNotice(notice) {
@@ -53,8 +59,6 @@ export async function getImageByNoticeId(noticeId) {
         const imageName = listResponse.data[0];
         imageUrl = `${API_URL}/images/get/${imageName}`;
 
-        console.log(`Pobrano zdjęcie o nazwie: ${imageName}`);
-
         return imageUrl;
     } catch (err) {
         console.log(`Zdjęcie nie istnieje dla notice o id: ${noticeId}`);
@@ -68,25 +72,23 @@ export async function getAllImagesByNoticeId(noticeId) {
         const listResponse = await axios.get(`${API_URL}/images/list/${noticeId}`);
 
         if (listResponse.data && listResponse.data.length > 0) {
-            const imageUrls = listResponse.data.map(imageName =>
+            return listResponse.data.map(imageName =>
                 `${API_URL}/images/get/${imageName}`
             );
-
-            console.log(`Pobrano ${imageUrls.length} zdjęć dla ogłoszenia o id: ${noticeId}`);
-            return imageUrls;
         }
 
-        console.log(`Brak zdjęć dla ogłoszenia o id: ${noticeId}`);
         return ["https://http.cat/404.jpg"];
     } catch (err) {
-        console.log(`Błąd podczas pobierania listy zdjęć dla ogłoszenia o id: ${noticeId}`, err);
+        if(err.response.status === 404) {
+            console.info(`Ogłoszenie o id: ${noticeId} nie posiada zdjęć.`);
+            return ["https://http.cat/404.jpg"];
+        }
+        console.warn(`Nie udało się pobrać listy zdjęć dla ogłoszenia o id: ${noticeId}`, err);
         return ["https://http.cat/404.jpg"];
     }
 }
 
 export const uploadImage = async (noticeId, imageUri) => {
-    console.log(imageUri);
-
     const formData = new FormData();
 
     const filename = imageUri.split('/').pop();

ArtisanConnect/app.json

@@ -2,7 +2,7 @@
   "expo": {
     "name": "ArtisanConnect",
     "slug": "ArtisanConnect",
-    "scheme": "Artisanconnect",
+    "scheme": "com.hamx.artisanconnect",
     "version": "1.0.0",
     "orientation": "portrait",
     "icon": "./assets/icon.png",
@@ -14,13 +14,19 @@
       "backgroundColor": "#ffffff"
     },
     "ios": {
-      "supportsTablet": true
+      "supportsTablet": true,
+      "bundleIdentifier": "com.hamx.artisanconnect"
     },
     "android": {
       "adaptiveIcon": {
         "foregroundImage": "./assets/adaptive-icon.png",
         "backgroundColor": "#ffffff"
-      }
+      },
+      "permissions": [
+        "android.permission.RECORD_AUDIO",
+        "android.permission.CAMERA"
+      ],
+      "package": "com.hamx.artisanconnect"
     },
     "web": {
       "favicon": "./assets/favicon.png"
@@ -38,7 +44,14 @@
         {
           "cameraPermission": "Please allow $(PRODUCT_NAME) to access your camera"
         }
-      ]
-    ]
+      ],
+      "expo-web-browser"
+    ],
+    "extra": {
+      "router": {},
+      "eas": {
+        "projectId": "7a0d8bc8-938f-4d2a-babb-945faee13429"
+      }
+    }
   }
-}
+}

ArtisanConnect/app/(tabs)/_layout.jsx

@@ -1,64 +1,75 @@
-import { Tabs } from "expo-router";
-import { Ionicons } from "@expo/vector-icons";
+import {Tabs} from "expo-router";
+import {Ionicons} from "@expo/vector-icons";
 
 export default function TabLayout() {
-  return (
-    <Tabs
-      screenOptions={{
-        tabBarActiveTintColor: "rgb(var(--color-primary-500))",
-      }}
-    >
-      <Tabs.Screen
-        name="index"
-        options={{
-          title: "Home",
-          tabBarLabel: "Home",
-          tabBarIcon: ({ color, size }) => (
-            <Ionicons name="home-outline" size={size} color={color} />
-          ),
-        }}
-      />
-      <Tabs.Screen
-        name="notices"
-        options={{
-          title: "Ogłoszenia",
-          tabBarLabel: "Ogłoszenia",
-          tabBarIcon: ({ color, size }) => (
-            <Ionicons name="list-outline" size={size} color={color} />
-          ),
-        }}
-      />
-      <Tabs.Screen
-        name="notice/create"
-        options={{
-          title: "Dodaj",
-          tabBarLabel: "Dodaj",
-          tabBarIcon: ({ color, size }) => (
-            <Ionicons name="add-circle-outline" size={size} color={color} />
-          ),
-        }}
-      />
-      <Tabs.Screen
-        name="wishlist"
-        options={{
-          title: "Ulubione",
-          tabBarLabel: "Ulubione",
-          tabBarIcon: ({ color, size }) => (
-            <Ionicons name="heart-outline" size={size} color={color} />
-          ),
-        }}
-      />
-      <Tabs.Screen
-        name="dashboard"
-        options={{
-          headerShown: false, // Ukryj nagłówek dla Drawer
-          title: "Konto",
-          tabBarLabel: "Konto",
-          tabBarIcon: ({ color, size }) => (
-            <Ionicons name="person-outline" size={size} color={color} />
-          ),
-        }}
-      />
-    </Tabs>
-  );
+    return (
+        <Tabs
+            screenOptions={{
+                tabBarActiveTintColor: "rgb(var(--color-primary-500))",
+            }}
+        >
+            <Tabs.Screen
+                name="index"
+                options={{
+                    title: "Home",
+                    tabBarLabel: "Home",
+                    tabBarIcon: ({color, size}) => (
+                        <Ionicons name="home-outline" size={size} color={color}/>
+                    ),
+                }}
+            />
+            <Tabs.Screen
+                name="notices"
+                options={{
+                    title: "Ogłoszenia",
+                    tabBarLabel: "Ogłoszenia",
+                    tabBarIcon: ({color, size}) => (
+                        <Ionicons name="list-outline" size={size} color={color}/>
+                    ),
+                }}
+            />
+            <Tabs.Screen
+                name="notice/create"
+                options={{
+                    title: "Dodaj",
+                    tabBarLabel: "Dodaj",
+                    tabBarIcon: ({color, size}) => (
+                        <Ionicons name="add-circle-outline" size={size} color={color}/>
+                    ),
+                }}
+            />
+            <Tabs.Screen
+                name="wishlist"
+                options={{
+                    title: "Ulubione",
+                    tabBarLabel: "Ulubione",
+                    tabBarIcon: ({color, size}) => (
+                        <Ionicons name="heart-outline" size={size} color={color}/>
+                    ),
+                }}
+            />
+            <Tabs.Screen
+                name="login"
+                options={{
+                    headerShown: false, // Ukryj nagłówek dla Drawer
+                    title: "Authentication",
+                    tabBarLabel: "Authentication",
+                    tabBarIcon: ({color, size}) => (
+                        <Ionicons name="key" size={size} color={color}/>
+                    ),
+                }}
+            />
+            <Tabs.Screen
+                name="dashboard"
+                options={{
+                    headerShown: false, // Ukryj nagłówek dla Drawer
+                    title: "Konto",
+                    tabBarLabel: "Konto",
+                    tabBarIcon: ({color, size}) => (
+                        <Ionicons name="person-outline" size={size} color={color}/>
+                    ),
+                }}
+            />
+        </Tabs>
+    );
 }

ArtisanConnect/app/(tabs)/login.jsx

@@ -0,0 +1,180 @@
+import React, {useEffect, useState} from 'react';
+import {StyleSheet, ActivityIndicator, SafeAreaView, View, Platform} from 'react-native';
+import {useAuthStore} from '@/store/authStore';
+import {useRouter, Link} from 'expo-router';
+
+import {Box} from "@/components/ui/box"
+import {Button, ButtonText, ButtonIcon} from "@/components/ui/button"
+import {Center} from "@/components/ui/center"
+import {Heading} from "@/components/ui/heading"
+import {Input, InputField} from "@/components/ui/input"
+import {Text} from "@/components/ui/text"
+import {VStack} from "@/components/ui/vstack"
+import {HStack} from "@/components/ui/hstack"
+import {ArrowRightIcon} from "@/components/ui/icon"
+import {Divider} from '@/components/ui/divider';
+import {Ionicons} from "@expo/vector-icons";
+
+import * as WebBrowser from 'expo-web-browser';
+import * as Google from "expo-auth-session/providers/google";
+import AsyncStorage from "@react-native-async-storage/async-storage";
+import {makeRedirectUri} from "expo-auth-session";
+
+import Constants from 'expo-constants';
+
+WebBrowser.maybeCompleteAuthSession();
+
+// client_id ios 936418008320-ohefdfcebd41f6oa2o8phh1mgj9s49sl.apps.googleusercontent.com
+// android 936418008320-d8dfjph5e4r28fcm1rbdfbh5phmbg03d.apps.googleusercontent.com
+
+export default function Login() {
+    const [email, setEmail] = useState('');
+    const [password, setPassword] = useState('');
+    const {signIn, isLoading, signInWithGoogle} = useAuthStore();
+    const router = useRouter();
+
+    const [request, response, promptAsync] = Google.useAuthRequest({
+        androidClientId: "936418008320-d8dfjph5e4r28fcm1rbdfbh5phmbg03d.apps.googleusercontent.com",
+        iosClientId: "936418008320-ohefdfcebd41f6oa2o8phh1mgj9s49sl.apps.googleusercontent.com",
+        webClientId: "936418008320-btdngtlfnjac1p67guje72m9el5q59a7.apps.googleusercontent.com",
+        redirectUri:
+            Platform.OS === 'android'
+                ? makeRedirectUri({
+                    scheme: Constants.expoConfig.android.package,
+                    path: '/',
+                })
+                : undefined,
+    })
+
+    const handleInternalLogin = async () => {
+        if (!email || !password) {
+            alert('Proszę wprowadzić email i hasło.');
+            return;
+        }
+
+        try {
+            await signIn(email, password);
+            alert(`Zalogowano jako ${email}`);
+            router.replace('/');
+        } catch (e) {
+            alert("Błąd logowania: " + (e.response?.data?.message || e.message));
+        }
+    }
+
+    useEffect(() => {
+        handleGoogleLogin();
+    }, [response]);
+
+    const handleGoogleLogin = async () => {
+        // const user = await AsyncStorage.getItem("@user");
+        let user = null;
+        if (!user) {
+            if(response.type === "success") {
+                user = await getUserInfo(response.authentication.accessToken)
+                await signInWithGoogle(response.authentication.accessToken);
+                alert(`Zalogowano jako ${user.email}`);
+            }
+
+        } else {
+            console.info("Pobrano użytkownika z AsyncStorage:", JSON.parse(user));
+            alert(`Zalogowano jako ${user.email}`);
+        }
+    };
+
+    const getUserInfo = async (token) => {
+        if(!token) {
+            return
+        }
+        try {
+            const response = await fetch("https://www.googleapis.com/userinfo/v2/me",
+                {
+                    headers: {
+                        Authorization: `Bearer ${token}`
+                    },
+                }
+            );
+            const user = await response.json();
+            await AsyncStorage.setItem("@user", JSON.stringify(user));
+            return user;
+        } catch (error) {
+            console.error("Błąd podczas pobierania informacji o użytkowniku:", error);
+            throw error;
+        }
+    }
+
+    if (isLoading) {
+        return (
+            <View style={styles.container}>
+                <ActivityIndicator size="large"/>
+            </View>
+        );
+    }
+
+    return (
+        <SafeAreaView style={styles.container}>
+            <Center>
+                <Box className="p-5 max-w-96 border border-background-300 rounded-lg">
+                    <VStack className="pb-4" space="xs">
+                        <Heading className="leading-[30px]">Logowanie</Heading>
+                        <Box className="flex flex-row">
+                            <Link href="/registration" asChild>
+                                <Button variant="link" size="sm" className="p-0">
+                                    <ButtonText style={styles.signupbutton}>Nie masz jeszcze konta? Załóz je
+                                        tutaj!</ButtonText>
+                                    <ButtonIcon className="mr-1" size="md" as={ArrowRightIcon}/>
+                                </Button>
+                            </Link>
+                        </Box>
+                    </VStack>
+                    <VStack space="xl" className="py-2">
+                        <Input>
+                            <InputField className="py-2" placeholder="Login" onChangeText={setEmail}/>
+                        </Input>
+                        <Input>
+                            <InputField type="password" className="py-2" placeholder="Hasło"
+                                        onChangeText={setPassword}/>
+                        </Input>
+                    </VStack>
+                    <VStack space="lg" className="pt-4">
+                        <Button size="sm" onPress={handleInternalLogin}>
+                            <ButtonText>Zaloguj się</ButtonText>
+                        </Button>
+                    </VStack>
+
+                    <HStack alignItems="center" space="sm" className="pt-6 pb-6">
+                        <Divider flex={1}/>
+                        <Text fontSize="$sm" className="text-gray-300">
+                            lub
+                        </Text>
+                        <Divider flex={1}/>
+                    </HStack>
+                    <Button size="sm" onPress={() => promptAsync()}>
+                        <Ionicons name="logo-google" color="#fff"/>
+                    </Button>
+                </Box>
+            </Center>
+        </SafeAreaView>
+    );
+}
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        justifyContent: 'center',
+        padding: 20,
+    },
+    input: {
+        borderWidth: 1,
+        borderColor: '#ddd',
+        borderRadius: 5,
+        marginBottom: 15,
+        padding: 10,
+    },
+    errorText: {
+        color: 'red',
+        marginBottom: 10,
+    },
+    signupbutton: {
+        fontWeight: '300',
+    },
+});

ArtisanConnect/app/registration.jsx

@@ -0,0 +1,96 @@
+import React, {useState} from 'react';
+import {StyleSheet, ActivityIndicator, SafeAreaView, View} from 'react-native';
+import {useAuthStore} from '@/store/authStore';
+import {useRouter} from 'expo-router';
+
+import {Box} from "@/components/ui/box"
+import {Button, ButtonText} from "@/components/ui/button"
+import {Center} from "@/components/ui/center"
+import {Heading} from "@/components/ui/heading"
+import {Input, InputField} from "@/components/ui/input"
+import {VStack} from "@/components/ui/vstack"
+
+export default function Registration() {
+    const [email, setEmail] = useState('');
+    const [password, setPassword] = useState('');
+    const [firstName, setFirstName] = useState('');
+    const [lastName, setLastName] = useState('');
+    const {signUp, isLoading} = useAuthStore();
+    const router = useRouter();
+
+    const handleInternalRegistration = async () => {
+        if (!email || !password || !firstName || !lastName) {
+            alert('Proszę uzupełnić wszystkie pola');
+            return;
+        }
+
+        try {
+            await signUp({email, password, firstName, lastName});
+            alert(`Zalogowano jako ${email}`);
+            router.replace('/');
+        } catch (e) {
+            alert("Błąd logowania: " + (e.response?.data?.message || e.message));
+        }
+    }
+
+    if (isLoading) {
+        return (
+            <View style={styles.container}>
+                <ActivityIndicator size="large"/>
+            </View>
+        );
+    }
+
+    return (
+        <SafeAreaView style={styles.container}>
+            <Center>
+                <Box className="p-5 w-[80%] border border-background-300 rounded-lg">
+                    <VStack className="pb-4" space="xs">
+                        <Heading className="leading-[30px]">Rejestracja</Heading>
+                    </VStack>
+                    <VStack space="xl" className="py-2">
+                        <Input>
+                            <InputField type="email" className="py-2" placeholder="E-mail" onChangeText={setEmail}/>
+                        </Input>
+                        <Input>
+                            <InputField className="py-2" placeholder="Imię" onChangeText={setFirstName}/>
+                        </Input>
+                        <Input>
+                            <InputField className="py-2" placeholder="Nazwisko" onChangeText={setLastName}/>
+                        </Input>
+                        <Input>
+                            <InputField type="password" className="py-2" placeholder="Hasło"
+                                        onChangeText={setPassword}/>
+                        </Input>
+                    </VStack>
+                    <VStack space="lg" className="pt-4">
+                        <Button size="sm" onPress={handleInternalRegistration}>
+                            <ButtonText>Zarejestruj się</ButtonText>
+                        </Button>
+                    </VStack>
+                </Box>
+            </Center>
+        </SafeAreaView>
+    );
+}
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        justifyContent: 'center',
+    },
+    formContainer: {
+        width: '80%',
+    },
+    input: {
+        borderWidth: 1,
+        borderColor: '#ddd',
+        borderRadius: 5,
+        marginBottom: 15,
+        padding: 10,
+    },
+    errorText: {
+        color: 'red',
+        marginBottom: 10,
+    },
+});

ArtisanConnect/eas.json

@@ -0,0 +1,21 @@
+{
+  "cli": {
+    "version": ">= 16.8.0",
+    "appVersionSource": "remote"
+  },
+  "build": {
+    "development": {
+      "developmentClient": true,
+      "distribution": "internal"
+    },
+    "preview": {
+      "distribution": "internal"
+    },
+    "production": {
+      "autoIncrement": true
+    }
+  },
+  "submit": {
+    "production": {}
+  }
+}

ArtisanConnect/package.json

@@ -14,6 +14,7 @@
     "@gluestack-style/react": "^1.0.57",
     "@gluestack-ui/actionsheet": "^0.2.53",
     "@gluestack-ui/button": "^1.0.14",
+    "@gluestack-ui/divider": "^0.1.10",
     "@gluestack-ui/form-control": "^0.1.19",
     "@gluestack-ui/hstack": "^0.1.17",
     "@gluestack-ui/icon": "^0.1.27",
@@ -26,18 +27,24 @@
     "@gluestack-ui/themed": "^1.1.73",
     "@gluestack-ui/toast": "^1.0.9",
     "@legendapp/motion": "^2.4.0",
+    "@react-native-async-storage/async-storage": "2.1.2",
+    "@react-native-community/cli-link-assets": "^18.0.0",
     "@react-navigation/drawer": "^7.3.11",
     "@tanstack/react-query": "^5.74.4",
     "axios": "^1.9.0",
     "babel-plugin-module-resolver": "^5.0.2",
     "expo": "^53.0.0",
-    "expo-constants": "~17.1.5",
+    "expo-auth-session": "~6.1.5",
+    "expo-camera": "~16.1.6",
+    "expo-constants": "~17.1.6",
     "expo-image-picker": "~16.1.4",
     "expo-linking": "~7.1.4",
     "expo-router": "~5.0.5",
     "expo-status-bar": "~2.2.3",
+    "expo-web-browser": "~14.1.6",
     "form-data": "^4.0.2",
     "fs": "^0.0.1-security",
+    "lucide-react-native": "^0.511.0",
     "nativewind": "^4.1.23",
     "react": "19.0.0",
     "react-dom": "19.0.0",
@@ -46,12 +53,12 @@
     "react-native-gesture-handler": "~2.24.0",
     "react-native-reanimated": "~3.17.4",
     "react-native-safe-area-context": "5.4.0",
-    "react-native-screens": "~4.10.0",
+    "react-native-screens": "~4.11.1",
     "react-native-svg": "15.11.2",
     "react-native-web": "~0.20.0",
     "tailwindcss": "^3.4.17",
     "zustand": "^5.0.3",
-    "expo-camera": "~16.1.6"
+    "expo-crypto": "~14.1.4"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",

ArtisanConnect/store/authStore.jsx

@@ -0,0 +1,105 @@
+import {create} from "zustand";
+import {createJSONStorage, persist} from "zustand/middleware";
+import AsyncStorage from "@react-native-async-storage/async-storage";
+import axios from "axios";
+
+const API_URL = "https://hopp.zikor.pl/api/v1";
+
+export const useAuthStore = create(
+    persist(
+        (set) => ({
+            user_id: null,
+            token: null,
+            isLoading: false,
+            error: null,
+
+            signIn: async (email, password) => {
+                set({isLoading: true, error: null});
+                try {
+                    const response = await axios.post(`${API_URL}/auth/login`, {
+                        email,
+                        password
+                    });
+
+                    const user_id = response.data.user_id;
+                    const token = response.data.token;
+                    set({user_id: user_id, token: token, isLoading: false});
+
+                    axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
+                } catch (error) {
+                    set({error: error.response?.data?.message || error.message, isLoading: false});
+                    throw error;
+                }
+            },
+
+            signUp: async (userData) => {
+                set({isLoading: true, error: null});
+                try {
+                    const response = await axios.post(`${API_URL}/auth/register`, userData, {
+                        headers: {'Content-Type': 'application/json'}
+                    });
+
+                    const user_id = response.data.user_id;
+                    const token = response.data.token;
+                    set({user_id: user_id, token: token, isLoading: false});
+
+                    axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
+                } catch (error) {
+                    set({error: error.response?.data?.message || error.message, isLoading: false});
+                    throw error;
+                }
+            },
+
+            signInWithGoogle: async (googleToken) => {
+                set({isLoading: true, error: null});
+                try {
+                    const response = await axios.post(`${API_URL}/auth/google`, {googleToken: googleToken}, {
+                        headers: {'Content-Type': 'application/json'}
+                    });
+                    const user_id = response.data.user_id;
+                    const token = response.data.token;
+                    set({user_id: user_id, token: token, isLoading: false});
+
+                    axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
+                } catch (error) {
+                    set({error: error.response?.data?.message || error.message, isLoading: false});
+                    throw error;
+                }
+            },
+
+            signOut: async () => {
+                try {
+                    await axios.post(`${API_URL}/auth/logout`);
+                } catch (error) {
+                    console.error("Logout error:", error);
+                } finally {
+                    delete axios.defaults.headers.common["Authorization"];
+                    set({user_id: null, token: null});
+                }
+            },
+
+            checkAuth: async () => {
+                const {token} = useAuthStore.getState();
+                if (!token) return null;
+
+                set({isLoading: true});
+                try {
+                    axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
+
+                    const response = await axios.get(`${API_URL}/auth/me`);
+
+                    set({user_id: response.data, isLoading: false});
+                    return response.data;
+                } catch (error) {
+                    delete axios.defaults.headers.common["Authorization"];
+                    set({user_id: null, token: null, isLoading: false});
+                    return null;
+                }
+            },
+        }),
+        {
+            name: "auth-storage",
+            storage: createJSONStorage(() => AsyncStorage),
+        }
+    )
+);