@fadyshawky/react-native-magic 1.0.7 → 1.0.9

package/.vscode/settings.json

@@ -0,0 +1,7 @@
+{
+    "workbench.colorCustomizations": {
+        "activityBar.background": "#342D0C",
+        "titleBar.activeBackground": "#493F10",
+        "titleBar.activeForeground": "#FCFAF0"
+    }
+}

package/CHANGELOG.md

@@ -2,6 +2,15 @@
 
 All notable changes to this project will be documented in this file.
 
+## [1.0.8] - 2024-01-24
+
+### Changed
+- Improved FeaturedCarousel component:
+  - Centered carousel items on screen
+  - Adjusted item width to 85% of screen width
+  - Added proper item layout calculations
+  - Enhanced snapping behavior
+
 ## [1.0.7] - 2024-12-27
 
 ### Changed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fadyshawky/react-native-magic",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "description": "react native template with ready components, hooks, react navigation, redux, typescript, etc.",
   "keywords": [
     "react-native-magic",

package/template/App.tsx

@@ -4,27 +4,48 @@
  *
  * @format
  */
-import React from 'react';
-import {LogBox, SafeAreaView, StatusBar} from 'react-native';
+import React, {useEffect} from 'react';
+import {ImageBackground, LogBox, SafeAreaView, StatusBar} from 'react-native';
 import {SheetProvider} from 'react-native-actions-sheet';
 import {SafeAreaProvider} from 'react-native-safe-area-context';
 import {Provider} from 'react-redux';
 import {PersistGate} from 'redux-persist/integration/react';
+import {LocalizationProvider} from './src/common/localization/LocalizationProvider';
+import {
+  Languages,
+  DEFAULT_LANGUAGE,
+} from './src/common/localization/localization';
 import {persistor, store} from './src/core/store/store';
 import AppNavigator from './src/navigation/MainNavigation';
+import {ThemeProvider, useTheme} from './src/core/theme/ThemeProvider';
 
 LogBox.ignoreAllLogs();
+
+const ThemedApp = () => {
+  const {theme} = useTheme();
+  return (
+    <SafeAreaProvider>
+      <SafeAreaView style={{position: 'absolute'}} />
+      <StatusBar
+        barStyle={theme.mode === 'dark' ? 'light-content' : 'dark-content'}
+        backgroundColor={theme.colors.background}
+      />
+      <SheetProvider>
+        <AppNavigator />
+      </SheetProvider>
+    </SafeAreaProvider>
+  );
+};
+
 function App(): React.JSX.Element {
   return (
     <Provider store={store}>
       <PersistGate loading={null} persistor={persistor}>
-        <SafeAreaProvider>
-          <SafeAreaView style={{position: 'absolute'}} />
-          <StatusBar barStyle={'dark-content'} backgroundColor={'white'} />
-          <SheetProvider>
-            <AppNavigator />
-          </SheetProvider>
-        </SafeAreaProvider>
+        <LocalizationProvider initialLanguage={DEFAULT_LANGUAGE}>
+          <ThemeProvider initialTheme="dark">
+            <ThemedApp />
+          </ThemeProvider>
+        </LocalizationProvider>
       </PersistGate>
     </Provider>
   );