@fadyshawky/react-native-magic 2.0.4 → 2.0.5

package/template/src/common/utils/printData.tsx

@@ -0,0 +1,161 @@
+import moment from 'moment';
+import {Service} from '../../core/store/Services/servicesState';
+import {ServiceProvider} from '../../core/store/Providers/providersState';
+
+const localization = {
+  serialNumber: 'الرقم التسلسلي',
+  serviceName: 'اسم الخدمة',
+  providerName: 'اسم المقدم',
+  customerNumber: 'رقم العميل',
+  value: 'القيمة',
+  serviceCost: 'تكلفة الخدمة',
+  operationNumber: 'رقم العملية',
+  referenceNumber: 'الرقم المرجعي',
+  time: 'الوقت',
+  total: 'الإجمالي',
+  expiryDate: 'تاريخ الانتهاء',
+  dueDate: 'الموعد المستحق',
+  issueDate: 'تاريخ الإصدار',
+  quantity: 'الكمية',
+  vatValue: 'القسيمة',
+};
+
+export const makePrintData = ({
+  service,
+  BillingAcct,
+  provider,
+  billInfo,
+  amuont,
+  fees,
+  quantity,
+  vatValue,
+}: {
+  service: Service;
+  BillingAcct: string;
+  provider: ServiceProvider;
+  billInfo: any;
+  amuont: string;
+  fees: number;
+  quantity: string;
+  vatValue: string;
+}) => {
+  let newData = [];
+  newData.push({
+    value: 'logo',
+    type: 'image',
+  });
+
+  newData.push({
+    value: service?.Name,
+    type: 'header2',
+  });
+  if (billInfo?.BillLabel) {
+    newData.push({
+      value: billInfo?.BillLabel,
+      type: 'header2',
+    });
+  }
+  newData.push({
+    value: provider?.BillerName,
+    type: 'header2',
+  });
+
+  if (BillingAcct) {
+    newData.push({
+      value: BillingAcct,
+      type: 'body',
+      label: localization['customerNumber'],
+    });
+  }
+  // response?.PmtInfo?.ExtraBillingAcctKeys?.ExtraBillingAcctKey?.forEach(
+  // 	(item: any) => {
+  // 		newData.push({
+  // 			value: item.Value,
+  // 			type: 'extra_description'
+  // 		});
+  // 	}
+  // );
+
+  if (!!vatValue) {
+    newData.push({
+      value: `${vatValue}`,
+      label: localization['vatValue'],
+      type: 'body',
+    });
+  }
+  if (quantity) {
+    newData.push({
+      value: `${quantity}`,
+      label: localization['quantity'],
+      type: 'body',
+    });
+  }
+  newData.push({
+    value: `${amuont} EGP`,
+    label: localization['value'],
+    type: 'body',
+  });
+
+  if (fees?.toString() !== '0') {
+    newData.push({
+      value: `${fees?.toString()} EGP`,
+      label: localization['serviceCost'],
+      type: 'body',
+    });
+  }
+  newData.push({
+    value: moment().format('YYYY-MM-DD HH:mm'),
+    label: localization['time'],
+    type: 'body',
+  });
+
+  newData.push({
+    value: quantity
+      ? `${(Number(quantity) * (Number(amuont) + Number(fees)))?.toFixed(
+          2,
+        )} EGP`
+      : `${(Number(amuont) + Number(fees))?.toString()} EGP`,
+    label: localization['total'],
+    type: 'body_title',
+  });
+
+  if (billInfo?.DueDt) {
+    newData.push({
+      value: billInfo?.DueDt,
+      type: 'body',
+      label: localization['dueDate'],
+    });
+  }
+
+  if (billInfo?.IssueDt) {
+    newData.push({
+      value: billInfo?.IssueDt,
+      type: 'body',
+      label: localization['issueDate'],
+    });
+  }
+
+  if (billInfo?.ExtraBillInfo) {
+    newData.push({
+      value: billInfo?.ExtraBillInfo,
+      type: 'description',
+      label: '',
+    });
+  }
+
+  if (!!service?.meta?.note) {
+    newData.push({
+      value: service?.meta?.note,
+      type: 'description',
+    });
+  }
+
+  if (!!service?.meta?.explain) {
+    newData.push({
+      value: service?.meta?.explain,
+      type: 'description',
+    });
+  }
+
+  return newData;
+};

package/template/src/common/validations/errorValidations.ts

@@ -1,8 +1,9 @@
+import {localization} from '../localization/localization';
 import {unwrapResult} from '@reduxjs/toolkit';
 import {Alert} from 'react-native';
+import {IErrorResult, ErrorRepresentationType} from '../../../types';
 import Snackbar from 'react-native-snackbar';
-import {ErrorRepresentationType, IErrorResult} from '../../../types';
-import {localization} from '../localization/localization';
+import {NewColors} from '../../core/theme/colors';
 export function handlePromiseResult(
   promiseAction: Promise<any>,
   successMessage?: string,

package/template/src/components/PrinterExample.js

@@ -0,0 +1,226 @@
+import React, {useState, useEffect} from 'react';
+import {
+  View,
+  Text,
+  StyleSheet,
+  TouchableOpacity,
+  ScrollView,
+  Alert,
+} from 'react-native';
+import SunmiPrinter from '../utils/SunmiPrinter';
+
+const PrinterExample = () => {
+  const [isPrinterAvailable, setIsPrinterAvailable] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
+
+  useEffect(() => {
+    checkPrinterAvailability();
+  }, []);
+
+  const checkPrinterAvailability = async () => {
+    try {
+      const available = await SunmiPrinter.isPrinterAvailable();
+      setIsPrinterAvailable(available);
+    } catch (error) {
+      console.error('Error checking printer availability:', error);
+      setIsPrinterAvailable(false);
+    }
+  };
+
+  const handlePrintText = async () => {
+    if (!isPrinterAvailable) {
+      Alert.alert('Printer Error', 'Printer is not available');
+      return;
+    }
+
+    setIsLoading(true);
+    try {
+      await SunmiPrinter.printText(
+        'Hello, Sunmi Printer!\n',
+        SunmiPrinter.FONT_SIZE_LARGE,
+      );
+      await SunmiPrinter.feedPaper(3);
+      Alert.alert('Success', 'Text printed successfully');
+    } catch (error) {
+      console.error('Error printing text:', error);
+      Alert.alert('Print Error', error.message || 'Failed to print text');
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const handlePrintCenteredText = async () => {
+    if (!isPrinterAvailable) {
+      Alert.alert('Printer Error', 'Printer is not available');
+      return;
+    }
+
+    setIsLoading(true);
+    try {
+      await SunmiPrinter.printTextWithAlignment(
+        'Centered Text Example\n',
+        SunmiPrinter.FONT_SIZE_LARGE,
+        SunmiPrinter.ALIGN_CENTER,
+      );
+      await SunmiPrinter.feedPaper(3);
+      Alert.alert('Success', 'Centered text printed successfully');
+    } catch (error) {
+      console.error('Error printing centered text:', error);
+      Alert.alert(
+        'Print Error',
+        error.message || 'Failed to print centered text',
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const handlePrintDivider = async () => {
+    if (!isPrinterAvailable) {
+      Alert.alert('Printer Error', 'Printer is not available');
+      return;
+    }
+
+    setIsLoading(true);
+    try {
+      await SunmiPrinter.printDivider();
+      await SunmiPrinter.feedPaper(3);
+      Alert.alert('Success', 'Divider printed successfully');
+    } catch (error) {
+      console.error('Error printing divider:', error);
+      Alert.alert('Print Error', error.message || 'Failed to print divider');
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const handlePrintSampleReceipt = async () => {
+    if (!isPrinterAvailable) {
+      Alert.alert('Printer Error', 'Printer is not available');
+      return;
+    }
+
+    setIsLoading(true);
+    try {
+      await SunmiPrinter.printSampleReceipt();
+      Alert.alert('Success', 'Sample receipt printed successfully');
+    } catch (error) {
+      console.error('Error printing sample receipt:', error);
+      Alert.alert(
+        'Print Error',
+        error.message || 'Failed to print sample receipt',
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <ScrollView style={styles.container}>
+      <Text style={styles.title}>Sunmi Printer Example</Text>
+
+      <View style={styles.statusContainer}>
+        <Text style={styles.statusLabel}>Printer Status:</Text>
+        <Text
+          style={[
+            styles.statusValue,
+            {color: isPrinterAvailable ? 'green' : 'red'},
+          ]}>
+          {isPrinterAvailable ? 'Available' : 'Not Available'}
+        </Text>
+      </View>
+
+      <TouchableOpacity
+        style={[styles.button, isLoading && styles.buttonDisabled]}
+        onPress={handlePrintText}
+        disabled={isLoading}>
+        <Text style={styles.buttonText}>Print Text</Text>
+      </TouchableOpacity>
+
+      <TouchableOpacity
+        style={[styles.button, isLoading && styles.buttonDisabled]}
+        onPress={handlePrintCenteredText}
+        disabled={isLoading}>
+        <Text style={styles.buttonText}>Print Centered Text</Text>
+      </TouchableOpacity>
+
+      <TouchableOpacity
+        style={[styles.button, isLoading && styles.buttonDisabled]}
+        onPress={handlePrintDivider}
+        disabled={isLoading}>
+        <Text style={styles.buttonText}>Print Divider</Text>
+      </TouchableOpacity>
+
+      <TouchableOpacity
+        style={[styles.button, isLoading && styles.buttonDisabled]}
+        onPress={handlePrintSampleReceipt}
+        disabled={isLoading}>
+        <Text style={styles.buttonText}>Print Sample Receipt</Text>
+      </TouchableOpacity>
+
+      <TouchableOpacity
+        style={[
+          styles.button,
+          styles.refreshButton,
+          isLoading && styles.buttonDisabled,
+        ]}
+        onPress={checkPrinterAvailability}
+        disabled={isLoading}>
+        <Text style={styles.buttonText}>Refresh Printer Status</Text>
+      </TouchableOpacity>
+    </ScrollView>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    padding: 16,
+    backgroundColor: '#f5f5f5',
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    marginBottom: 24,
+    textAlign: 'center',
+  },
+  statusContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 24,
+    padding: 16,
+    backgroundColor: '#fff',
+    borderRadius: 8,
+    elevation: 2,
+  },
+  statusLabel: {
+    fontSize: 16,
+    fontWeight: 'bold',
+    marginRight: 8,
+  },
+  statusValue: {
+    fontSize: 16,
+    fontWeight: 'bold',
+  },
+  button: {
+    backgroundColor: '#2196F3',
+    padding: 16,
+    borderRadius: 8,
+    marginBottom: 16,
+    alignItems: 'center',
+    elevation: 2,
+  },
+  buttonDisabled: {
+    backgroundColor: '#cccccc',
+  },
+  buttonText: {
+    color: '#fff',
+    fontSize: 16,
+    fontWeight: 'bold',
+  },
+  refreshButton: {
+    backgroundColor: '#4CAF50',
+  },
+});
+
+export default PrinterExample;

package/template/src/core/api/serverHeaders.ts

@@ -1,6 +1,10 @@
 import axios, {AxiosDefaults} from 'axios';
+import DeviceInfo from 'react-native-device-info';
+import {fetch} from 'react-native-ssl-pinning';
 
 export const defaultHeaders: HeadersInit_ = {
+  'app-version': DeviceInfo.getVersion(),
+  'serial-number': DeviceInfo.getSerialNumberSync(),
   Connection: 'keep-alive',
   'Content-Type': 'application/json',
 };
@@ -10,7 +14,7 @@ declare type MethodData = {
   config?: any;
 };
 
-const baseURL = '';
+const baseURL = 'https://sofapi.neo-dg.app/api/v1/mobile/';
 
 const instance = axios.create({
   baseURL: baseURL,
@@ -19,6 +23,63 @@ const instance = axios.create({
   },
 });
 
+export async function configureSecureRequest() {
+  // Only apply SSL pinning in production
+  if (baseURL.includes('neopayplus')) {
+    try {
+      instance.defaults.adapter = (config: any) => {
+        const url = `${config.baseURL}${config.url}`;
+        const fetchOptions: any = {
+          method: config.method?.toUpperCase() || 'GET',
+          timeoutInterval: 0,
+          headers: {
+            ...config.headers,
+            Accept: 'application/json',
+            'Content-Type': 'application/json',
+          },
+          // Don't double stringify the data
+          body: config.data ? config.data : undefined,
+          sslPinning: {
+            certs: ['STAR.neopayplus.com'],
+            allowInvalidCertificates: false,
+            validatesDomainName: true,
+          },
+        };
+
+        if (fetchOptions.method === 'GET' || fetchOptions.method === 'HEAD') {
+          delete fetchOptions.body;
+        }
+
+        return fetch(url, fetchOptions)
+          .then(async response => {
+            const data = await response.json();
+            return {
+              data,
+              status: response.status,
+              statusText: response.statusText,
+              headers: response.headers,
+              config,
+              request: {},
+            };
+          })
+          .catch(error => {
+            console.error('error: ', error);
+            if (error === 'timeout') {
+              throw new Error(error);
+            } else if (JSON.parse(error?.bodyString)?.error) {
+              throw new Error(JSON.parse(error?.bodyString)?.error);
+            } else if (JSON.parse(error?.bodyString)?.message) {
+              throw new Error(JSON.parse(error?.bodyString)?.message);
+            }
+          });
+      };
+    } catch (error) {
+      console.info('error: ', error);
+      throw error;
+    }
+  }
+}
+
 // Export HTTP methods using the configured instance
 export const post = ({url, data, config}: MethodData) =>
   instance.post(url, data, config);

package/template/src/core/store/Categories/categoryActions.ts

@@ -0,0 +1,33 @@
+import {createAsyncThunk} from '@reduxjs/toolkit';
+import {handleFetchJsonResponse} from '../../api/responseHandlers';
+import {post} from '../../api/serverHeaders';
+import {RootState} from '../rootReducer';
+import {extractServerError} from '../../api/errorHandler';
+
+export const getCategories = createAsyncThunk(
+  'categories/list',
+  async (
+    {data: {limit}}: {data: {limit?: number}},
+    {rejectWithValue, getState, dispatch}: any,
+  ) => {
+    try {
+      const token = (getState() as RootState).user.accessToken;
+
+      const response = await post({
+        url: 'serviceMangement/Category/get_categories',
+        data: {limit},
+        config: {
+          headers: {
+            Authorization: `${token}`,
+          },
+        },
+      });
+
+      return handleFetchJsonResponse(response);
+    } catch (e: any) {
+      // Extract the server error from the Axios error
+      const serverError = extractServerError(e);
+      return rejectWithValue(serverError);
+    }
+  },
+);

package/template/src/core/store/Categories/categorySlice.ts

@@ -0,0 +1,75 @@
+import {createSlice} from '@reduxjs/toolkit';
+import {newState} from '../../../common/utils/newState';
+import {handleErrorResponse} from '../../api/responseHandlers';
+import {getCategories} from './categoryActions';
+import {
+  CategoriesInitialState,
+  CategoriesState,
+  Category,
+  CategoryPayload,
+} from './categoryState';
+import {LoadState} from '../../../../types';
+
+function getCategoriesHandler(
+  state: CategoriesState,
+  payload: {payload: CategoryPayload},
+) {
+  return newState(state, {
+    categories: payload.payload.categories,
+    settings: payload.payload.settings,
+    loadState: LoadState.allIsLoaded,
+  });
+}
+function getCategoriesLoadingHandler(state: CategoriesState) {
+  return newState(state, {
+    loadState: LoadState.loadingMore,
+  });
+}
+
+function getCategoriesErrorHandler(
+  state: CategoriesState,
+  payload: {payload: {message: string}},
+) {
+  handleErrorResponse(payload.payload.message || 'Categories fetch failed');
+  return newState(state, {
+    loadState: LoadState.error,
+  });
+}
+
+function categoriesLogoutHandler(state: CategoriesState) {
+  return newState(state, CategoriesInitialState);
+}
+
+function selectedCategoryHandler(
+  state: CategoriesState,
+  payload: {payload: Category},
+) {
+  return newState(state, {
+    selectedCategory: payload.payload,
+  });
+}
+
+function clearSelectedCategoryHandler(state: CategoriesState) {
+  return newState(state, {
+    selectedCategory: CategoriesInitialState.selectedCategory,
+  });
+}
+
+export const {reducer: CategoriesReducer, actions} = createSlice({
+  name: 'categories',
+  initialState: CategoriesInitialState,
+  reducers: {
+    setCategoriesLogout: categoriesLogoutHandler,
+    setSelectedCategory: selectedCategoryHandler,
+    clearSelectedCategory: clearSelectedCategoryHandler,
+  },
+  extraReducers: builder => {
+    builder
+      .addCase(getCategories.fulfilled, getCategoriesHandler)
+      .addCase(getCategories.rejected, getCategoriesErrorHandler)
+      .addCase(getCategories.pending, getCategoriesLoadingHandler);
+  },
+});
+
+export const {setCategoriesLogout, setSelectedCategory, clearSelectedCategory} =
+  actions;

package/template/src/core/store/Categories/categoryState.ts

@@ -0,0 +1,41 @@
+import {LoadState} from '../../../../types';
+
+export type PosSettings = {
+  id: number;
+  name: string;
+  function_name: string;
+  is_active: boolean;
+  createdAt: string;
+  updatedAt: string;
+};
+
+export interface CategoriesState {
+  categories: Category[];
+  loadState: LoadState;
+  settings: PosSettings[];
+  selectedCategory: Category | null;
+}
+
+export interface Category {
+  createdAt?: string | null;
+  externalId?: null;
+  id: number;
+  img_url: string;
+  name: string;
+  name_en?: string | null;
+  parent_id: number;
+  priority: number;
+  updatedAt: string;
+}
+
+export interface CategoryPayload {
+  categories: Category[];
+  settings: PosSettings[];
+}
+
+export const CategoriesInitialState: CategoriesState = {
+  categories: [],
+  loadState: LoadState.idle,
+  settings: [],
+  selectedCategory: null,
+};