@fadyshawky/react-native-magic 2.0.3 → 2.0.5

package/template/src/core/store/user/userState.ts

@@ -1,44 +1,167 @@
 import {LoadState} from '../../../../types';
 
 export interface UserState {
-  user: UserEntity;
+  user: User;
+  current_balance: number;
+  daily_commission: number;
   accessToken: string;
-  loginLoading: LoadState;
+  loginLoading: string;
+  tempToken: string;
+  favoriteCategories: number[];
+  favoriteProviders: number[];
+  history: HistoryEntity[];
+  historyDetails: HistoryDetailsEntity[];
+}
+export interface User {
+  type: string;
+  mobile_number: string;
+  full_name: string;
+  merchantStore: MerchantStore;
+  status: string;
+}
+export interface MerchantStore {
+  id: number;
+  wallet_user_id: number;
+  name: string;
+  address: string;
+  city: string;
+  region: string;
+  store_imgs?: null;
+  tax_card?: null;
+  commercial_registration?: null;
+  createdAt: string;
+  updatedAt: string;
+  id_front: string;
+  id_back: string;
+  selfie?: null;
+}
+export interface HistoryEntity {
+  id: number;
+  transaction_reference_num: string;
+  bee_transaction_id?: null;
+  fawry_transaction_id?: string | null;
+  transaction_serial_num?: string | null;
+  amount: string | number;
+  sender_fees: string;
+  reciever_fees: string;
+  sender_identifier: string;
+  reciever_identifier: string;
+  status: string;
+  sender_status: string;
+  receiver_status: string;
+  reason?: null;
+  transactionReason: string;
+  display_reason?: null;
+  sender_interchange_amount: string;
+  receiver_interchange_amount: string;
+  sender_commission: string;
+  receiver_commission: string;
+  bulk_id?: null;
+  sender_name: string;
+  receiver_name: string;
+  notification_id?: null;
+  transaction_data?: null;
+  convenience: string;
+  tips: string;
+  reference1?: null;
+  reference2?: null;
+  meta?: null;
+  createdAt: string;
+  updatedAt: string;
+  transaction_type: number;
+  sender_id: number;
+  reciever_id: number;
+  sender_scheme_id: number;
+  receiver_scheme_id: number;
+  'Transaction_type.id': number;
+  'Transaction_type.name': string;
+  'Transaction_type.name_ar'?: null;
+  'Transaction_type.request_type': string;
+  'Transaction_type.request_type_ar'?: null;
+  'Transaction_type.timeout': string;
+  'Transaction_type.on_off_us': string;
+  'Transaction_type.sender_type': string;
+  'Transaction_type.profile_type'?: null;
+  'Transaction_type.receiver_type': string;
+  'Transaction_type.tahweel_operation': string;
+  'Transaction_type.send_fees'?: string | null;
+  'Transaction_type.receive_fees': string;
+  'Transaction_type.send_limit': string;
+  'Transaction_type.receive_limit': string;
+  'Transaction_type.send_commision'?: string | null;
+  'Transaction_type.receive_commision'?: null;
+  'Transaction_type.createdAt': string;
+  'Transaction_type.updatedAt': string;
+  providerName?: string | null;
+  serviceName?: string | null;
+  totalAmount?: number | null;
+}
+export interface HistoryDetailsEntity {
+  value: string;
+  type: string;
+  label?: string;
+}
+
+export enum UserStatus {
+  ACTIVE = 'Active',
+  REGISTERED = 'Registered',
+  SUSPENDED = 'Suspended',
+  PENDING = 'Pending',
 }
 
 export interface UserPayload {
-  user: UserEntity;
+  type: string;
+  mobile_number: string;
+  full_name: string;
+  merchantStore: MerchantStore;
+  requests: HistoryEntity[];
+  data: HistoryDetailsEntity[];
+  balance: {
+    name: string;
+    value: number;
+  }[];
+  current_balance: {
+    name: string;
+    value: number;
+  }[];
+  status: UserStatus;
+  fullname: string;
   token: string;
 }
 
 export const UserInitialState: UserState = {
   user: {
-    id: 0,
-    email: '',
-    first_name: '',
-    last_name: '',
-    phone_number: '',
-    address: '',
-    role_id: 0,
-    created_at: '',
-    updated_at: '',
-    deleted_at: null,
-    roleName: '',
+    type: '',
+    mobile_number: '',
+    full_name: '',
+    status: UserStatus.PENDING,
+    merchantStore: {
+      id: 0,
+      wallet_user_id: 0,
+      name: '',
+      address: '',
+      city: '',
+      region: '',
+      createdAt: '',
+      updatedAt: '',
+      id_front: '',
+      id_back: '',
+    },
   },
+  current_balance: 0,
+  daily_commission: 0,
   accessToken: '',
   loginLoading: LoadState['needLoad'],
+  tempToken: '',
+  favoriteCategories: [],
+  favoriteProviders: [],
+  history: [],
+  historyDetails: [],
 };
 
 export interface UserEntity {
-  id: number;
-  email: string;
-  first_name: string;
-  last_name: string;
-  phone_number: string;
-  address: string;
-  role_id: number;
-  created_at: string;
-  updated_at: string;
-  deleted_at?: null;
-  roleName: string;
+  type: string;
+  status: UserStatus;
+  mobile_number: string;
+  full_name: string;
 }

package/template/src/core/theme/colors.ts

@@ -1,99 +1,75 @@
-export enum PrimaryColors {
-  PlatinateBlue_0 = '#E9EDFF',
-  PlatinateBlue_25 = '#D3DAFF',
-  PlatinateBlue_50 = '#BDC8FF',
-  PlatinateBlue_100 = '#A7B5FF',
-  PlatinateBlue_200 = '#7C91FF',
-  PlatinateBlue_300 = '#506CFF',
-  PlatinateBlue_400 = '#2447FF',
-  PlatinateBlue_500 = '#1D39CC',
-  PlatinateBlue_600 = '#1D39CC',
-  PlatinateBlue_700 = '#0E1C66',
-  cetaceanBlue_0 = '#4C7CEA',
-  cetaceanBlue_25 = '#436FD5',
-  cetaceanBlue_50 = '#3B63BF',
-  cetaceanBlue_100 = '#3257AA',
-  cetaceanBlue_200 = '#223E80',
-  cetaceanBlue_300 = '#112655',
-  cetaceanBlue_400 = '#000D2B',
-  cetaceanBlue_500 = '#000A22',
-  cetaceanBlue_600 = '#00081A',
-  cetaceanBlue_700 = '#000511',
-  strokeDeactive = '#D3DAFF',
+export enum BlackColors {
+  indigoBlue = '#6666FF',
+  mutedLavender = '#B3B5FF',
+  tintColor = '#B3B5FF',
+  mutedLavender30 = 'rgba(184, 186, 255, 0.3)',
+  balanceBackground = 'rgba(41, 45, 50, 0.8)',
+  white = '#FFFFFF',
+  backgroundOpacity = 'rgba(36, 40, 44, 0.8)',
+  black = '#000000',
+  background = '#000000',
+  surface = '#121212',
+  card = '#1E1E1E',
+  shadow = '#FFFFFF',
+  red = '#FB043E',
 }
 
-export enum NaturalColors {
-  grayScale_0 = '#FAFAFA',
-  grayScale_25 = '#A3AAAD',
-  grayScale_50 = '#949C9E',
-  grayScale_100 = '#858D8F',
-  grayScale_200 = '#686F72',
-  grayScale_300 = '#4A5254',
-  grayScale_400 = '#2D3436',
-  grayScale_500 = '#242A2B',
-  grayScale_600 = '#1B1F20',
-  grayScale_700 = '#121516',
-  naturalColor_0 = '#9C97B3',
-  naturalColor_25 = '#8E89A4',
-  naturalColor_50 = '#7F7B94',
-  naturalColor_100 = '#716D85',
-  naturalColor_200 = '#555265',
-  naturalColor_300 = '#383646',
-  naturalColor_400 = '#1C1A27',
-  naturalColor_500 = '#16151F',
-  naturalColor_600 = '#111017',
-  naturalColor_700 = '#0B0A10',
+export enum WhiteColors {
+  indigoBlue = '#6666FF',
+  mutedLavender = '#B3B5FF',
+  tintColor = '#6666FF',
+  mutedLavender30 = 'rgba(184, 186, 255, 0.3)',
+  balanceBackground = 'rgba(184, 186, 255, 0.3)',
+  white = '#FFFFFF',
+  backgroundOpacity = 'rgba(255, 255, 255, 0.7)',
+  black = '#000000',
+  background = '#FFFFFF',
+  surface = '#FFFFFF',
+  card = '#FFFFFF',
+  shadow = 'rgba(0, 0, 0, 0.8)',
+  red = '#FB043E',
 }
 
-export enum AlertColors {
-  links_0 = '#E8F2FF',
-  links_25 = '#D2E4FE',
-  links_50 = '#BBD7FE',
-  links_100 = '#A5CAFE',
-  links_200 = '#77AFFD',
-  links_300 = '#4A95FD',
-  links_400 = '#1D7AFC',
-  links_500 = '#1762CA',
-  links_600 = '#114997',
-  links_700 = '#0C3165',
-  success_0 = '#C6FFE5',
-  success_25 = '#8FE6BE',
-  success_50 = '#7DDAB0',
-  success_100 = '#6CCEA1',
-  success_200 = '#48B684',
-  success_300 = '#259E67',
-  success_400 = '#02864A',
-  success_500 = '#026B3B',
-  success_600 = '#01502C',
-  success_700 = '#01361E',
-  warning_0 = '#FFF4E8',
-  warning_25 = '#FEE8D1',
-  warning_50 = '#FEDDBA',
-  warning_100 = '#FDD1A3',
-  warning_200 = '#FDBB76',
-  warning_300 = '#FCA448',
-  warning_400 = '#FB8D1A',
-  warning_500 = '#C97115',
-  warning_600 = '#975510',
-  warning_700 = '#64380A',
-  error_0 = '#FDE6EC',
-  error_25 = '#FACED8',
-  error_50 = '#F8B5C5',
-  error_100 = '#F69CB2',
-  error_200 = '#F16B8B',
-  error_300 = '#ED3965',
-  error_400 = '#E8083E',
-  error_500 = '#BA0632',
-  error_600 = '#8B0525',
-  error_700 = '#5D0319',
-  discover_0 = '#F1ECF6',
-  discover_25 = '#E4D9EC',
-  discover_50 = '#D6C5E3',
-  discover_100 = '#C8B2D9',
-  discover_200 = '#AD8CC7',
-  discover_300 = '#9165B4',
-  discover_400 = '#763FA1',
-  discover_500 = '#5E3281',
-  discover_600 = '#472661',
-  discover_700 = '#2F1940',
+export enum NewColors {
+  violetLight = '#F3F2FF',
+  violetLightHover = '#E6E6FF',
+  violetLightActive = '#C1C0FE',
+  violetNormal = '#8481FD',
+  violetNormalHover = '#5250D9',
+  violetNormalActive = '#3331B8',
+  violetDark = '#262626',
+  violetDarkHover = '#1A1994',
+  violetDarkActive = '#111066',
+  violetDarker = '#000033',
+  blueLight = '#F6FCFF',
+  blueLightHover = '#E9F8FF',
+  blueLightActive = '#C1E5FF',
+  blueNormal = '#52BDFF',
+  blueNormalHover = '#3399D9',
+  blueNormalActive = '#1A7DB3',
+  blueDarker = '#262626',
+  greyLight = '#F9FCFF',
+  greyLightHover = '#E0E0E0',
+  greyLightActive = '#BDBDBD',
+  greyNormal = '#929292',
+  greyNormalHover = '#666666',
+  greyNormalActive = '#4D4D4D',
+  greyDarker = '#262626',
+  orandeLight = '#FFFAF8',
+  orandeLightHover = '#FDECE1',
+  orandeLightActive = '#FBCEB4',
+  orandeNormal = '#F2565E',
+  orandeNormalHover = '#CE3C3E',
+  orandeNormalActive = '#AD3335',
+  orandeDarker = '#262626',
+  lightBlueLight = '#FEF7F7',
+  lightBlueLightHover = '#FCDDDF',
+  lightBlueLightActive = '#F9AAAF',
+  lightBlueNormal = '#CE3C3E',
+  lightBlueNormalHover = '#AD3335',
+  lightBlueNormalActive = '#8C292B',
+  lightBlueDarker = '#262626',
+  red = '#FFFCF1',
+  green = '#F4FDFB',
+  background = '#FAFAFA',
 }

package/template/src/core/theme/commonConsts.ts

@@ -9,7 +9,7 @@ import {
   StyleSheet,
 } from 'react-native';
 import DeviceInfo from 'react-native-device-info';
-import {createPerfectSize} from '../../common/utils/createPerfectSize';
+import {createPerfectSize} from '../../common/utils';
 
 const windowDimensions = Dimensions.get('window');
 export const isIos = Platform.OS == 'ios';

package/template/src/core/theme/commonSizes.ts

@@ -1,127 +1,102 @@
-import {ISize} from './types';
+import {ISize} from '../../../types';
+import {scale, scaleFontSize, scaleSpacing, scaleBorderRadius} from './scaling';
 
-export const CommonSizes = {
-  font: {
-    // Body Text Sizes
-    bodySmall: 12, // Body Small
-    bodyMedium: 14, // Body Medium
-    bodyLarge: 16, // Body Large
-    bodyXLarge: 18, // Body XLarge
+// Font sizes following design system
+export const FontSizes = {
+  // Header sizes
+  header1: scaleFontSize(48),
+  header2: scaleFontSize(48),
+
+  // Body sizes
+  body1: scaleFontSize(32),
+  body2: scaleFontSize(30),
 
-    // Heading Sizes
-    heading6: 18, // Heading 6 / Bold / 18px
-    heading4: 24, // Heading 4 / Bold / 24px
-    heading3: 32, // Heading 3 / Bold / 32px
-    heading2: 48, // Heading 2 / Bold / 48px
-    heading1: 64, // Heading 1 / Bold / 64px
+  // Component specific sizes
+  button: scaleFontSize(36),
+  card: scaleFontSize(34),
+  searchBar: scaleFontSize(24),
+  balanceLabel: scaleFontSize(16),
+  label: scaleFontSize(20),
+  hyperlink: scaleFontSize(24),
+  // Additional utility sizes
+  small: scaleFontSize(24),
+  medium: scaleFontSize(30),
+  large: scaleFontSize(36),
+  extraLarge: scaleFontSize(48),
+  navBar: scaleFontSize(22),
+} as const;
 
-    // Legacy support - keeping these for backward compatibility
-    extraSmall: 12, // Maps to bodySmall
-    extraSmallPlus: 14, // Maps to bodyMedium
-    small: 14, // Maps to bodyMedium
-    smallPlus: 16, // Maps to bodyLarge
-    medium: 16, // Maps to bodyLarge
-    mediumPlus: 18, // Maps to bodyXLarge
-    extraMedium: 24, // Maps to heading4
-    large: 32, // Maps to heading3
-    largePlus: 48, // Maps to heading2
-    extraLarge: 64, // Maps to heading1
-    extraLargePlus: 64, // Maps to heading1
-  } as Readonly<ISize['font']>,
-  letterSpacing: {
-    // Default letter spacing for Almarai
-    bodySmall: 0,
-    bodyMedium: 0,
-    bodyLarge: 0,
-    bodyXLarge: 0,
-    heading6: 0,
-    heading4: 0,
-    heading3: 0,
-    heading2: 0,
-    heading1: 0,
+// Letter spacing for typography
+export const LetterSpacing = {
+  none: 0,
+  tiny: scale(-0.5),
+  small: scale(-0.25),
+  medium: scale(0),
+  extraMedium: scale(0.25),
+  large: scale(0.5),
+  extraLarge: scale(1),
+  huge: scale(2),
+} as const;
 
-    // Legacy support
-    extraSmall: 0,
-    extraSmallPlus: 0,
-    small: 0,
-    smallPlus: 0,
-    medium: 0,
-    mediumPlus: 0,
-    large: 0,
-    largePlus: 0,
-    extraLarge: 0,
-    extraLargePlus: 0,
-  } as Readonly<ISize['letterSpacing']>,
-  lineHeight: {
-    // Line heights optimized for Almarai's large x-height
-    bodySmall: 16, // ~1.33 line height
-    bodyMedium: 20, // ~1.43 line height
-    bodyLarge: 24, // ~1.5 line height
-    bodyXLarge: 26, // ~1.44 line height
-    heading6: 24, // ~1.33 line height
-    heading4: 32, // ~1.33 line height
-    heading3: 40, // ~1.25 line height
-    heading2: 56, // ~1.17 line height
-    heading1: 72, // ~1.125 line height
+// Line heights for consistent vertical rhythm
+export const LineHeight = {
+  none: 0,
+  tiny: scale(14),
+  small: scale(16),
+  medium: scale(18),
+  extraMedium: scale(20),
+  large: scale(22),
+  extraLarge: scale(24),
+  huge: scale(28),
+} as const;
 
-    // Legacy support
-    extraSmall: 16,
-    extraSmallPlus: 20,
-    small: 20,
-    smallPlus: 24,
-    medium: 24,
-    mediumPlus: 26,
-    large: 40,
-    largePlus: 56,
-    extraLarge: 72,
-    extraLargePlus: 72,
-  } as Readonly<ISize['lineHeight']>,
-  spacing: {
-    none: 0, // space / 0
-    xSmall: 2, // space / 2
-    small: 4, // space / 4
-    medium: 8, // space / 8
-    large: 12, // space / 12
-    xLarge: 16, // space / 16
-    xxLarge: 24, // space / 24 (2X-Large)
-    xxxLarge: 32, // space / 32 (3X-Large)
-    xxxxLarge: 48, // space / 48 (4X-Large)
-    xxxxxLarge: 64, // space / 64 (5X-Large)
-    xxxxxxLarge: 80, // space / 80 (6X-Large)
-    full: 100, // space / 100 (Full)
+// Spacing system that aligns with theme spacing
+export const Spacing = {
+  none: 0,
+  tiny: scaleSpacing(2),
+  small: scaleSpacing(4),
+  medium: scaleSpacing(8),
+  extraMedium: scaleSpacing(12),
+  large: scaleSpacing(16),
+  largePlus: scaleSpacing(16),
+  extraLarge: scaleSpacing(24),
+  extraLargePlus: scaleSpacing(30),
+  huge: scaleSpacing(35),
+  xl: scaleSpacing(40),
+  xxl: scaleSpacing(50),
+} as const;
 
-    // Legacy support - keeping these for backward compatibility
-    xs: 4, // Maps to small
-    sm: 8, // Maps to medium
-    md: 16, // Maps to xLarge
-    lg: 24, // Maps to xxLarge
-    xl: 32, // Maps to xxxLarge
-  } as Readonly<ISize['spacing']>,
-  borderRadius: {
-    none: 0, // Border / 0
-    xSmall: 2, // Border / 2
-    small: 4, // Border / 4
-    medium: 8, // Border / 8
-    large: 12, // Border / 12
-    xLarge: 16, // Border / 16
-    xxLarge: 24, // Border / 24 (2X-Large)
-    full: 1000, // Border / 1000 (Full)
+// Border radius system that aligns with theme borderRadius
+export const BorderRadius = {
+  none: 0,
+  tiny: scaleBorderRadius(2),
+  small: scaleBorderRadius(4),
+  medium: scaleBorderRadius(8),
+  extraMedium: scaleBorderRadius(12),
+  large: scaleBorderRadius(16),
+  extraLarge: scaleBorderRadius(24),
+  huge: scaleBorderRadius(32),
+  circular: 999,
+} as const;
 
-    // Legacy support - keeping these for backward compatibility
-    xs: 4, // Maps to small
-    sm: 8, // Maps to medium
-    md: 12, // Maps to large
-    lg: 16, // Maps to xLarge
-    xl: 24, // Maps to xxLarge
-  } as Readonly<ISize['borderRadius']>,
-  borderWidth: {
-    none: 0, // Stroke / 0
-    xSmall: 0.5, // Stroke / 0.5
-    small: 1, // Stroke / 1
-    medium: 1.5, // Stroke / 1.5
-    large: 2, // Stroke / 2
+// Border widths
+export const BorderWidth = {
+  none: 0,
+  tiny: scale(0.5),
+  small: scale(1),
+  medium: scale(2),
+  extraMedium: scale(3),
+  large: scale(4),
+  extraLarge: scale(6),
+  huge: scale(8),
+} as const;
 
-    // Legacy support - keeping these for backward compatibility
-    extraSmall: 0.5, // Maps to xSmall
-  } as Readonly<ISize['borderWidth']>,
-};
+// Legacy export for backward compatibility
+export const CommonSizes = {
+  letterSpacing: LetterSpacing,
+  lineHeight: LineHeight,
+  spacing: Spacing,
+  borderRadius: BorderRadius,
+  borderWidth: BorderWidth,
+  fontSize: FontSizes,
+} as const;