Feature/26-storing-session-forms-sqlite

app/App.js

@@ -4,15 +4,56 @@ import NetInfo from '@react-native-community/netinfo';
 
 import Navigation from './src/navigation';
 import { conn, query, tables } from './src/database';
-import { UIState } from './src/store';
+import { UIState, AuthState, UserState } from './src/store';
+import { crudSessions, crudUsers } from './src/database/crud';
 
 const db = conn.init;
 
 const App = () => {
+  const handleCheckSession = () => {
+    crudSessions.selectLastSession().then((session) => {
+      if (!session) {
+        return session;
+      }
+      console.info('Session =>', session);
+      // check users exist
+      crudUsers
+        .selectUsers({ count: false })
+        .then((users) => {
+          console.info('Users =>', users);
+          let page = null;
+          if (session && users?.length) {
+            page = 'Home';
+          }
+          if (session && !users?.length) {
+            page = 'AddUser';
+          }
+          return { user: users?.[users?.length - 1], page };
+        })
+        .then(({ user, page }) => {
+          UserState.update((s) => {
+            s.id = user.id;
+            s.name = user.name;
+            s.password = user.password;
+          });
+          AuthState.update((s) => {
+            s.token = session.token;
+            s.authenticationCode = session.passcode;
+          });
+          UIState.update((s) => {
+            s.currentPage = page ? page : s.currentPage;
+          });
+        });
+    });
+  };
+
   React.useEffect(() => {
-    const queries = tables.map((t) => query.initialQuery(t.name, t.fields)).join(' ');
-    conn.tx(db, queries).then((res) => {
-      console.log('results', res);
+    const queries = tables.map((t) => {
+      const queryString = query.initialQuery(t.name, t.fields);
+      return conn.tx(db, queryString);
+    });
+    Promise.all(queries).then(() => {
+      handleCheckSession();
     });
   }, []);
 
@@ -27,6 +68,7 @@ const App = () => {
       unsubscribe();
     };
   }, []);
+
   return (
     <SafeAreaProvider>
       <Navigation testID="navigation-element" />

app/__mocks__/expo-crypto.js

@@ -0,0 +1,14 @@
+const mockDigestStringAsync = jest.fn();
+
+export const Crypto = {
+  CryptoDigestAlgorithm: {
+    SHA1: 'SHA1',
+  },
+  digestStringAsync: mockDigestStringAsync,
+};
+
+export const digestStringAsync = (algorithm, data) => {
+  return Promise.resolve(`Mocked${data}-${algorithm}`);
+};
+
+export const CryptoDigestAlgorithm = Crypto.CryptoDigestAlgorithm;

app/__tests__/pages/AuthForm.test.js

@@ -1,10 +1,36 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
+import { render, fireEvent, waitFor } from '@testing-library/react-native';
 import { AuthFormPage } from '../../src/pages';
 
 describe('AuthFormPage', () => {
   test('renders correctly', () => {
     const tree = renderer.create(<AuthFormPage />).toJSON();
     expect(tree).toMatchSnapshot();
   });
+
+  test('auth page field render correctly', () => {
+    const { getByTestId } = render(<AuthFormPage />);
+    const inputField = getByTestId('auth-password-field');
+    const toggleEye = getByTestId('auth-toggle-eye-button');
+    const checkbox = getByTestId('auth-checkbox-field');
+    const loginBtn = getByTestId('auth-login-button');
+
+    expect(inputField).toBeDefined();
+    expect(toggleEye).toBeDefined();
+    expect(checkbox).toBeDefined();
+    expect(loginBtn).toBeDefined();
+  });
+
+  test('enables the login button when the form is filled correctly', () => {
+    const { getByTestId } = render(<AuthFormPage />);
+    const inputField = getByTestId('auth-password-field');
+    const checkbox = getByTestId('auth-checkbox-field');
+    const loginButton = getByTestId('auth-login-button');
+
+    expect(loginButton.props.accessibilityState.disabled).toBe(true);
+    fireEvent.changeText(inputField, '123456');
+    fireEvent.press(checkbox);
+    expect(loginButton.props.accessibilityState.disabled).toBe(false);
+  });
 });

app/__tests__/pages/__snapshots__/AuthForm.test.js.snap

@@ -106,6 +106,7 @@ exports[`AuthFormPage renders correctly 1`] = `
         <TextInput
           autoFocus={true}
           editable={true}
+          onChangeText={[Function]}
           placeholder="Enumerator ID"
           placeholderTextColor="#86939e"
           secureTextEntry={true}
@@ -119,6 +120,7 @@ exports[`AuthFormPage renders correctly 1`] = `
           }
           testID="auth-password-field"
           underlineColorAndroid="transparent"
+          value={null}
         />
         <View
           style={
@@ -180,7 +182,7 @@ exports[`AuthFormPage renders correctly 1`] = `
                   "opacity": 1,
                 }
               }
-              testID="auth-toggle-eye-buton"
+              testID="auth-toggle-eye-button"
             >
               <View
                 style={
@@ -304,7 +306,7 @@ exports[`AuthFormPage renders correctly 1`] = `
         {
           "busy": false,
           "checked": undefined,
-          "disabled": false,
+          "disabled": true,
           "expanded": undefined,
           "selected": undefined,
         }
@@ -338,7 +340,7 @@ exports[`AuthFormPage renders correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#2089dc",
+            "backgroundColor": "hsl(208, 8%, 90%)",
             "borderColor": "#2089dc",
             "borderRadius": 2,
             "borderWidth": 0,
@@ -352,7 +354,7 @@ exports[`AuthFormPage renders correctly 1`] = `
         <Text
           style={
             {
-              "color": "white",
+              "color": "hsl(208, 8%, 63%)",
               "fontSize": 18,
               "paddingVertical": 1,
               "textAlign": "center",
@@ -364,5 +366,17 @@ exports[`AuthFormPage renders correctly 1`] = `
       </View>
     </View>
   </View>
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    style={
+      {
+        "flex": 1,
+      }
+    }
+    testID="Internal__Overlay"
+    transparent={true}
+    visible={false}
+  />
 </View>
 `;

app/package.json

@@ -12,19 +12,20 @@
     "prettier-write": "prettier --write ."
   },
   "dependencies": {
-    "@react-native-community/netinfo": "^9.3.10",
     "@react-native-community/datetimepicker": "6.7.3",
+    "@react-native-community/netinfo": "^9.3.10",
     "@react-navigation/native": "^6.1.6",
     "@react-navigation/native-stack": "^6.9.12",
     "@rneui/base": "^4.0.0-rc.7",
     "@rneui/themed": "^4.0.0-rc.7",
+    "axios": "^1.4.0",
     "expo": "~48.0.18",
     "expo-crypto": "^12.2.2",
     "expo-image-picker": "~14.1.1",
     "expo-sqlite": "^11.1.1",
     "expo-status-bar": "~1.4.4",
-    "pullstate": "^1.25.0",
     "formik": "^2.4.2",
+    "pullstate": "^1.25.0",
     "react": "18.2.0",
     "react-native": "0.71.8",
     "react-native-element-dropdown": "^2.9.0",

app/src/database/crud/__tests__/crud-forms.test.js

@@ -0,0 +1,51 @@
+import crudForms from '../crud-forms';
+jest.mock('expo-sqlite');
+
+describe('crudForms function', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('addFormsIfNotExist', () => {
+    it('should insert the form if it does not exist or has a different version', async () => {
+      const formId = 1;
+      const version = 1;
+      const formJSON = { id: 1, version: 1, name: 'Form 1' };
+      const result = await crudForms.addFormsIfNotExist({ id: formId, version, formJSON });
+      expect(result).toEqual({ rowsAffected: 1 });
+    });
+
+    it('should update the form if it exists and has the same version', async () => {
+      const formId = 1;
+      const version = 1;
+      const formJSON = { id: 1, version: 1, name: 'Form 1' };
+      const result = await crudForms.addFormsIfNotExist({ id: formId, version, formJSON });
+      expect(result).toEqual({ rowsAffected: 1 });
+    });
+  });
+
+  describe('selectFormByIdAndVersion', () => {
+    it('should return false if the form does not exist', async () => {
+      const result = await crudForms.selectFormByIdAndVersion({ id: 1, version: '1.0.0' });
+      expect(result).toBe(false);
+    });
+
+    it('should return the form if it exists', async () => {
+      // Mock the result set for select
+      const formData = [
+        {
+          id: 1,
+          formId: 123,
+          name: 'Form Test',
+          latest: 1,
+          version: '1.0.0',
+          json: { id: 1, version: 1, name: 'Form 1' },
+        },
+      ];
+      const mockSelectSql = jest.fn(() => formData);
+      crudForms.selectFormByIdAndVersion = mockSelectSql;
+      const result = await crudForms.selectFormByIdAndVersion({ id: 1, version: '1.0.0' });
+      expect(result).toEqual(formData);
+    });
+  });
+});

app/src/database/crud/__tests__/crud-sessions.test.js

@@ -0,0 +1,40 @@
+import crudSessions from '../crud-sessions';
+jest.mock('expo-sqlite');
+
+describe('crudSessions function', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('addSession', () => {
+    it('should insert the session', async () => {
+      const result = await crudSessions.addSession({ token: 'Bearer abcefg', passcode: '123456' });
+      expect(result).toEqual({ rowsAffected: 1 });
+    });
+  });
+
+  describe('selectLastSession', () => {
+    it('should return false if session does not exist', async () => {
+      const result = await crudSessions.selectLastSession();
+      expect(result).toBe(false);
+    });
+
+    it('should return last session', async () => {
+      // Mock the result set for select
+      const sessions = [
+        {
+          token: 'Bearer 1',
+          passcode: '123',
+        },
+        {
+          token: 'Bearer 2',
+          passcode: '321',
+        },
+      ];
+      const mockSelectSql = jest.fn(() => sessions[1]);
+      crudSessions.selectLastSession = mockSelectSql;
+      const result = await crudSessions.selectLastSession();
+      expect(result).toEqual(sessions[1]);
+    });
+  });
+});