init glueastack Components

ArtisanConnect/app/_layout.tsx

@@ -1,4 +1,6 @@
 import { Stack } from "expo-router";
+import "@/global.css";
+import { GluestackUIProvider } from "@/components/ui/gluestack-ui-provider";
 import { Appearance } from "react-native";
 import {Colors} from "@/constants/Colors"
 
@@ -7,11 +9,13 @@ export default function RootLayout() {
 
   const theme = colorScheme === 'dark' ? Colors.dark :
    Colors.light;
-  return <Stack screenOptions={{ headerStyle: {backgroundColor:theme.background},
-  headerTintColor: theme.text
-}}>
-<Stack.Screen name="index"/>
-<Stack.Screen name="+not-found" options={{headerShown:false}}/>
+  return (
+   <GluestackUIProvider mode="light"><Stack screenOptions={{ headerStyle: {backgroundColor:theme.background},
+    headerTintColor: theme.text
+  }}>
+  <Stack.Screen name="index"/>
+  <Stack.Screen name="+not-found" options={{headerShown:false}}/>
 
-</Stack>;
+  </Stack></GluestackUIProvider>
+  );
 }

ArtisanConnect/app/index.jsx

@@ -1,5 +1,8 @@
 import { Text, View, Pressable } from "react-native";
 import { Link } from "expo-router";
+
+import { Button, ButtonText } from "@/components/ui/button"
+
 export default function Index() {
   return (
     <View>
@@ -9,6 +12,10 @@ export default function Index() {
         <Text>Notices</Text>
       </Pressable>
       </Link>
+
+      <Button size="md" variant="solid" action="primary">
+      <ButtonText>Zobacz ogłoszenie</ButtonText>
+    </Button>
     </View>
   );
 }