diff --git a/docs/integration/clock-in.md b/docs/integration/clock-in.md
new file mode 100644
index 0000000..19c3798
--- /dev/null
+++ b/docs/integration/clock-in.md
@@ -0,0 +1,157 @@
+---
+sidebar_position: 1
+---
+
+# SQL Clock In
+
+Time Attendance QR Code related guidelines
+
+:::info
+To setup Time Attendance QR Code, may refer to [Time Attendance Payroll Setup](hrms/e-tms/payroll-setup)
+:::
+
+## Login
+
+### Login
+
+:::info[IMPORTANT]
+Only **Managers** are able to log into this app
+:::
+
+**Step 1:** Enter email | Next
+
+ 
+
+**Step 2:** Enter OTP sent to your email | Login
+
+ 
+
+**Step 3:** Select a company and branch
+
+ 
+
+### Try Demo Account
+
+User may try out the app as manager
+
+**Step 1:** Start Exploring
+
+ 
+
+**Step 2:** Testing Company (Demo Data) | Select a Branch
+
+ 
+
+ - **Logout icon (top right):** Logout from SQL Clock In app
+
+## Permission
+
+### Camera
+
+**From SQL Clock In app**
+
+**Step:** Select ***'While using the app'***
+
+ 
+
+**From Device Settings**
+
+**Step:** App Info | App permissions | Camera | Select ***'Allow only while using the app'***
+
+ 
+
+### Nearby Devices (Bluetooth)
+
+**From SQL Clock In app**
+
+:::info
+For **Android 11 and below**, may skip to Step 2
+:::
+
+**Step 1:** Select ***'Allow'***
+
+ 
+
+**Step 2:** Turn on Bluetooth Service
+
+ 
+
+**From Device Settings**
+
+:::info
+Only for **Android 12 and above**
+:::
+
+**Step:** App Info | App permissions | Nearby devices | Select ***'Allow'***
+
+ 
+
+### Location
+
+**From SQL Clock In App**
+
+:::info
+For **Android 12 and above**, may skip to Step 2
+:::
+
+**Step 1:** Select ***'While using the app'***
+
+ 
+
+**Step 2:** Turn on Location Service
+
+ 
+
+**From Device Settings**
+
+:::info
+Only for **Android 11 and below**
+:::
+
+**Step:** App Info | Permissions | Location | Select ***'Allow only while using the app'***
+
+ 
+
+## Dashboard
+
+ 
+
+ - ***'Clock In / Out'* button:** Navigate to [QR Scanner](#qr-scanner)
+ - **Gear icon (top right):** Navigate to [Settings](#settings)
+ - **Logout icon (top right):** Logout from SQL Clock In app
+
+## QR Scanner
+
+For employees to scan the QR Code generated from SQL HRMS app to clock in / out
+
+ 
+
+ - The scanner will sleep after a duration of inactivity
+ - The scanner will wake up when there's motion detected
+ - The duration of inactivity and motion detection sensitivity can be adjusted in the [settings](#settings)
+ - ***Error icon*** at the top right corner will only appear when there are issues
+ - Tap on the icon to view what are the issues (only those with issues will appear)
+
+| **Issue** | **Explanation** |
+| :--------- | :-------------- |
+| Wifi is not detected | Make sure that the scanner is connected to wifi |
+| Bluetooth is not found | Make sure that the scanner's Bluetooth service is turned on and Nearby devices permission is allowed
Refer [bluetooth service and nearby devices permission](hrms/permission/#nearby-devices--bluetooth) |
+| Location is not detected | Make sure that the scanner's Location service is turned on and permission is allowed
Refer [location service and permission](#location) |
+
+| **Dialog Message** | **Explanation** |
+| :----------------- | :-------------- |
+|  | Employee scanned an invalid QR Code that is not generated from SQL HRMS app |
+|  | Employee scanned an expired QR Code |
+|  | Employee generated the QR Code under a different company and is not allowed to clock in / out |
+|  | Employee is under a different branch and is not allowed to clock in / out |
+|  | 1. Employee's Bluetooth service is not turned on
2. Employee's required *Nearby Devices* permission is not allowed
3. Employee is not near the scanner
3. Scanner's Bluetooth service or Location service is not turned on
4. Scanner's required *Nearby Devices* or *Location* permission is not allowed
For SQL HRMS, refer [bluetooth service and nearby devices permission](hrms/permission/#nearby-devices--bluetooth)
For SQL Clock In, refer [location service and permission](#location) and [bluetooth service and nearby devices permission](#nearby-devices-bluetooth) |
+|  | Employee has successfully clocked in |
+|  | Employee has successfully clocked out |
+
+## Settings
+
+ 
+
+ - **Camera View:** User can switch the default direction of the QR Scanner camera
+ - **Screen Off:** User can adjust how long (1 to 30 mins) of inactivity is allowed before the scanner sleeps
+ - **Screen Wake Sensitivity:** User can adjust how sensitive they want their scanner to wake up from motion detection after scanner is asleep
\ No newline at end of file
diff --git a/docs/integration/hrms/_category_.json b/docs/integration/hrms/_category_.json
index 83c8924..cf06576 100644
--- a/docs/integration/hrms/_category_.json
+++ b/docs/integration/hrms/_category_.json
@@ -1,6 +1,6 @@
{
"label": "SQL HRMS",
- "position": 1,
+ "position": 2,
"link": {
"type": "generated-index",
"description": "Human Resource Management System (HRMS) related topics"
diff --git a/docs/integration/hrms/e-tms/app-usage.md b/docs/integration/hrms/e-tms/app-usage.md
index b858604..e642810 100644
--- a/docs/integration/hrms/e-tms/app-usage.md
+++ b/docs/integration/hrms/e-tms/app-usage.md
@@ -13,23 +13,26 @@ Enable **Autostart** for SQL HRMS to ensure E TMS features work accordingly (ref

- **Session Card:** User's work session shift time
+ - Icon on the top right corner (green box) indicates the clock method (by GPS or QR) of the day. If there is no icon displayed, it means that user is not required to clock for that day
- It shows user's first Clock In and last Clock Out of the day with an estimated calculation of late in and early out
- User can tap on the card to direct to User's Attendance Log
- User can tap on the ***'Clock In' button*** to direct to Clock In / Clock Out page
- - If no work session is assigned, the button will be disabled
+ - If no work session is assigned or no clock method is selected, the button will be disabled
- **Upcoming Holiday:** User's upcoming public holidays
## Clock In / Clock Out
+### By GPS
+
| **Button** | **Explanation** |
| :--------- | :-------------- |
|  | SQL HRMS app's Location service is unable to start. This may due to the following reasons:
1. User's location service is not enabled
2. The required location permission is not allowed
Refer [Location Service and Permission](../permission.md#location) |
|  | SQL HRMS app is trying to get user's current location |
|  | User is not within work location. However, if user is really within their work location, SQL HRMS app will continuously try to get a more accurate position so that user will be able to Clock In / Clock Out |
|  | User's location is mocked and is not allowed to Clock In / Out |
-|  | User is within work location and is allowed to Clock In |
-|  | User is within work location and is allowed to Clock Out |
+|  | User is within work location and is allowed to Clock In |
+|  | User is within work location and is allowed to Clock Out |
**Clock In**
@@ -66,7 +69,34 @@ If user forget to clock out, the app will reset the time tracking after 10 hours
- An earn replacement leave application will be posted when employee clocked out
- When employee tap the ***'Clock Out' button***, a **'Claim As Leave'** dialog will be prompt that allows the employee to pick the leave type that they want to claim
- 
+ 
+
+### By QR
+
+| **Button** | **Explanation** |
+| :--------- | :-------------- |
+|  | SQL HRMS app's Bluetooth service is unable to start. This may due to the following reasons:
1. User's Bluetooth service is not enabled
2. The required nearby devices permission is not allowed
Refer [Bluetooth Service and Nearby Devices Permission](../permission#nearby-devices--bluetooth) |
+|  | User is allowed to Clock In |
+|  | User is allowed to Clock Out |
+
+**Clock In**
+
+ 
+
+- **'Attachments'** field will not be available
+- Proceed to Clock In will generate a QR Code that will be scanned by SQL Clock In app
+ - User can adjust the brightness of the screen with the slider
+ - The QR Code will only be valid for 20s before user will need to regenerate a new QR Code
+
+**Clock Out**
+
+ 
+
+- If ***'Claim OT' switch*** is turned on, it will go through similar OT validations as *By GPS* before QR Code is generated
+
+:::warning
+Screenshotting the QR Code is not allowed!
+:::
### Work Location
@@ -74,8 +104,13 @@ If user forget to clock out, the app will reset the time tracking after 10 hours

+- **Purple Location icon:** Employee's current location
- **Green Check icon:** Location that the employee is currently in
+:::info
+Multiple work locations with the same coordinate will be considered as one
+:::
+
## Work Session Calendar
### My Work Session
@@ -86,7 +121,8 @@ User can view his own work session in calendar view
- **Red font with purple box:** Public Holiday
- **Purple box:** Rest Day
-- **Location icon:** Direct to Work Location page to view locations where the user is allowed to clock in / clock out on that day (refer [Work Location](#work-location))
+- **Icon (bottom right corner):** Clock Method
+- **Whole card:** Direct to [Work Location](#work-location) page to view locations where the user is allowed to clock in / clock out on that day
### Team Work Session
diff --git a/docs/integration/hrms/e-tms/payroll-setup.md b/docs/integration/hrms/e-tms/payroll-setup.md
index 4778727..9964d61 100644
--- a/docs/integration/hrms/e-tms/payroll-setup.md
+++ b/docs/integration/hrms/e-tms/payroll-setup.md
@@ -66,12 +66,24 @@ Option 2: Click on ***'P' button*** | Select date
**Step 3:** Enter Break Time
- May add up to 3 break times
-**Step 4:** Select Rules
-- ***'Clock In / Clock Out' checkbox:*** Requires to clock in / out in SQL HRMS app
-- ***'GPS Monitoring' checkbox:*** Post status update if employee left work location
+**Step 4:** Select a Clock Method
+- ***'GPS' checkbox:*** Clock in / out using employee's location in SQL HRMS app
+- ***'QR' checkbox:*** Clock in / out using QR Code generated from SQL HRMS app and scan it on SQL Clock In app
+
+:::info
+1. Only one clock method can be selected. However, if none of the clock method is selected, then the clock in / out button in SQL HRMS app will be disabled and employee does not require to clock in / out.
+2. Clock Method on days without work session, public holiday and rest day is by default **GPS**.
+:::
+
+**Step 5:** Select Rules
+- ***'GPS Monitoring' checkbox:*** Post status update if employee left work location
- ***'Site Photo' checkbox:*** Requires to take photo before clock in / out (User cannot upload picture from album)
-**Step 5:** Save
+:::info
+***'GPS Monitoring'*** and ***'Site Photo'*** will be disabled if ***'QR'*** or ***no clock method*** is selected
+:::
+
+**Step 6:** Save
**Optional**
- User may select ***'Leave Rules'*** if applicable
diff --git a/docs/integration/hrms/permission.md b/docs/integration/hrms/permission.md
index bf2d6d3..c06d0b7 100644
--- a/docs/integration/hrms/permission.md
+++ b/docs/integration/hrms/permission.md
@@ -146,4 +146,54 @@ If you have disabled this feature previously, you can skip all of the following
**Step 2:** Select ***'Allow Full Access'***
- 
\ No newline at end of file
+ 
+
+## Nearby Devices / Bluetooth
+
+### Android
+
+**From SQL HRMS app**
+
+:::info
+For **Android 11 and below**, may skip to Step 2
+:::
+
+**Step 1:** Select ***'Allow'***
+
+ 
+
+**Step 2:** Turn on ***Bluetooth service***
+
+ 
+
+**From Device Settings**
+
+:::info
+Only for **Android 12 and above**
+:::
+
+**Step:** App Info | App permissions | Nearby devices | Select ***'Allow'***
+
+ 
+
+### iOS
+
+**From SQL HRMS app**
+
+**Step 1:** Select ***'Allow'***
+
+ 
+
+**Step 2:** Select ***'Settings'*** | Toggle ***'Bluetooth'*** on | Return to SQL HRMS
+
+ 
+
+**From Device Settings**
+
+**Step 1:** Settings | Search for ***'SQL HRMS'*** | Toggle ***'Bluetooth'*** on
+
+ 
+
+**Step 2:** Settings | Bluetooth | Toggle ***'Bluetooth'*** on
+
+ 
\ No newline at end of file
diff --git a/static/img/integration/clock-in/dashboard.png b/static/img/integration/clock-in/dashboard.png
new file mode 100644
index 0000000..0095f65
Binary files /dev/null and b/static/img/integration/clock-in/dashboard.png differ
diff --git a/static/img/integration/clock-in/dialog1.png b/static/img/integration/clock-in/dialog1.png
new file mode 100644
index 0000000..850485f
Binary files /dev/null and b/static/img/integration/clock-in/dialog1.png differ
diff --git a/static/img/integration/clock-in/dialog2.png b/static/img/integration/clock-in/dialog2.png
new file mode 100644
index 0000000..6a8f908
Binary files /dev/null and b/static/img/integration/clock-in/dialog2.png differ
diff --git a/static/img/integration/clock-in/dialog3.png b/static/img/integration/clock-in/dialog3.png
new file mode 100644
index 0000000..b87b48a
Binary files /dev/null and b/static/img/integration/clock-in/dialog3.png differ
diff --git a/static/img/integration/clock-in/dialog4.png b/static/img/integration/clock-in/dialog4.png
new file mode 100644
index 0000000..4db93e3
Binary files /dev/null and b/static/img/integration/clock-in/dialog4.png differ
diff --git a/static/img/integration/clock-in/dialog5.png b/static/img/integration/clock-in/dialog5.png
new file mode 100644
index 0000000..63d5134
Binary files /dev/null and b/static/img/integration/clock-in/dialog5.png differ
diff --git a/static/img/integration/clock-in/dialog6.png b/static/img/integration/clock-in/dialog6.png
new file mode 100644
index 0000000..a8e98c9
Binary files /dev/null and b/static/img/integration/clock-in/dialog6.png differ
diff --git a/static/img/integration/clock-in/dialog7.png b/static/img/integration/clock-in/dialog7.png
new file mode 100644
index 0000000..23eb301
Binary files /dev/null and b/static/img/integration/clock-in/dialog7.png differ
diff --git a/static/img/integration/clock-in/login1.png b/static/img/integration/clock-in/login1.png
new file mode 100644
index 0000000..6113474
Binary files /dev/null and b/static/img/integration/clock-in/login1.png differ
diff --git a/static/img/integration/clock-in/login2.png b/static/img/integration/clock-in/login2.png
new file mode 100644
index 0000000..1e0d7ca
Binary files /dev/null and b/static/img/integration/clock-in/login2.png differ
diff --git a/static/img/integration/clock-in/login3.png b/static/img/integration/clock-in/login3.png
new file mode 100644
index 0000000..a3fbd0f
Binary files /dev/null and b/static/img/integration/clock-in/login3.png differ
diff --git a/static/img/integration/clock-in/permission-bluetooth1.png b/static/img/integration/clock-in/permission-bluetooth1.png
new file mode 100644
index 0000000..0005bfd
Binary files /dev/null and b/static/img/integration/clock-in/permission-bluetooth1.png differ
diff --git a/static/img/integration/clock-in/permission-bluetooth2.png b/static/img/integration/clock-in/permission-bluetooth2.png
new file mode 100644
index 0000000..a831a46
Binary files /dev/null and b/static/img/integration/clock-in/permission-bluetooth2.png differ
diff --git a/static/img/integration/clock-in/permission-bluetooth3.png b/static/img/integration/clock-in/permission-bluetooth3.png
new file mode 100644
index 0000000..f75dc52
Binary files /dev/null and b/static/img/integration/clock-in/permission-bluetooth3.png differ
diff --git a/static/img/integration/clock-in/permission-camera1.png b/static/img/integration/clock-in/permission-camera1.png
new file mode 100644
index 0000000..5c1fd94
Binary files /dev/null and b/static/img/integration/clock-in/permission-camera1.png differ
diff --git a/static/img/integration/clock-in/permission-camera2.png b/static/img/integration/clock-in/permission-camera2.png
new file mode 100644
index 0000000..d10e2df
Binary files /dev/null and b/static/img/integration/clock-in/permission-camera2.png differ
diff --git a/static/img/integration/clock-in/permission-location1.png b/static/img/integration/clock-in/permission-location1.png
new file mode 100644
index 0000000..723678e
Binary files /dev/null and b/static/img/integration/clock-in/permission-location1.png differ
diff --git a/static/img/integration/clock-in/permission-location2.png b/static/img/integration/clock-in/permission-location2.png
new file mode 100644
index 0000000..f5283fd
Binary files /dev/null and b/static/img/integration/clock-in/permission-location2.png differ
diff --git a/static/img/integration/clock-in/permission-location3.png b/static/img/integration/clock-in/permission-location3.png
new file mode 100644
index 0000000..ffd5312
Binary files /dev/null and b/static/img/integration/clock-in/permission-location3.png differ
diff --git a/static/img/integration/clock-in/qr-scanner.png b/static/img/integration/clock-in/qr-scanner.png
new file mode 100644
index 0000000..72ad20b
Binary files /dev/null and b/static/img/integration/clock-in/qr-scanner.png differ
diff --git a/static/img/integration/clock-in/settings.png b/static/img/integration/clock-in/settings.png
new file mode 100644
index 0000000..3709606
Binary files /dev/null and b/static/img/integration/clock-in/settings.png differ
diff --git a/static/img/integration/clock-in/try-live-demo1.png b/static/img/integration/clock-in/try-live-demo1.png
new file mode 100644
index 0000000..22d951f
Binary files /dev/null and b/static/img/integration/clock-in/try-live-demo1.png differ
diff --git a/static/img/integration/clock-in/try-live-demo2.png b/static/img/integration/clock-in/try-live-demo2.png
new file mode 100644
index 0000000..c288ac6
Binary files /dev/null and b/static/img/integration/clock-in/try-live-demo2.png differ
diff --git a/static/img/integration/hrms/autostart/autostart.png b/static/img/integration/hrms/autostart/autostart.png
index 866e381..ab873c8 100644
Binary files a/static/img/integration/hrms/autostart/autostart.png and b/static/img/integration/hrms/autostart/autostart.png differ
diff --git a/static/img/integration/hrms/e-tms/attendance-log-detail.png b/static/img/integration/hrms/e-tms/attendance-log-detail.png
index 53169cf..fb1266c 100644
Binary files a/static/img/integration/hrms/e-tms/attendance-log-detail.png and b/static/img/integration/hrms/e-tms/attendance-log-detail.png differ
diff --git a/static/img/integration/hrms/e-tms/clock-button7.png b/static/img/integration/hrms/e-tms/clock-button7.png
new file mode 100644
index 0000000..9abd733
Binary files /dev/null and b/static/img/integration/hrms/e-tms/clock-button7.png differ
diff --git a/static/img/integration/hrms/e-tms/clock-in3.png b/static/img/integration/hrms/e-tms/clock-in3.png
new file mode 100644
index 0000000..d0b3196
Binary files /dev/null and b/static/img/integration/hrms/e-tms/clock-in3.png differ
diff --git a/static/img/integration/hrms/e-tms/clock-out8.png b/static/img/integration/hrms/e-tms/clock-out8.png
new file mode 100644
index 0000000..9afd036
Binary files /dev/null and b/static/img/integration/hrms/e-tms/clock-out8.png differ
diff --git a/static/img/integration/hrms/e-tms/dashboard.png b/static/img/integration/hrms/e-tms/dashboard.png
index 47a23b6..579f02f 100644
Binary files a/static/img/integration/hrms/e-tms/dashboard.png and b/static/img/integration/hrms/e-tms/dashboard.png differ
diff --git a/static/img/integration/hrms/e-tms/maintain-work-session.png b/static/img/integration/hrms/e-tms/maintain-work-session.png
index 2650f6f..6a5f14b 100644
Binary files a/static/img/integration/hrms/e-tms/maintain-work-session.png and b/static/img/integration/hrms/e-tms/maintain-work-session.png differ
diff --git a/static/img/integration/hrms/e-tms/my-work-session.png b/static/img/integration/hrms/e-tms/my-work-session.png
index 4f32623..657c726 100644
Binary files a/static/img/integration/hrms/e-tms/my-work-session.png and b/static/img/integration/hrms/e-tms/my-work-session.png differ
diff --git a/static/img/integration/hrms/e-tms/team-work-session.png b/static/img/integration/hrms/e-tms/team-work-session.png
index a09ba9c..7a608c0 100644
Binary files a/static/img/integration/hrms/e-tms/team-work-session.png and b/static/img/integration/hrms/e-tms/team-work-session.png differ
diff --git a/static/img/integration/hrms/e-tms/work-location.png b/static/img/integration/hrms/e-tms/work-location.png
index 0315e7a..3cdfcbd 100644
Binary files a/static/img/integration/hrms/e-tms/work-location.png and b/static/img/integration/hrms/e-tms/work-location.png differ
diff --git a/static/img/integration/hrms/permission/android-bluetooth1.png b/static/img/integration/hrms/permission/android-bluetooth1.png
new file mode 100644
index 0000000..3d3a351
Binary files /dev/null and b/static/img/integration/hrms/permission/android-bluetooth1.png differ
diff --git a/static/img/integration/hrms/permission/android-bluetooth2.png b/static/img/integration/hrms/permission/android-bluetooth2.png
new file mode 100644
index 0000000..1e2330a
Binary files /dev/null and b/static/img/integration/hrms/permission/android-bluetooth2.png differ
diff --git a/static/img/integration/hrms/permission/android-bluetooth3.png b/static/img/integration/hrms/permission/android-bluetooth3.png
new file mode 100644
index 0000000..293278d
Binary files /dev/null and b/static/img/integration/hrms/permission/android-bluetooth3.png differ
diff --git a/static/img/integration/hrms/permission/ios-bluetooth1.png b/static/img/integration/hrms/permission/ios-bluetooth1.png
new file mode 100644
index 0000000..36b57ca
Binary files /dev/null and b/static/img/integration/hrms/permission/ios-bluetooth1.png differ
diff --git a/static/img/integration/hrms/permission/ios-bluetooth2.png b/static/img/integration/hrms/permission/ios-bluetooth2.png
new file mode 100644
index 0000000..3e55a52
Binary files /dev/null and b/static/img/integration/hrms/permission/ios-bluetooth2.png differ
diff --git a/static/img/integration/hrms/permission/ios-bluetooth3.png b/static/img/integration/hrms/permission/ios-bluetooth3.png
new file mode 100644
index 0000000..a7f05f7
Binary files /dev/null and b/static/img/integration/hrms/permission/ios-bluetooth3.png differ
diff --git a/static/img/integration/hrms/permission/ios-bluetooth4.png b/static/img/integration/hrms/permission/ios-bluetooth4.png
new file mode 100644
index 0000000..2833998
Binary files /dev/null and b/static/img/integration/hrms/permission/ios-bluetooth4.png differ