0% found this document useful (0 votes)
15 views

Destinee FinalProjectReport

Uploaded by

Lùn Bi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
15 views

Destinee FinalProjectReport

Uploaded by

Lùn Bi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 237

MINISTRY OF EDUCATION AND TRAINING

FPT UNIVERSITY
Capstone Project Document

Destinee – Connecting & building quality


conversation application.

Group GFA22SE34

Nguyen Trung Thinh – SE140344

Do Tuan Kiet – SE140777


Group Members
Le Tan Tai – SE141013

Le Duc Minh Thien – SE140995

Supervisor Hoang Xuan Hong

Capstone Project code FA22SE01

– Ho Chi Minh, October 2022 –


Table of Contents
Table of Contents 0

Acknowledgements 14

Definition and Acronyms 15

I. Project Introduction 16
1. Overview 16
1.1 Project Information 16
1.2 Project Team 16
1.2.1 Supervisor 16
1.2.2 Team Members 16
2. Product Background 16
3. Existing Systems 17
3.1 App 1: Tinder 17
3.2 App 2: Omegle 17
4. Business Opportunity 17
5. Software Product Vision 18
6. Project Scope & Limitations 18
6.1 Major Features 18
6.2 Limitations & Exclusions 20

II. Project Management Plan 21


1. Overview 21
1.1 Scope & Estimation 21
1.2 Project Objectives 24
1.3 Project Risks 24
2. Management Approach 25
2.1 Project Process 25
2.2 Quality Management 26
2.3 Training Plan 27
3. Responsibility Assignments 27
3.1 Team & Structures 27
3.2 Roles & Responsibilities 28
4. Project Communications 28

1
5. Configuration Management 28
5.1 Document Management 28
5.2 Source Code Management 29
5.3 Tools & Infrastructures 29

III. Software Requirements Specification 29


1. Product Overview 29
1.1 Business Rules 29
2. User Requirements 31
2.1 System Actors 31
2.2 Use Case Diagram 31
2.2.1 User System 31
2.2.2 Admin System 33
3. Functional Requirements 34
3.1 System Functional Overview 34
3.1.1 Screen Flow 34
3.1.1.1 User System 34
3.1.1.2 Admin System 34
3.1.2 Screen Details 35
3.1.2.1 User System 35
3.1.2.2 Admin System 37
3.1.3 Screen Authorization 38
3.2 Entity Relationship Diagram 40
3.3 User System 41
3.3.1 Create Account 41
3.3.1.1 Sign Up 41
3.3.2 Authenticate 44
3.3.2.1 Log In 44
3.3.2.2 Forget Password 46
3.3.2.3 Log Out 47
3.3.3 Upgrade Account 48
3.3.3.1 Buy Premium Package 48
3.3.4 Manage Profile 50

2
3.3.4.1 View Home Page 50
3.3.4.2 View Profile Information 52
3.3.4.3 Update Profile Information 53
3.3.4.4 Update Call Profile Display Options 56
3.3.4.5 Upload Avatar 58
3.3.4.6 Get Post List 60
3.3.4.7 Upload New Post 61
3.3.5 Call 63
3.3.5.1 Find Call 63
3.3.5.2 Reveal Anonymous Caller 66
3.3.5.3 Start Call 68
3.3.5.4 View Another Profile In Call 69
3.3.5.5 Join Call Constructive Questions Process 71
3.3.5.6 Answer Call Constructive Questions 72
3.3.5.7 View Constructive Question Result 74
3.3.5.8 End Call 75
3.3.5.9 Rate Call 76
3.3.5.10 View Call Criteria Filter 78
3.3.5.11 Setup Call Criteria Filter 79
3.3.6 Manage Notification 81
3.3.6.1 View All Notifications 81
3.3.7 Manage Call History 83
3.3.7.1 View Call History List 83
3.3.7.2 View Call History Detail 84
3.3.8 Manage Conversation 86
3.3.8.1 View Conversations List 86
3.3.8.2 View All Messages In The Conversation 88
3.3.8.3 Send Message 90
3.3.9 Manage MBTI Tests 92
3.3.9.1 View The MBTI Tests List 92
3.3.9.2 View Detailed MBTI Test 94
3.3.9.3 Do MBTI Test 96

3
3.3.10 Manage Friend Request 99
3.3.10.1 View Friend Request List 99
3.3.10.2 View Friend Request Detail 100
3.3.10.3 Send Friend Request 102
3.3.10.4 Deny Friend Request 103
3.3.10.5 Accept Friend Request 105
3.3.11 Manage Friend 106
3.3.11.1 View Friend List 106
3.3.11.2 View Friend Profile 108
3.3.11.3 Unfriend 110
3.4 Admin System 112
3.4.1 Authenticate 112
3.4.1.1 Log In 112
3.4.1.2 Log Out 113
3.4.2 Manage Account 114
3.4.2.1 Get Account List 114
3.4.2.2 Get Account Detail 115
3.4.2.3 Create Admin Account 116
3.4.2.4 Reset Password 118
3.4.2.5 Update Account Status 120
3.4.3 Manage Profile 122
3.4.3.1 Get Profile List 122
3.4.3.2 Get Profile Detail 123
3.4.4 Manage Constructive Questions And Answers 125
3.4.4.1 Get Constructive Question List 125
3.4.4.2 Get Constructive Question Detail 127
3.4.4.3 Update Constructive Answers 128
3.4.4.4 Create Constructive Answer 129
3.4.4.5 Delete Constructive Answer 131
3.4.4.6 Create Constructive Question 132
3.4.4.7 Change Constructive Question Status 134
3.4.5 Manage Call History 135

4
3.4.5.1 Get Call History List 135
3.4.5.2 Get Call History Detail 137
3.4.6 Manage Order History 139
3.4.6.1 Get Order History List 139
3.4.6.2 Get Order History Detail 140
3.4.7 Manage Payment History 141
3.4.7.1 Get Payment History List 141
3.4.7.2 Get Payment History Detail 143
3.4.8 Manage MBTI test 144
3.4.8.1 Get MBTI Test List 144
3.4.8.2 Get MBTI Test Detail 146
3.4.9 Statistics 147
3.4.9.1 View Statistics Data 147
4. Non-Functional Requirements 150
4.1 External Interfaces 150
4.1.1 User interface 150
4.1.2 Communication interface 150
4.2 Quality Attributes 150
4.2.1 Usability 150
4.2.2 Flexibility 150
4.2.3 Security 150

IV. Software Design Description 151


1. System Design 151
1.1 System Architecture 151
1.1.1 Overall System Architecture 151
1.1.2 Detail System Architecture 152
1.1.2.1 User Web Application Sub-system 152
1.1.2.2 Backend WebAPI Sub-system 152
1.2 Component Diagram 152
1.3 Package Diagram 153
1.3.1 Front-end Package Diagram 154
1.3.2 Back-end Package Diagram 156

5
2. Database Design 157
2.1 Collections Relationship 158
2.2 Data Dictionary 159
2.2.1 Collection accounts 159
2.2.2 Collection registrators 159
2.2.3 Collection callQuestions 160
2.2.4. Collection statistics 161
2.2.5 Collection notifications 161
2.2.6 Collection callHistories 162
2.2.7 Collection friendRequests 163
2.2.8 Collection mbtiTests 164
2.2.9 Collection images 164
2.2.10 Collection posts 165
2.2.11 Collection conversations 165
2.2.12 Collection messages 165
2.2.13 Collection profiles 165
2.2.14 Collection orders 168
2.2.15 Collection payments 169
3. Detailed Design 169
3.1 User find call 170
3.1.1 Activity Diagram 170
3.1.2 Class Diagram 170
3.1.2.1 CallGateway Class 171
3.1.2.2 CallGatewayGuard Class 172
3.1.2.3 CallQueueService Class 172
3.1.2.4 SocketCallFilterREQ Class 172
3.1.2.5 CallService Class 173
3.1.2.6 CallStateService Class 173
3.1.2.7 CallQueueInfo Interface 174
3.1.2.8 SocketActiveCall Interface 174
3.1.2.9 SocketActiveCaller Interface 175
3.1.2.10 ProfileService Class 175

6
3.1.11 CallHistoryService Class 175
3.1.12 AccountService Class 176
3.1.2.13 PACKAGE 177
3.1.2.14 CallHistoryCreateREQ Class 177
3.1.2.15 CallHistoryProfileREQ Class 177
3.1.2.16 CallQuestionService Class 178
3.1.2.17 CallHistoryRepository Class 178
3.1.3 Sequence Diagram 178
3.1.4 State Machine Diagram 180
3.2 User send message 181
3.2.1 Activity Diagram 181
3.2.2 Class Diagram 181
3.2.2.1 MessageController Class 182
3.2.2.2 MessageService Class 182
3.2.2.3 MessageRepository Class 183
3.2.2.4 Message Class 183
3.2.2.5 MessageSendREQ Class 183
3.2.2.6 ConversationRepository Class 184
3.2.2.7 Conversation Class 184
3.2.2.8 ProfileRepository Class 184
3.2.2.9 Profile Class 184
3.2.2.10 NotificationService Class 185
3.2.2.11 NOTIFICATION_TYPE 185
3.2.2.12 AccountRepository Class 186
3.2.2.13 Account Class 186
3.2.2.14 AccountParsedDTO Interface 186
3.2.2.15 AccountUpgrade Class 186
3.2.2.16 ROLE 187
3.1.13. PACKAGE 187
3.2.2.17 FirebaseAuthGuard Class 187
3.2.2.18 AccountParsedDTO Class 187
3.2.2.19 FirebaseAuthStrategy Class 187

7
3.2.3 Sequence Diagram 187
3.3 User order and pay premium package 189
3.3.1 Activity Diagram 189
3.3.2 Class Diagram 190
3.3.2.1 FirebaseAuthGuard Class 191
3.3.2.2 OrderController Class 191
3.3.2.3 OrderService Class 191
3.3.2.4 OrderRepository Class 192
3.3.2.5 Order Class 192
3.3.2.6 ORDER_STATUS 192
3.3.2.7 PaymentService Class 192
3.3.2.8 PaymentRepository Class 193
3.3.2.9 Payment Class 193
3.3.2.10 PAYMENT_STATUS 194
3.3.2.11 PaymentController Class 194
3.3.2.12 VnPayPayDTO Class 194
3.3.2.13 VnpayReturnREQ Class 194
3.3.2.14 AccountService Class 195
3.3.2.15 AccountRepository Class 195
3.3.2.16 AccountUpgrade Class 195
3.3.2.17 PACKAGE 196
3.3.2.18 Account Class 196
3.3.2.19 ROLE 196
3.3.3 Sequence Diagram 196
3.3.4 State Machine Diagram 199
This state machine diagram describes order state 199
This state machine diagram describes payment state 200
4. Algorithm 200
4.1 Find best potentian match for participant in queue 200
4.1.1 Summary 200
4.1.2 Define problem 200
4.1.3 Solution 200

8
4.1.4 Performance 203
4.1 Calculate MBTI 206
4.1.1 Summary 206
4.1.2 Define problem 207
4.1.3 Solution 207

V. Software Testing Documentation 207


1. Overall Description 207
1.1 Test Model 207
1.2 Test Levels 207
1.3 Testing Types 207
2. Test Plan 207
2.1 Test Stages 208
2.2 Human Resources 208
2.3 Test Milestones 208
3. Test Cases and Test Reports 208

VI. Release Package & User Guides 209


1. Deliverable Package 209
1.1 Source codes & documents 209
2. Installation Guides 209
2.1 System Requirements 209
2.1.1 Hardware Requirements 209
2.1.2 Software Requirements 209
2.1.3 Setup Files 210
2.2 Installation Instruction 210
2.2.1 Setup environment 210
2.2.2 3rd Party Service Setup 210
2.2.3 Run Backend/Web API Server 211
2.2.4 Run User Web Application 212
2.2.5 Run Dashboard/Admin Web Application 212
2.3 Deployment Guide 213
2.3.1 Deploy Web API to VPS & setup CI/CD 213
2.3.2 Deploy User/Admin Dashboard & setup CI/CD 219

9
3. User Manual 221
3.1 Admin System 222
3.1.1 View Statistics Data 222
3.1.2 Create Constructive Question 223
3.2 User System 224
3.2.1 Call 224
3.2.2 Chat 233

10
List of Figures

Figure 1: Kanban Model.


Figure 2: Product Backlog.
Figure 3: Github Action.
Figure 4: Use Case Diagram - User System.
Figure 5: Use Case Diagram - Admin System.
Figure 6: Screen Flow - User System.
Figure 7: Screen Flow - Admin System.
Figure 8: Entity Relationship Diagram.
Figure 9: Overall System Architecture .
Figure 10: Detail System Architecture - User Web Application Sub-system.
Figure 11: Detail System Architecture - Backend WebAPI Sub-system.
Figure 12: Component Diagram.
Figure 13: Front-end Package Diagram.
Figure 14: Back-end Package Diagram.
Figure 15: Database Diagram.
Figure 16: User find call - Activity Diagram.
Figure 17: User find call - Class Diagram.
Figure 18: User Join Queue - Sequence Diagram.
Figure 19: Find and match user in queue - Sequence Diagram.
Figure 20: User send message - Activity Diagram.
Figure 21: User send message - Class Diagram.
Figure 22: Authenticate - Sequence Diagram.
Figure 23: Message is sent and notified to another user - Sequence Diagram.
Figure 24: User order and pay premium package - Activity Diagram.
Figure 25: User order and pay premium package - Class Diagram..
Figure 26: Authenticate request to accesses the private resource- Sequence Diagram.
Figure 27: Buy Premium Package - Sequence Diagram.

11
List of Tables

Table 1: Definition and Acronyms .


Table 2: Supervisor.
Table 3: Team Members.
Table 4: Major Features.
Table 5: Limitations.
Table 6: Exclusion.
Table 7: Scope & Estimation.
Table 8: Project Objectives.
Table 9: Project Risks.
Table 10: Training Plan.
Table 11: Team & Structures .
Table 12: Roles & Responsibilities.
Table 13: Project Communications.
Table 14: Tools & Infrastructures.
Table 15: Business Rules.
Table 16: System Actors.
Table 17: Screen Details - User System.
Table 18: Screen Details - Admin System.
Table 19: Screen Authorization.
Table 20: Entities List.
Table 21: Front-end Package Diagram .
Table 22: Back-end Package Diagram .
Table 23: Data Dictionary - Collection accounts.
Table 24: Data Dictionary - Collection registrators.
Table 25: Data Dictionary - Collection callQuestions.
Table 26: Data Dictionary - Collection statistics.
Table 27: Data Dictionary - Collection notifications.
Table 28: Data Dictionary - Collection callHistories.
Table 29: Data Dictionary - Collection friendRequests.

12
Table 30: Data Dictionary - Collection mbtiTests.
Table 31: Data Dictionary - Collection images.
Table 32: Data Dictionary - Collection posts.
Table 33: Data Dictionary - Collection conversations.
Table 34: Data Dictionary - Collection messages.
Table 35: Data Dictionary - Collection profiles.
Table 36: Data Dictionary - Collection orders.
Table 37: Data Dictionary - Collection payments.
Table 38: Matching criteria.
Table 39: Test Plan - Test Stages.
Table 40: Test Plan - Human Resources.
Table 41: Test Plan - Test Milestones.
Table 42: Test Plan - Test Cases and Test Reports.
Table 43: Source codes & documents.
Table 44: System Requirements - Hardware Requirements.
Table 45: System Requirements - Software Requirements.
Table 46: System Requirements - Software Requirements.

13
Acknowledgements

To our family, you guys are the motivation, the reason for us to strive every day. We wouldn't be
where we are today without your sacrifices, thank you for nurturing, teaching, caring, and investing
in us. I want to dedicate this achievement to you guys, I hope you know that these past years, your
sacrifices were not wasted. We love you

We would like to thank Ms. Hoang Xuan Hong for her active support during the past five months.
Despite of busy with work at FSoft, you still schedule and are always energetic to meet and exchange
with us.
We would like to thank Mr. Lam Huu Khanh Phuong, Ms. Nguyen Thi Cam Huong, Mr. Tran Thanh
Nguyen, Mr. Do Tan Nhan, Mr. Nguyen Trong Tai, and Ms. Ho Yen Thuc for their comments to make
the project more complete.

We would like to thank Ms. Than Thi Ngoc Van, Ms. Vo Thi Thanh Van, Mr. Nguyen The Hoang, Mr.
Nguyen Le Nhat Truong, and all the other teachers at FPT University for helping us from zero in the
past four years, now we have enough knowledge and qualifications to complete our work. This
product is not only our efforts but also all the teachers' efforts. We are beyond grateful.

From the leader of Destinee, personally, I would like to thank Do Tuan Kiet, Le Duc Minh Thien, and
Le Tan Tai for trusting me, and trusting my idea since I have nothing to prove. Thanks for trying and
fighting together. Our Destinee team is a great team, you guys have worked very hard over the past
few months to build a product that we can be proud of. I'm so grateful to have you guys

14
Definition and Acronyms
Acronym Definition

PWA Progressive Web Apps

Destinee Commercial name of the web application

BR Business Rule

ERD Entity Relationship Diagram

GUI Graphical User Interface

SDD Software Design Description

SPMP Software Project Management Plan

SRS Software Requirement Specification

UAT User Acceptance Test

UC Use Case

API Application Program Interface

MBTI Test The test is used to classify users based on personality

The set of questions helps users have more topics to chat


Constructive Questions
about during a call

A service pack that users can purchase to upgrade their


Premium Package account, thereby being able to use all the features of the
system

Users can review the dât of the calls they have made in the
Call History
past

Users can choose the criteria of who they will be paired with in
Call Criteria
the system
Table 1: Definition and Acronyms .

15
I. Project Introduction
1. Overview
1.1 Project Information
● Project name: Destinee - Connecting & building quality conversation application.

● Project code: FA22SE01


● Group code: GFA22SE34
● Software type: Web Application

1.2 Project Team


1.2.1 Supervisor

Full Name Email Phone Number Title

Hoang Xuan Hong honghx2@fe.edu.vn 0986 855 422 Lecturer


Table 2: Supervisor.

1.2.2 Team Members

Full Name Email Mobile Role

Nguyen Trung Thinh thinhntse140344@fpt.edu.vn 0902 153 206 Leader

Do Tuan Kiet kietdtse140777@fpt.edu.vn 0901 067 804 Member

Le Tan Tai tailtse141013@fpt.edu.vn 0383 969 781 Member

Le Duc Minh Thien thienldmse140995@fpt.edu.vn 0795 514 128 Member


Table 3: Team Members.

2. Product Background
We are busier and busier with work, and with many things in life. Making new friends, exchanging,
and meeting offline is a luxury for many individuals. But the need to share, chat and confide has
never diminished over time.

This is proven by lifestyle apps that are getting more and more downloads and reaching more people.
The peak was during the recent covid outbreak when the stock price of Match Group Inc, the parent
company of many of the most popular lifestyle apps, doubled.

Through the process of personal experience and survey of customers who have been using the above
lifestyle applications. We've noticed some of the problems that users are facing:

1. Waiting for a message response consumes a lot of time for busy people who do not have the
habit of using mobile devices a lot

16
2. Users find it difficult to convey stories seamlessly by texting
3. Users do not choose to call because most people are afraid to call and see strangers
4. Users don't know what to say, it's difficult to continue building the story

Recognizing the above problems, we decided to develop Destinee, an application that allows
one-to-one random pairing to voice chat anonymously, text, make friends, view photos & profile
pages of each other. With Destinee, users can quickly find a mate in a split second and continue to
keep in touch with that person if they have had a great conversation.

3. Existing Systems
3.1 App 1: Tinder
A platform that helps people to connect with location-based.

Website: Tinder | Dating, Make Friends & Meet New People

● Pros:
a. Very popular and large user-base lead to a variety of choices
b. Great UI/UX, easy to use
c. User recommendation algorithm by location works efficiently
● Cons:
○ User main goal is to get to know each other, not to have a deep talk, confide
○ The main way to communicate is texting
3.2 App 2: Omegle
Website: Omegle: Talk to strangers!
A platform allows users to randomly video chat one on one with strangers
● Pros:
a. Has existed for a long time, has a large user base from worldwide
b. Meeting new people just in second
c. Very easy to use, register/login not required
d. Support multiple platforms such as web, and mobile app
● Cons:
○ Skip ratio is quite high, people tend to not be patient
○ User main goal is to get to know each other, not to have a deep talk, confide
○ Show face is required to continue the call

4. Business Opportunity
The lifestyle app market in Vietnam has grown bigger since the covid19 crisis. According to Apple
Store, and Google Play Store, Fika, a brand new Vietnamese dating app has been founded in 2020,
and now after only 2 years has gained over 500 thousand downloads, Tinder is also growing pretty
well in Vietnam as well

17
With a covid pandemic, users are now familiar and even more open with making new friends,
chatting, and creating a relationship through an online platform. So, the appearance of Destinee will
fit in the niche market where people would like to have a deep conversation or voice call instead of
texting

5. Software Product Vision


We focus on customer experience. On quality rather than quantity of product functionality. We
define ourselves as a friend, a bridge connecting quality relationships as our name “Destinee” means
destiny, soulmate. Our mission is to help you not only make friends but also find your soul mate, who
you can accompany throughout your life.

Our dream target is to build not only an application but a service that can support our customer from
online to offline, starting with the MVP, and we continue to update and change the application, and
business model according to customers’ need

Our near future goal is

1. At the end of December, release the MVP version to consult and get feedback from users
then change if there are redundancies, shortcomings, and business model according to
customer needs.
2. After getting good user reviews, and a few customers willing to pay a fee which means it
proved the successful model. We will have a plan to ramp up marketing and increase the
number of users

6. Project Scope & Limitations


6.1 Major Features
The main features are listed in the table below, categorized by category and actor

Category Feature Description

As a member, I want to choose queue-matching


FE-01
criteria

As a member, I want to join the queue and start


FE-02
calling

As a member, I want setup my profile


FE-03
information, my favourite movies/songs

Free Tier As a member, I want to enable/disable the


FE-04 visibility of specific profile information shown in
the call section

As a member, I want setup my profile page like


uploading avatar, uploading posts,
FE-05
enable/disabling visibility of specific profile
information shown on this page

18
As a member, I want to manage my MBTI tests,
FE-06
do a new test, view result

As a member, I want to verify/deny a friend


FE-07
request

As a premium member, I want to see my last


FE-08
call histories

As a premium member, I want to message to


FE-09
the last caller

As a premium member, I want to add a friend


Premium/Paid Tier FE-10
with the last caller

As a premium member, I want to search and


FE-11
view my friend lists

As a premium member, I want to view my


FE-12
friend profile page

As an admin, I want to see overall statistics of


FE-13 calls, queue, and rating in weeks, months, or
years

As an admin, I want to manage all accounts in


FE-14
the system

As an admin, I want to manage all profiles in the


FE-15
system

Admin Management As an admin, I want to manage all call histories


FE-16
in the system

As an admin, I want to manage all constructive


FE-17
questions in the system

As an admin, I want to manage all MBTI tests in


FE-18
the system

As an admin, I want to manage all orders and


FE-19
payments in system
Table 4: Major Features.

19
6.2 Limitations & Exclusions
Limitations are what our application can’t do or is not supported at this time

Limitation Description

LI-01 The user must be greater than 17 years old

LI-02 Only supported in Vietnamese

LI-03 Call can only be made on 1 device at a time

LI-04 Video calls are not supported yet

Voice call sound quality is not supported very well in different network
LI-05
environments, slow connection can lead to lag, miss of sounds

LI-06 No noise filtering, or echo cancellation

PWA does not work smoothly on devices with old, outdated operating
LI-07
systems and browsers
Table 5: Limitations.

Exclusion is a feature that we have thought about before but due to time, the budget limit we cannot
implement those features at this time

Exclusion Description

Text by sending a picture, or audio. Message reaction, seen message status,


EX-01
other is typing status
Re-call user that in call history, missed call history, display friends online
EX-02
status

EX-03 Protect user by abuse report, report review, confirm and account ban

EX-04 Login with social media account, phone number

EX-05 Post interact with likes, mention in a message, allow comments

EX-06 Categorise constructive questions for men and women

EX-07 News/Post Feed

EX-08 Pay with Momo Wallet, ZaloPay

Table 6: Exclusion.

20
II. Project Management Plan
1. Overview
1.1 Scope & Estimation
Est. Effort
# WBS Item Complexity
(man-days)

1 Market analysis 15

Defined user pain point Medium –

Market, competitors analysis Medium –

Business model, opportunity analysis Medium –

Interview potential customers Simple 1

2 Training 85

Learn ReactJS, Ionic, ChakraUI Medium 56

Study, document of NestJS framework Medium 7

Research WebRTC & implementation approaches Medium 5

Research Websocket & implementation Medium 7

Research, compare & choose suitable personality test Medium 3


(MBTI, Enneagram, Big5, …)

Research 3rd party services (VNPay, Firebase, ….) Medium 7

3 Workspace setup 7

Setup trello kanban board, rules Simple 1

Setup communication channel Simple 1

Setup source code version control Simple 1

Setup 3rd party credential, environment Simple 1

Setup CI/CD (Github Action, Netlify, DigitalOcean) Medium 3

4 Write document 54

Write project introduction Simple 1

Write project management plan Simple 1

Write system requirement specification Complex 25

Write software design document Complex 15

Write test document Medium 5

Write software user guide Simple 3

21
Write final project report Medium 4

5 Interface design 43

Setup font, theme, color in Figma Simple 12

Setup share component (button, brand icon, Medium 3


navigator…)

Design screen, animation in Figma 23

Design queue, call flow Complex 7

Design profile setup flow Medium 3

Design MBTI flow Medium 1

Design call history flow Medium 3

Design message flow Medium 3

Design notification flow Medium 2

Design friend request flow Medium 2

Design friend flow Medium 2

Design screen flow by connecting screen, create smart Complex 5


animate in Figma

6 Implementation 123

6.1 Implement authentication features 10

Login Medium 3

Logout Simple 1

Register Medium 5

Forget password 1

6.2 Implement Member features 86

6.2.1 Implement call features 17

Choose queue-matching criteria Simple 1

Join queue and call Complex 12

Play constructive questions together Complex 2

Call rating Medium 1

View call histories Medium 1

6.2.2 Implement profile features 8

22
Upload avatar/post Medium 2

Setup profile information, favorites Medium 5

Enable/disable profile information visibility Simple 1

6.2.3 Implement MBTI test features Medium 6

Create new/continue MBTI test Medium 2

View MBTI test list Simple 2

View MBTI result Simple 2

6.2.4 Implement message features 7

View all conversations Medium 2

View messages in conversation Medium 2

Send message Complex 3

6.2.5 Implement friend request features 2

Add friend Medium 1

Verify/deny friend request Medium 1

6.2.6 Implement friend features 4

Search and view friend list Medium 2

View friend profile page Medium 1

Unfriend Simple 1

6.2.7 Implement notification features 3

View notification list Simple 2

Seen/archive notification Simple 1

Purchase premium package Complex 5

6.3 Implement admin dashboard features 27

View overall statistics of call, queue information by Complex 5


weeks, months, or years

Manage accounts Medium 3

Manage profiles Medium 3

Disabled account/profile Medium 3

Manage call histories Medium 3

Manage constructive questions Medium 4

Manage MBTI tests Simple 2

23
Manage orders Simple 2

Manage payments Simple 2

7 Testing 10

Integration Test Medium 5

System Test Medium 5

8 Closing 6

Report Medium 6

Total Estimated Effort (man-days): 429


Table 7: Scope & Estimation.

1.2 Project Objectives

# Quality Stage No. of Defects % of Defect Notes


1 Reviewing 20 27%
2 Integration Test X X
3 User Acceptance Test 20 38%
Table 8: Project Objectives.

1.3 Project Risks

# Risk Description Impact Possibility Response Plans


1 Member dropout of the High Low Every participant is required to
project signed, verify that they won’t do
that. But if they still do, we should
persuade them to stay

2 Member is not active High Medium Should have a few months of


trying to work together first, if
users show signs of not actively
working, they will be fined,
warned, or replaced if they do not
change.

3 Members who are not High Medium Members should be interviewed


skilled enough to perform about their qualifications as well
the assigned work as their ability to acquire the
required knowledge and skills in
the system. If try to work together
for a few months and it doesn't
work, should have the plan to
change personnel as soon as
possible

24
4 e-wallets (Momo, Medium Medium Use Vnpay as the last option
ZaloPay) do not support
non-business account

5 Metered voice-server is High Low Need register alternative


not free anymore voice-server service or paid
version
Table 9: Project Risks.

2. Management Approach
2.1 Project Process

Figure 1: Kanban Model.

Source: https://kanbanize.com

Destinee project is developed using the Kanban Method model – an Agile framework for product
development. We decided to use this model because of following reasons:

● Our project is built according to the startup model, requirements, user stories will be unclear,
requirements are often changed and new features are added after user feedback.
● We use Kanban Method for this project because it is quite flexible in assigning tasks,
reviewing and updating when the task is complete.
● Because we are limited in time and require to offload all unnecessary activities. Using the
kanban method reduces the number of meetings compared to scrum. Product backlogs, and

25
review process are completed by leader, using kanban will significantly reduce the amount of
time spent setting up complex process tools like setup Jira, sprint management, …

Product Backlog

Since our team member is four member, therefore our WIP Limit will be 4 tasks at a time. The below
image is the screenshot of our product backlog

Figure 2: Product Backlog.

2.2 Quality Management


To ensure our product quality, we applies some rules:

● API convention:
○ Response status code: 200, 204, 400, 401, 403, 404, …
○ Response with pagination follow this format include: results, page, limit, count,
totalPage, totalCount
● Coding convention:
○ Set the meaningful names for variables
○ Use Pascal casing for naming Enum, Class and Interface
○ Reformat using defined Eslint convention for every new code
● CI/CD:
○ Use GitHub Action to continue deploying, testing on hosting site
■ Dev Environment: destinee.dev
■ Prod Environment: destinee.vn
● Source code:
○ Create new branch/pull request for every new feature/fix/enhance
○ Branches: master, development, and development-test (for on-site test)
○ New branch is merged to development after reviewed by leader or assigned member

Below is the screenshot of CI/CD integration using Github Action

26
Figure 3: Github Action.

2.3 Training Plan

Waiver
Training Area Participants When, Duration
Criteria
ReactJS All Member Week 1 – 14 days Mandatory
Ionic React
WebRTC All Member Week 2 – 1 days Mandatory
WebSocket All Member Week 2 – 1 days Mandatory
Firebase All Member Week 2 – 1 days Mandatory
Authentication
FCM All Member Week 2 – 1 days Mandatory
Personality Test Nguyen Trung Thinh Week 2 – 3 days
Research
NestJS Nguyen Trung Thinh Week 2 – 5 days Mandatory
Table 10: Training Plan.

3. Responsibility Assignments
3.1 Team & Structures

Role Full Name


Product Owner Nguyen Trung Thinh
Team Leader Nguyen Trung Thinh
Development Team Nguyen Trung Thinh
Do Tuan Kiet
Le Tan Tai
Le Duc Minh Thien

27
Table 11: Team & Structures .

3.2 Roles & Responsibilities

Role Responsibility

Product Owner ● Define user story, specify user requirements


● Support for answers on algorithms
● Give out technique and business analysis support
● Review the document and product
● Gain feedback from customer

Team Leader ● Control the development process


● Control technical process
● Track work progress
● Divide tasks for each member

Development Team ● Analyse requirement and business rules


● Database design
● GUI design
● Coding
● Write document
Table 12: Roles & Responsibilities.

4. Project Communications
Communicat When, Type, Tool,
Who/Target Purpose
ion Item Frequency Method(s)
Work in Team ● Report daily progress 1 per day Google Meet,
team members ● Bug, enhancement, feature onl/offline
announce, and discuss meeting
Work with Supervisor ● Progress report to supervisor 1 per week Google Meet,
advisor (Ms.Hong) & ● Report and handle problem onl/offine
team ● Demo product, document meeting
members
Small Talk Team ● Quick talk, announce, review Always Messenger,
members Discord
Table 13: Project Communications.

5. Configuration Management
5.1 Document Management
● Use Notion to take notes, requirements, reviews
○ Reports
○ About Project, Vision

28
● Use Google Docs for documenting/managing docs: Link

5.2 Source Code Management


Github is used to manage the project’s source code (private):
● Backend API Repo: Link
● Frontend User Repo: Link
● Frontend Dashboard Repo: Link
Follow the rules when using Git:
● Commit convention:
○ Commit code with syntax: git commit -m "[branch-name] type what-commit-does"
○ Types of commits include:
■ feat: new feature
■ fix: handle bug
● Pull request convention:
○ Do not push code directly to main/master branch. Let’s create a new branch for
every new task
○ Tag the leader for code review

5.3 Tools & Infrastructures

Category Tools / Infrastructure


Programming languages Typescript, Javascript
Framework ReactJS, NestJs
Database MongoDB 5.0.8
IDEs/Editors VSCode
Diagram Draw.io
Documentation MSOffice, Google Docs
Version Control GitHub, SourceTree, GitKraken
Deployment Server DigitalOcean(S3, VPS)
Project Management Tool Trello
Table 14: Tools & Infrastructures.

III. Software Requirements Specification


1. Product Overview
1.1 Business Rules
ID Rule Definition
BR-01 Only the Member and Premium Member that have “Kích hoạt” status can log into User
System
BR-02 Only Admin account that has “Kích hoạt” status can log into Admin System
BR-03 Account have 2 types of state: Kích hoạt and Vô hiệu hóa
BR-04 Chat and call applications should be real-time messages.

29
BR-05 All photos uploaded to the server will be saved in 7 different formats:
● Original
● Resized
● Square
● Blur
● Blur Resized
● Blur Square
● Blur Pixelate
BR-06 Only “Member” role can upgrade account to the Premium Member by buying the
Premium package.
BR-07 User System only allow user from 17 years old to get account
BR-08 User can set to hide or display what kind of personal data they want
BR-09 There is some function that only Premium Member has:
● Send message
● Send friend request
● View friend list
● View friend’s profile
● View call history
BR-10 If 2 user is not a friend yet, the avatar that they can see of each other will be blurred
BR-11 Notification has 3 types: Message notification, Friend request notification, Friend Accept
Notification
BR-12 Each account on Destinee User System can only find the call in 1 device or tab of browser
at the same time
BR-13 Account that has “Vô hiệu hóa” status will be displayed by “Vô hiệu hóa” information in
User System:
● Avatar: default avatar based on account’s gender.
● Tên: “Người dùng không tồn tại”.
BR-14 In case the account is logging into Destinee User System but changed status from “Kích
hoạt” to “Vô hiệu hóa”, that account will be automatically logged out when sending any
request to the system.
BR-15 Users can only upload images as the post of profile in the User System.
BR-16 List friends of premium members only display friends who have “Kích hoạt” status.
BR-17 Admin cannot update the status of their own account to disable.
BR-18 Each time the password is changed, all devices will be requested to log in again with the
new password.
BR-19 User must use email as the username for registration of new account
BR-20 Admin account doesn’t have profile information.
BR-21 Admin can only create another admin account.
Table 15: Business Rules.

30
2. User Requirements
2.1 System Actors
# Actor Description
1 Guest Users who don’t have an account in the Destinee system.
Users who have an account in the Destinee system but have not
2 Member
upgraded to Premium Member yet.
Users who have an account in the Destinee system and already
3 Premium Member
bought the premium package.
4 Admin Administrator of the system.
5 System Handler Destinee System.
6 VNPay 3rd party payment gateway
Table 16: System Actors.

2.2 Use Case Diagram


2.2.1 User System
This user system use case diagram contains use case of these actors: Guest, Member, Premium
Member, System Handler, VNPay

31
Figure 4: Use Case Diagram - User System.

32
2.2.2 Admin System

Figure 5: Use Case Diagram - Admin System.

33
3. Functional Requirements
3.1 System Functional Overview
3.1.1 Screen Flow

3.1.1.1 User System

Figure 6: Screen Flow - User System.

3.1.1.2 Admin System

Figure 7: Screen Flow - Admin System.

34
3.1.2 Screen Details

3.1.2.1 User System

# Feature Screen Description

Guests can create a new account in the User


1 Sign Up Registration
System.

Members can log in to the User System as the


Member and Premium Member role, giving
2 Log In Login Screen
them access to features for each role in the
User System.

Member can request to reset their password in


3 Forget Password Forget Password
case they can not remember them

Member to view all information that is


displayed when they start the call and has 2
4 View Home Page Home
buttons that they can use to find the call or
custom filter for finding the call.

View Profile My Information Member can view all information of the profile
5
Information Setting belonging to that Member.

Update Profile My Information Member can update his/her profile


6
Information Setting information.

Update Call
Member can update his/her profile information
7 Profile Display Call Profile Setting
visibility when calling.
Options

Member can change the avatar of their profile


8 Upload Avatar My Profile
by uploading a new image from the device.

Member can view all posts of themselves, the


9 Get Post List My Profile list of posts can be viewed on a profile page,
post is the image.

Member can upload a new post of their profile


10 Upload New Post My Profile
by uploading a new image from the device.
Member can find a call based on a set of criteria
in the profile to find another suitable user in
11 Find Call Call Finding
the system so that they can start an anonymous
call.
Member can guess which of the 3 random
Reveal Call Anonymous
12 people is the one who has been paired with
Anonymous Caller Reveal
them by the system.
Member start the call by connecting the
13 Start Call Calling Screen
matched user.

35
View Another Member can view the profile detail of another
14 Calling Screen
Profile In Call user in the call.
Join Call
Member start answering constructive
15 Constructive Call Question
questions.
Questions Process

Answer Call Member answers constructive questions to get


16 Constructive Call Question the percent of matching of 2 users and have
Questions more ideas for the call.

Member can view the result of the answering


View Constructive
17 Call Question Result process so that they can have more ideas for
Question Result
the call.

18 End Call Calling Screen Member can end the current call.

Member can rate their recent end call, so that


19 Rate Call Call Rating the system can have data to make the next call
better.
View Call Criteria
20 Call Queue Setup Member can view the criteria of the call filter.
Filter
Setup Call Criteria Member can set the criteria to optimise the
21 Call Queue Setup
Filter search for other suitable users in the system.

View All Member can view all notifications that are sent
22 Notifications
Notifications automatically by the system.

View Call History Premium Member can view all calls in the
23 Call Histories
List history.

View Call History Premium Member can view details of the


24 Call Histories
Detail selected call history.

View
25 Conversations Premium Member can view all conversations.
Conversations List

View All
Premium Member can view all messages of the
26 Messages In The Direct Message
selected conversation
Conversation
Premium Member can send messages to
another user in the conversation after both 2
27 Send Message Direct Message
users end the call so that they can keep in touch
with each other.

View The MBTI Member can view all MBTI tests that have been
28 MBTI Test Histories
Tests List done and stored in the system.

View MBTI Test Member can view details of the selected MBTI
29 MBTI Test Result
Detail test.

36
Member can do the new MBTI test or continue
30 Do MBTI Test MBTI Test Process doing the MBTI test that has not been finished
yet.
View Friend
31 Friend Requests Member can view all friend requests.
Request List

View Friend Member can view details of the selected friend


32 Friend Requests
Request Detail request.

Send Friend Premium Member can send a friend request to


33 Call Histories
Request called users in call history.

Deny Friend
34 Friend Requests Member can deny a friend request.
Request

Accept Friend
35 Friend Requests Member can accept a friend request.
Request

Premium Member can view all friends on the


36 View Friend List Friends
friend page.

View Friend Premium Member can view the profile of the


37 Friend Profile
Profile selected friend.

38 Unfriend Friends Premium Member to delete the selected friend.

Buy Premium Member can upgrade their role into Premium


39 Premium Purchase
Package Member by buying the premium package
Table 17: Screen Details - User System.

3.1.2.2 Admin System

# Feature Screen Description


Admin can log in into the Admin System as the
1 Login Login Screen Admin role, giving them access to features for
each role in the Admin System.

Admin can view the statistics data of the User


2 Get Statistic Data Statistics
System.
List of account information, each row has id,
3 Get Account List Accounts email, role, status, and date created
information.

Get Account Admin can get the account information of the


4 Account Detail
Detail selected account.

Create Admin
5 Account Create Admin can create a new admin account.
Account
Admin can update the password of the
6 Reset Password Password Reset
selected account.

37
Admin can deactivate an account, preventing
Update Account Account Status the user from logging into User System or
7
Status Update Admin System or reactive selected account so
that account can log again into the system.
8 Get Profile List Profiles List of profiles in the system.
Admin can get details of the selected profile
9 Get Profile Detail Profile Detail
information.
Get Call History
10 Call Histories List of call history in the system.
List
Get Call History
11 Call History Detail Admin can get call history details.
Detail
Get Constructive Constructive Admin can see the title, answer, date created,
12
Question List Questions and question’s status.
Get Question Constructive Question
13 Admin can get call question information.
Detail Detail
Constructive Question
14 Create Question Admin can create a new question.
Create
Admin can deactivate an account, preventing
questions from being used in the User System
Change Question Constructive Question
15 or reactivate the selected constructive question
Status Status Update
so that that question can be used again in the
User System.
Constructive Question Admin can create new answers to the selected
16 Create Answer
Detail constructive question.

Constructive Question Admin can update the answers to the selected


17 Update Answer
Detail constructive question.

Constructive Question Admin can delete the answer to the selected


18 Delete Answer
Detail constructive question.
Get Order History
19 Orders List of order of all users in system
List
20 Get Order Detail Order Detail Admin can get details of selected order.
Get Payment
21 Payments List of payment in the system.
History List
Get Payment
22 Payment Detail Admin can get details of selected payment.
Detail
23 Get MBTI test list MBTI Tests Admin can get the MBTI test list.
Get MBTI Test
24 MBTI Test Detail Admin can get MBTI detail.
Detail
Table 18: Screen Details - Admin System.

3.1.3 Screen Authorization

Category Screen Guest Member Premium Admin


Member

38
Guest Login Screen X X X
Screens Forget Password X X X
Flow Registration X X X
Home X X
My Profile X X
Profile Page Setting X X
My Information Setting X X
Call Profile Setting X X
MBTI Test History X X
MBTI Test Process X X
MBTI Test Result X X

Member Call Queue Setup X X


Screens Call Finding X X
Flow Call Anonymous Reveal X X
Calling Screen X X
Call Question X X
Call Question Result X X
Call Rating X X
Notifications X X
Friend Request Page X X
Premium Purchase X
Payment Status X
Call Histories X
Premium Conversations X
Member
Direct Message X
Screens
Flow Friends X
Friend Profile X
Login Screen X X
Dashboard X
Statistics X
Accounts X
Account Detail X
Admin
Account Create X
Screens
Flow Password Reset X
Update Account Status X
Profiles X
Profile Detail X
Call Histories X

39
Call History Detail X
Constructive Questions X
Constructive Question
X
Detail
Constructive Question
X
Status Update
MBTI Tests X
MBTI Test Detail X
Payments X
Payment Detail X
Orders X
Order Detail X
Table 19: Screen Authorization.

3.2 Entity Relationship Diagram

Figure 8: Entity Relationship Diagram.

Entities List

# Entity Description
Store all information about the profile that the user has
1 Profile
created
Store all information about the image that the user has
2 Image
uploaded

40
Store all information about the post that the user has
3 Post
created
4 Conversation Store all information about the conversation of the user
5 Message Store all information about the message of the user
Stores all information about friend requests received by
6 FriendRequest
the user
Store all information about the constructive answer that
7 CallHistory
the user has made
Store all information about the constructive questions
8 ConstructiveQuestion
that the user has made
Store all information about the constructive answers that
9 ConstructiveAnswer
the user has made
Stores all information about notification received by the
10 Notification
user
Store all information about the account that the user has
11 Account
made
Store all information about the statistics that the user has
12 Statistics
made
Store all information about the MBTI Test that the user
13 MBTITest
has made
Store all information about the order that the user has
14 Order
bought
15 Payment Define the payment method of the user
Store all information about the registration that the user
16 Registrator
has made
Table 20: Entities List.

3.3 User System

3.3.1 Create Account

3.3.1.1 Sign Up
● Function trigger: Guest sends requests to create an account with a Member role in the
system by filling all required fields and clicking the “Đăng ký” button.
● Function description: This feature allows the Guest to create a new account in the User
System.
● Screen layout:

41
42
43
● Function details:
● Pre-condition:
○ Guest hasn’t had an account in the Destinee User System yet.
● Flow:
○ Guest inputs all required fields and clicks on the “Đăng ký” and the “Tiếp
tục” buttons.
○ System verifies and creates the new account based on the information that is
provided by the Guest
○ System automatically redirects the user to the home page as the Member
role.
● Data inputs:
○ Email: email format, required.
○ Mật khẩu: must have at least 8 characters, at least 1 letter and 1 number,
required.
○ Xác nhận mật khẩu: must be the same as “Mật khẩu field”, required.
○ Tên: free text, required, length 1 - 50 characters.
○ Nickname: free text, required, length 1 - 50 characters.
○ Nơi ở: select one value of the regions of VietNam, required.
○ Giới tính: select one value between Nam and Nữ, required.
○ Xu hướng tính dục: select value based on the value of the Giới tính field,
required.
○ Ngày sinh: select the date value in the calendar, required.
● System validates the new account’s information:
○ Success: System creates a new account based on the information provided,
displays the success message and redirects Member to the profile page.
○ Fail: System shows an error message based on the actor’s actions.
● Business Rules:
○ Email must be unique in the system.
○ The account that is created currently has the Member role and “Kích hoạt”
status.

3.3.2 Authenticate

3.3.2.1 Log In
● Function trigger: Member requests login into the system by filling in the email and password
and tapping on the “Đăng nhập” button.

44
● Function description: This feature allows the Member to login into the User System as the
Member and Premium Member role, giving them access to features for each role in the
Destinee System.
● Screen layout:

● Function details:
● Pre-condition:
○ Member already have an account in the User System.
○ Member logs into the system by account with “Kích hoạt” status
● Flow:
○ Member fill in the email and password and click on the “Đăng nhập” button
to send the request to login into the system.
○ System after the validation step will automatically redirect the user to the
home page
● Data inputs:
○ Email: email format, required.

45
○ Password: must have at least 8 characters, at least 1 letter and 1 number,
required.
● System checks email and password through the Firebase service:
○ System displays the successful message and redirects the user to the home
page.
○ Fail: System prevents the user from accessing and shows an error message
based on the actor’s actions.
● Business rules:
○ Only accounts that have “Kích hoạt” status and have a role are “Member”
and ”Premium Member” could be logged into the Destinee User System.

3.3.2.2 Forget Password


● Function trigger: Member requests reset password by filling in the email tapping on the “Yêu
cầu đổi mật khẩu” button.
● Function description: This feature allows the Member to get back the password when he/she
forgets the password by email.
● Screen layout:

● Function details:
● Pre-condition:
○ Member already have an account in the User System.
● Flow:

46
○ Member fill in the email and clicks on the “Yêu cầu đổi mật khẩu” button to
send the reset password request to member email.
○ System after the validation step will automatically send email to member.
○ Member check email and click the reset password link to reset password.
○ Member fill in the new password and click on the “Lưu” button.
○ System after the validation step will automatically redirect the user to the
login page.
● Data inputs:
○ Email: email format, required.
● System checks email through the Firebase service:
○ System displays the successful message and sends email to the user.
○ Fail: System shows an error message based on the actor’s actions.
● Business rules:
○ Only accounts that have a role are “Member” and ”Premium Member” could
reset password from the User System.
3.3.2.3 Log Out
● Function trigger: Member wants to logout the User System by clicking the “Đăng xuất”
button
● Function description: This feature allows the Member to logout the User System.
● Screen layout:

47
● Function details:
● Pre-condition:
○ Member logged into the system.
● Flow:
○ Member clicks on the “Đăng xuất” tab.
○ System redirects to the “Home” page and displays the “Login” modal.
● System logged the Member out of the system.
○ Success: system logs the Member out of the system.
○ Fail: system shows the error based on the Member’s action.
● Business rules: N/A.

3.3.3 Upgrade Account

3.3.3.1 Buy Premium Package


● Function trigger: Member wants to upgrade their account to the Premium Member.
● Function description: This feature allows the Member to upgrade their account to the
Premium Member so that they can have the right to access all features of the Destinee User
System.
● Screen layout:

48
● Function details:
● Pre-condition:
○ Member already have an account in the User System.
○ Member hasn’t bought Premium package yet.
● Flow:
○ Member clicks on the “Gói thành viên 45,000đ/tháng” button to buy
Premium package.
○ System will automatically redirect the user to the VNPay page.
○ Member confirm and finish the purchase process in VNPay page.
○ System redirect Member to the “Payment Status” page with success status
and update role of user into “Premium Member”.
● System verify and update user role form “Member” to “Premium Member”:
○ Success: system redirect to the “Payment Status” page with success status
and update role of user into “Premium Member”.
○ Fail: system redirect to the “Payment Status” page with fail status.
● Alternative Flow:

Actor Action System Response

49
Member cancel the The system will redirect Member to the “Payment
purchase process or the Status” page with failed status
purchase information is
denied by the VNPay

● Business rules:
○ Only accounts that have a “Member” role could buy Premium package.
○ The time of the Premium package will last 1 month, counting from the time
the Member makes a successful payment.
○ Premium package price is 45,000VND

3.3.4 Manage Profile

3.3.4.1 View Home Page


● Function trigger:
○ Member want to view the “Home” page by clicking the “Home” icon in the tab.
○ After successfully logging into the system, the Member will be automatically
redirected to the “Home” page by the system.
● Function description: This feature allows the Member to view all information that is
displayed when they start the call and has 2 buttons which they can use to find the call
immediately or custom filter for finding the call.
● Screen layout:

50
● Function details:
● Pre-condition:
○ Member logged into the system.
● Flow:
○ Member requests to view the “Home” page.
○ System displays the “Home” page
● Member can view information of the member's profile:
○ Tên: text
○ Biệt danh: text
○ Tuổi: text
○ Chiều cao: text
○ Quê quán: text
○ Giới tính: text
○ Xu hướng tình dục: text
○ Công việc/Trường: text
○ Chuyên ngành: text

51
○ Ngôn ngữ: text
○ 3 bài nhạc yêu thích: image, text
○ 3 bộ phim yêu thích: image, text
○ Tùy chỉnh cuộc gọi: button
○ Bắt đầu gọi ngay: button
● System gets information related to the “Home” page:
○ Success: system displays information related to the “Home” page.
○ Fail: system shows an error message based on the member’s actions.
● Business rules: N/A

3.3.4.2 View Profile Information


● Function trigger: Member wants to view all information of his/her profile by clicking on the
“Cập nhật hồ sơ cá nhân” button on the top right of the screen.
● Function description: This feature allows the Member to view all information of his/her
profile
● Screen layout:

● Function details:

52
● Pre-condition:
○ Member logged into the system.
● Flow:
○ Member clicks on the “Cập nhật hồ sơ cá nhân” button.
○ System displays information about her/his profile.
● Member can view detailed information of the member's profile:
○ Tên: text
○ Biệt danh: text
○ Tên tài khoản: text
○ Quê quán: text
○ Ngày sinh: text
○ Giới tính: text
○ Bạn là: text
○ Bạn đang là: text
○ Trường/ công ty: text
○ Chuyên ngành: text
○ Chiều cao: text
○ Ngôn ngữ: text
○ 3 bài nhạc yêu thích: text
○ 3 bộ phim yêu thích: text
○ 3 sở thích: text
● System gets profile’s information:
○ Success: system displays profile’s information on the screen.
○ Fail: system shows an error message based on the Member’s actions.
● Business rules:
○ All information of the Member that is required to fill in the signup step will
be displayed in the required information area.

3.3.4.3 Update Profile Information


● Function trigger: Member wants to update profile by selecting the field that wants to update
in the “My Information Setting” page.
● Function description: This feature allows the Member to update profile information
belonging to that Member.
● Screen layout:

53
54
● Function details:
● Pre-condition:
○ Member logged into the system.
○ Member is currently on the “My Information Setting” page.
● Flow:
○ Member chooses the field that wants to update and inputs a new value.
○ System stores new values and displays that information on the profile setting
page after validating that information.
● Data inputs:
○ Tên: free text, length 1 - 50 characters, required.
○ Biệt danh: free text, length 1 - 50 characters, required.
○ Tên tài khoản: free text, length 1 - 50 characters, required.
○ Quê quán: select one of the regions of VietNam, required.
○ Ngày sinh: select the date value in the calendar, required.
○ Giới tính: select one value between Nam and Nữ, required.
○ Bạn là: select value based on the value of the Giới tính field, required.
○ Bạn đang là: select one of the defined values.

55
○ Trường/ công ty: free text, length 1 - 50 characters.
○ Chuyên ngành: free text, length 1 - 50 characters.
○ Chiều cao: choose the value in the dropdown.
○ Ngôn ngữ: choose one or many values in the dropdown.
○ 3 bài nhạc yêu thích: choose 3 values in options.
○ 3 bộ phim yêu thích: choose 3 values in options.
● System validates and updates profile’s information:
○ Success: system changes information, shows success messages and updates
the new value.
○ Fail: system shows an error message based on the member’s actions.
● Alternative Flow:

Actor Action System Response

Actor sends a request to The system cancels the update profile process and
cancel the updated profile returns to the “Cập nhật hồ sơ” screen.
information.
● Business rules:
○ The maximum year in birthdate field is current year minor to 17.
○ “Quê quán” field is supported for all regions in VietNam only.
○ “Giới tính” field only has 2 options: Nam and Nữ.
○ “Ngôn ngữ” field has 5 options: Tiếng Anh, Tiếng Pháp, Tiếng Đức, Tiếng
Nhật, Tiếng Việt. Users also can choose one or many options.
○ “Bạn đang là” field has 4 options: Trống, Sinh viên, Nội trợ, Nhân viên.
○ Users can find their favourite songs and favourite movies by name or artist.

3.3.4.4 Update Call Profile Display Options


● Function trigger: Member wants to update profile display options by selecting the field
according to the option that he/she wants to update in the ”Call Profile Setting” page.
● Function description: This feature allows the Member to update his/her profile information
visibility when calling.
● Screen layout:

56
● Function details:
● Pre-condition:
○ Member logged into the system.
○ Member is currently on the ”Call Profile Setting” page.
● Flow:
○ Member choose the field that they want to show/hide.
○ System updates the information that is displayed in the call following the
custom setting of the Member.
● Member can view toggle fields:
○ Tên/Biệt danh: select one of the defined values.
○ Tuổi: toggle
○ Chiều cao: toggle
○ Quê quán: toggle
○ Giới tính: toggle
○ Xu hướng tình dục: toggle
○ Công việc/ Trường: toggle
○ Chuyên ngành: toggle

57
○ Ngôn ngữ: toggle
○ Sở thích: toggle
● System validates and updates profile’s information:
○ Success: system changes information on the display area.
○ Fail: system shows an error message based on the member’s actions.
● Alternative Flow:

Actor Action System Response

Actor sends a request to The system cancels the update process and returns
cancel the update profile to the “Call Profile Setting” screen.
display options.
● Business rules:
○ Member can set which field in the profile will be displayed to another user
when calling.

3.3.4.5 Upload Avatar

● Function trigger: Member requests to upload the new avatar for their profile by clicking in
the avatar area and choosing a new image.
● Function description: This feature allows the Member to change the avatar of their profile by
uploading a new image from the device.
● Screen layout:

58
● Function details:
● Pre-condition:
○ Member logged into the system.
○ Member already have images on their device.
○ Member is currently on the “My Profile” page.
● Flow:
○ Member click on the avatar area and choose the image that they want to
upload.
○ System uploads the new avatar.
● System validates and uploads the new avatar for the profile:
○ Success: system uploads the new avatar, and shows a success message.
○ Fail: system shows an error message based on the member’s actions.
● Alternative Flow:

Actor Action System Response

59
Actor sends the request to The system cancels the process and closes the File
cancel the selected avatar window.
image.
● Business rule:
○ If the Member does not upload an avatar, the system will use the default
avatar based on the user’s gender.
○ System allows uploading images with extensions: JPG and PNG.
○ Member can only upload 1 avatar each time.
○ In case the Member already has their own avatar, the current upload image
will replace the old avatar.
● Exception:

Cause System Response

Selected file is not an The selected file is not an image type. The system
image type. The system shows an error that the file is not an image type.
shows an error that the file
is not an image type.

3.3.4.6 Get Post List

● Function trigger: The Member wants to view all posts by clicking on the “Trang cá nhân”
button.
● Function description: This feature allows the Member to view all posts of themselves, the list
of posts can be viewed on a profile page, post is the image.
● Screen layout:

60
● Function details:
● Pre-condition:
○ Member logged into the system.
○ Posts have been created by the Member.

● Flow:
○ Member click on the “Trang cá nhân” button.
○ System displays a post list in the “Post” area.
● System gets post list:
○ Success: system shows the post list of the selected user.
○ Fail: system shows an error message based on the Member’s actions.
● Business rule:
○ Only users with the “Premium Member” role can view a friend’s post.

3.3.4.7 Upload New Post

● Function trigger: Member requests to upload the new post for their profile by clicking on the
“Tải ảnh” card and choosing a new image.
● Function description: This feature allows the Member to upload a new post of their profile
by uploading a new image from the device.

61
● Screen layout:

● Function details:
● Pre-condition:
○ Member logged into the system.
○ Member is currently on the “My Profile” page
● Flow:
○ Member click on the post area “Tải ảnh” and choose the image that they
want to upload.
○ System displays the new post on the “My Profile” page.
● System validates and uploads the new post for the profile:
○ Success: system uploads the new post and shows a success message.
○ Fail: system shows an error message based on the Member’s actions.
● Alternative Flow:

Actor Action System Response

62
Actor sends the command The system cancels the process and closes the File
to cancel the selected window.
image.
● Business rule:
○ System allows uploading images with extensions: JPG and PNG.
○ Member can only upload 1 avatar each time.
● Exception:

Cause System Response

Selected file is not an The system shows an error that the file is not an
image type. image type.

3.3.5 Call

3.3.5.1 Find Call


● Function trigger: Member wants to find the new call by:
○ Clicking on the “Bắt đầu gọi ngay” button on the “Home” page.
○ Clicking on the “Bắt đầu gọi ngay” button on the “Call Queue Setup” page.
● Function description: This feature allows the Member to find a call based on a set of criteria
in the profile to find another suitable user in the system so that they can start an anonymous
call.
● Screen layout:

63
● Function details:
● Pre-condition:
○ Member logged into the system.
○ Member is currently on the “Home” page or “Call Queue Setup” page.
○ Member has already finished their minimum profile information.

○ Member allow the system to access the microphone of their device.

○ Member not find call or in the call at the same time in other device by the
same account

● Flow:
○ Member send a request to find a call based on the set criteria (feature
3.3.5.11) and wait to be matched with other suitable members in the system.
○ System finds other suitable members in the system based on criteria set
before.

64
● System finds the other suitable user:
○ Success: system redirects the Member to the “Call Anonymous Reveal” page
and starts the call process.
○ Fail: system shows an error message based on the member’s actions.
● Alternative Flow:

Actor Action System Response

Member clicks the “Dừng” The system cancels the process and redirects back
button to send the request to the “Home” page.
to stop the finding call
process.

Actor Action System Response

System noticed that there are no users in the queue

System notifies the user that there are no other


users in the queue

Actor Action System Response

System found that there are no users in the queue


that match your search criteria

System displays the confirm modal if the Member


wants to change find criteria based on the other
online user's profile in the system.

Member clicks “Đồng ý” System starts a new finding call process based on
the new criteria selected by the user

Actor Action System Response

System found that there are no users in the queue


that match your search criteria

System displays the confirm modal if the Member


wants to change find criteria based on the other
online user's profile in the system.

65
Member clicks “Tiếp tục tìm System continues to search for calls without
kiếm” changing the criteria
● Business rule:
○ Users can only find the call when allowing system access to the device’s
microphone.
○ System will match 2 users based on criteria that were set before.
○ Users can not find the call if the same account but in another device or tab of
the browser has already found a call or in another call.
● Exception:

Cause System Response

Member has already found The system cancels the finding process and shows an
the call at another device error message.
or another tab of the
browser.

Cause System Response

Member not allow system The system shows an error message.


to access the microphone
of their device.

3.3.5.2 Reveal Anonymous Caller

● Function trigger: After being matched with another member by the system, the member will
be redirected to the “Call Anonymous Reveal” page.
● Function description: This feature allows the Member to guess which of the 3 random
people is the one who has been paired with them by the system.
● Screen layout:

66
● Function details:
● Pre-condition:
○ Members are matched with another user in the system (feature 3.3.5.1).
● Flow:
○ Member can guess which one from 3 random users is the one who matched
with them by the system by clicking on 3 images.
● System gets random other 2 users in the system:
○ Success: system displays 3 hidden cards containing 1 correct user and 2
random users in the system.
○ Fail: system ends the current call, redirects the Member to the home page
and shows an error message based on the Member’s actions.
● Business rules:
○ Guessing process can only be started after the find call process is done.

67
○ The guessing process will take 3 seconds.
○ Except for 1 correct user, the other 2 users will be chosen in a random way by
the system.
○ System will not notice if the Member is guessing correctly or not.
● Exception:

Cause System Response

Member closes the tab of The system cancels the finding process.
the browser or clicks the
back button

3.3.5.3 Start Call


● Function trigger: After the guessing process on the call reveals page, the member will be
redirected to the “Calling Screen”.
● Function description: This feature allows the Member to start the call by connecting the
matched user.
● Screen layout:

68
● Function details:
● Pre-condition:
○ Member is matched with another user in the system (feature 3.3.5.1).
● Flow:
○ Member can start talking with another user in the call after guessing the
correct user.
● System starts the call process:
○ Success: system connects the microphone and allows 2 users in the call to
talk with each other.
○ Fail: system ends the call and shows the error message.
● Business rules:
○ System will have a timer to count the time of the call
○ The call will only start after the guessing process is done.
● Exception:

Cause System Response

Member closes the tab of The system cancels the finding process.
the browser or clicks the
back button

3.3.5.4 View Another Profile In Call

● Function trigger: Member can view another user’s profile in the call by clicking on the card of
the other profile in the call.
● Function description: This feature allows the Member to view the profile detail of another
user in the call.
● Screen layout:

69
● Function details:
● Pre-condition:
○ Member is currently on the call (feature 3.3.5.3).
● Flow:
○ Member clicks on the card of the other profile.
○ System displays another user’s profile in the call.
● Member can view the detailed information of selected user’s profile:
○ Avatar: image.
○ Tên/ biệt danh: text.
○ Gender: icon.
○ Tuổi: number.
○ Chiều cao: text.
○ Quê quán: text.
○ Xu hướng tính dục: text.
○ Công việc/ trường: text.
○ Ngôn ngữ: text.
○ Sở thích: text.

70
● System gets another user’s profile in the call:
○ Success: system displays another user’s profile in the call.
○ Fail: system shows an error message based on the Member’s actions.
● Business rules:
○ Member can only view information that is not hidden by another user in the
call from their setting.
○ Member can use this feature while the call is not ended.

3.3.5.5 Join Call Constructive Questions Process


● Function trigger: Member wants to start the answer constructive questions process by
clicking on the “Bắt đầu trò chơi kiến tạo tại đây” area and wait another user accept it or
accept the request to start matching questions by another user in the call.
● Function description: This feature allows the Member to start answering constructive
questions.
● Screen layout:

● Function details:
● Pre-condition:

71
○ Member is currently on the call (feature 3.3.5.3).
● Flow:
○ Member clicking on the “Bắt đầu trò chơi kiến tạo tại đây” area.
○ Another user in the call receives the request to join the constructive
questions process and clicks the “Đồng ý” button.
○ System mutes both users and starts the answer constructive questions
process (feature 3.3.5.6).
● System starts the answer constructive questions process:
○ Success: system mutes both users and starts to answer constructive
questions.
○ Fail: system shows an error message based on the Member’s actions.
● Alternative Flow:

Actor Action System Response

Member click the “Đồng ý” System mutes both users and starts the answer
button. constructive questions process
● Business rules:
○ The answering process can only be started when both 2 users in the call
accept.
○ Member can only answer matching questions once per call.

3.3.5.6 Answer Call Constructive Questions


● Function trigger: After joining the call constructive questions process, the system will
automatically display constructive questions.
● Function description: This feature allows the Member to answer constructive questions to
get the percent of matching of 2 users and have more ideas for the call.
● Screen layout:

72
● Function details:
● Pre-condition:
○ Both 2 users in the call accept requests to start the answer process (feature
3.3.5.5).
● Flow:
○ Member answer the constructive questions and wait for another user in the
call to complete the answer process too.
○ System stored the answer and calculate result of the constructive question
process
● Member can view 6 questions with information:
○ Time left to answer the questions: number.
○ Question’s title: text.
○ List of answers: text.
● System starts the answer constructive questions process:
○ Success: system displays 6 questions and the Member can answer them.
○ Fail: system shows an error message based on the Member’s actions.
● Business rules:

73
○ The time for answering each question is 60 seconds, and the default answer
will always be the first one.
○ System displays 6 questions in each answering process.

3.3.5.7 View Constructive Question Result


● Function trigger: After both 2 users complete the answering process, the system will display
the result.
● Function description: This feature allows the Member to view the result of the answering
process so that they can have more ideas for the call.
● Screen layout:

● Function details:
● Pre-condition:
○ Both users in the call finished the answer process (feature 3.3.5.6).
● Flow:
○ Member can view the result after both 2 users complete the answering
process.
● Member can view the result with the information:

74
○ The matching percent of 2 users: number.
○ The answers of 2 users: text.
● System calculates the result of the answer constructive questions process:
○ Success: system displays the result that is currently calculated.
○ Fail: system shows an error message based on the Member’s actions.
● Business rules:
○ The percentage match of both users will be calculated based on the number
of similar answers to the same question

3.3.5.8 End Call


● Function trigger: Member can end the current call by clicking the “End Call” icon on the
“Calling Screen”.
● Function description: This feature allows the Member to end the current call.
● Screen layout:

● Function details:
● Pre-condition:
○ Member is in the call (feature 3.3.5.3).

75
● Flow:
○ Member click the end call button.
○ System end the call and redirect him/her to the “Home” page.
● System is requested to end the current call:
○ Success: system ends the current call and redirects the Member to the “Call
Rating” page.
○ Fail: system shows an error message based on the member’s actions.
● Alternative Flow:

Actor Action System Response

Another person in the call The system redirects the user to the call rating page
clicks the “Dừng” button.
● Business rules:
○ The call will automatically end when 1 in 2 users in the call send the request
to end the call.
● Exception:

Cause System Response

One of 2 user in the call The system show confirm modal that the user really
closes the tab of the want to end call.
browser or clicks the back
button

3.3.5.9 Rate Call


● Function trigger: Member can rate another user in the current call after clicking on the end
call button at the “Calling Screen”.
● Function description: This feature allows the Member to rate their recent end call, so that
system can have data to make the next call better.
● Screen layout:

76
● Function details:
● Pre-condition:
○ Member has ended the call (feature 3.3.5.8).
● Flow:
○ Member can rate the current ended call by selecting the number of stars and
3 tags about another user in the call and then clicking the “Hoàn tất” button.
○ System stores information about the call rating and redirects the Member to
the “Home” page.
● Data inputs:
○ Rating star: choose the number of stars, required, numbers 1-5.
○ Keyword tag: choose 3 keywords in 20 keywords about another person,
required, min 3 tags.
● System stores the rating information:
○ Success: system shows success messages and redirects the Member to the
home page.
○ Fail: system shows an error message based on the Member’s actions.
● Business rules:

77
○ Member must choose at least 3 tags and 1 star.
● Exception:

Cause System Response

User closes the tab of the The system does not store data about call rating.
browser or clicks the back
button

3.3.5.10 View Call Criteria Filter


● Function trigger: Member wants to view the criteria by clicking the “Tùy chỉnh cuộc gọi”
button on the “Home” page.
● Function description: This feature allows the Member to view the criteria of the call filter.
● Screen layout:

● Function details:

78
● Pre-condition:
○ Member logged into the system.
● Flow:
○ Member clicks the “Tùy chỉnh cuộc gọi” on the “Home” page.
○ System displays the criteria of the Member.
● Member can view the call criteria filter including the following information:
○ Giới tính: text.
○ Quê quán: text.
○ Độ tuổi: text.
○ Chủ đề: text.
○ Ngôn ngữ: text.
○ Xu hướng tính dục: text.
● System gets the call criteria filter:
○ Success: system displays the call criteria filter.
○ Fail: system shows the error message based on the Member’s action.
● Business rules: N/A

3.3.5.11 Setup Call Criteria Filter


● Function trigger: Member wants to set the criteria to optimise the search for other suitable
users by choosing the criteria that they want and updating them.
● Function description: This feature allows the Member to set the criteria to optimize the
search for other suitable users in the system.
● Screen layout:

79
● Function details:
● Pre-condition:
○ Member logged into the system.
○ Member is currently on the “Call Queue Setup” page.
● Flow:
○ Member choose the field that when to change the criteria.
○ System stores new values and displays the new value of the selected criteria
on the display area.
● Member can view toggle fields:
○ Giới tính: choose the value in the dropdown..
○ Quê quán: choose the value in the dropdown..
○ Độ tuổi: choose the value in the dropdown..

80
○ Chủ đề: choose the value in the dropdown..
○ Ngôn ngữ: choose the value in the dropdown..
○ Xu hướng tính dục: choose the value in the dropdown..
● System validates and updates profile’s information:
○ Success: system changes information on the display area.
○ Fail: system shows an error message based on the member’s actions.
● Business rules:
○ Default value of all criteria fields is “Tất cả”.
○ All criteria fields with a value of "Tự động" are considered compatible with
all values of that field.

3.3.6 Manage Notification

3.3.6.1 View All Notifications


● Function trigger: Member can view all notifications by clicking on the “Notification” icon on
the tab bar.
● Function description: This feature allows the Member to view all notifications that are sent
automatically by the system.
● Screen layout:

81
● Function details:
● Pre-condition:
○ Member logged into the system.
● Flow:
○ Member click on the “Notification” icon on the tab bar.
○ System displays the list of notifications.
● Member can view notifications based on the type of notification:
○ Avatar of the user: image
○ Name of user: text
○ Content of notification: text, based on notification type
○ Time since the notification is sent.
● System gets notification list:

82
○ Success: system displays the notification list.
○ Fail: system shows an error message based on the Premium Member’s
actions.
● Business rules:
○ Notification will be automatically deleted when the Member clicks on that.

3.3.7 Manage Call History

3.3.7.1 View Call History List


● Function trigger: Premium Member want to view all the call history by clicking the “Call” icon
in the tab bar.
● Function description: This feature allows the Premium Member to view all calls in the
history.
● Screen layout:

● Function details:
● Pre-condition:

○ Premium Member has already logged into the system by premium member
role.

83
○ Premium is currently on the call history page.
○ Premium Member called at least 1 call.
● Flow:
○ Premium Member clicks on the Call icon in the tab bar.
○ System displays the list of call history of he/she.
● Premium Member can view the list of call history with the following information for
each item in the list:
○ Avatar of another user in the call: image.
○ Name of another user in the call: text.
○ Time of the call: text.
● System gets call history list:
○ Success: system displays the call history list.
○ Fail: system shows an error message based on the Premium Member’s
actions.
● Business rules:
○ Call history list will automatically add a new one when matching success.
● Exception:

Cause System Response

Premium Member does System informs “Không có lịch sử cuộc gọi”.


not make any calls yet.

3.3.7.2 View Call History Detail


● Function trigger: Premium Member wants to view details of the selected call history by
clicking on the call history.
● Function description: This feature allows the Premium Member to view details of the
selected call history.
● Screen layout:

84
● Function details:
● Pre-condition:

○ Premium Member has already logged into the system by premium member
role.
○ Premium is currently on the “Call Histories” page.
● Flow:
○ Premium Member clicks on the selected call history card.
○ System displays the details of the selected call history.
● Premium Member can view details of the selected call history with the information:
○ Avatar of another user in the call: image.
○ Name of another user in the call: text.
○ Time of the call: text.
○ Hợp nhau về quan điểm: number.
○ Cảm nhận về người ấy: 3 tags.
○ Cảm nhận của bạn: 3 tags.
○ Number of starts.
○ Nhắn tin: button.

85
○ Kết bạn: button
● System gets detailed of the selected call history:
○ Success: system displays details of the selected call history.
○ Fail: system shows an error message based on the Premium Member’s
actions.
● Business rules:
○ Call History actions will be changed based on the friend status of 2 users in
that call history.
○ When the user in call history changes the status to “Vô hiệu hóa” data that
user will change to inactive data.

3.3.8 Manage Conversation

3.3.8.1 View Conversations List


● Function trigger: Premium Member want to view all conversations by clicking on the “Chat”
icon in the tab bar.
● Function description: This feature allows the Premium Member to view all conversations.
● Screen layout:

86
● Function details:
● Pre-condition:

○ Premium Member has already logged into the system.


○ Premium Member have called at least 1 conversation.
● Flow:
○ Premium Member clicks on the “Chat” icon in the tab bar.
○ System displays the list of conversations of Premium Member.
● Premium Member can view the list of conversations with the following information
for each item in the list:
○ Avatar of another user: image.
○ Name of another use: text.
○ Time since the last message sent: text.

87
○ Last message: text.
● System gets conversation list:
○ Success: system displays the conversation list.
○ Fail: system shows an error message based on the Premium Member’s
actions.
● Business rules:
○ Conversation list only contains conversation messages inside.
○ Conversation list will automatically add a new one when 2 users send
messages to each other.
○ The conversation that is not seen by the user will have a more bright
background colour.
● Exception:

Cause System Response

Premium Member don’t System informs “Không có cuộc trò chuyện để hiển
have any conversations. thị”.

3.3.8.2 View All Messages In The Conversation


● Function trigger: The Premium Member can view all messages in the selected conversation
by:
○ Clicking the selected conversation on the “Conversations” page.
○ Clicking on the “Nhắn tin” button on the selected call history in the “Call Histories”
page.
○ Clicking on the new message notification on the “Notifications” page.
○ Clicking on the “Nhắn tin” button on the friend’s profile.
● Function description: This feature allows the Premium Member to view all messages of the
selected conversation
● Screen layout:

88
● Function details:
● Pre-condition:

○ Premium Member has already logged into the system by premium member
role.
○ The selected conversation has at least 1 message.
● Flow:
○ Premium Member clicks on selecting the conversation.
○ System displays all messages in the selected conversation.
● Premium Member can view messages following information:
○ User's own avatar: image, displayed on the right of the screen.
○ User's own messages: free text, displayed next to the user's own avatar.
○ Another avatar in conversation: image, displayed on the left of the screen.

89
○ Another message in the conversation: free text, displayed next to the other
user's avatar in conversation.
● System gets messages in the selected conversation:
○ Success: system displays 15 latest messages of selected conversation.
○ Fail: system shows an error message based on the Premium Member’s
actions.
● Alternative Flow:

Actor Action System Response

User receives a message in System displays the currently received message


real-time when another user in at the bottom of the list of the received
conversation sends a message messages.
● Business rules:
○ Messages have two types: Other messages and My messages.
○ Avatar of the user will be next to the last message in the block of messages.
○ Messages of 2 users in conversation will have a different colour.
○ System will load 15 messages each time. Users can view the older messages
by scrolling to the top of the screen.
○ If the remaining user in the conversation has not become friends with you,
that user's avatar will be blurred

3.3.8.3 Send Message


● Function trigger: Premium Member can send messages to another user in the conversation
after input the message and clicking send button.
● Function description: This feature allows the Premium Member to send messages to another
user in the conversation after both 2 users end the call so that they can keep in touch with
each other.
● Screen layout:

90
● Function details:
● Pre-condition:

○ Premium Member has already logged into the system by premium member
role.
○ Premium Member has already made calls with another user in the
conversation.

○ Premium Member is currently on the “Conversations” page.

● Flow:
○ Premium Member send messages to another user in the conversation after
inputting the message and clicking the send button.
○ System appends a new message as the last message on the conversation.

91
○ Another user in the conversation receives the new message and the
notification about that new message.
● System store new messages:

○ Success: system store message and append a new message as the last
message of the conversation

○ Fail: system shows an error message based on the Premium Member’s


actions.

● Business rules:

○ The message sent will automatically update to the last message and display
outside the list of conversations.
○ Input message field will be disabled when another user in conversation
changes status to “Vô hiệu hóa” and the Member can’t send messages to
he/she anymore.
○ Message only sends when the input field is not empty or null.
● Exception:

Cause System Response

Another user in conversation is System change information of another user


currently changing status to in conversation to deactivate information,
deactivate by admin then displays the error message and disable
chat field

3.3.9 Manage MBTI Tests

3.3.9.1 View The MBTI Tests List


● Function trigger: Member can view all MBTI tests by clicking in the “Tính cách của bạn”
button at the “Home” page.
● Function description: This feature allows the Member to view all MBTI tests that have been
done and stored in the system.
● Screen layout:

92
● Function details:
● Pre-condition:
○ Member logged into the system.
○ Member has started doing or finished at least 1 MBTI test.
● Flow:
○ Member clicking on the “Tính cách của bạn” button on the “Home” page.
○ System displays all his/her MBTI tests
● Member can view the list of MBTI tests with the following information for each item
in the list:
○ Lịch sử khảo sát: text, the time format is DD/MM/YYYY - hh:mm.
○ Kiểu tính cách: text, display 1 on 16 MBTI types.
● System gets the MBTI test:
○ Success: system displays the list of MBTI tests.

93
○ Fail: system shows an error message based on the Premium Member’s
actions.
● Business rules: N/A
● Exception:

Cause System Response

Not existing MBTI tests in the System shows the “Bạn chưa thực hiện bài
database. trắc nghiệm nào” message.

3.3.9.2 View Detailed MBTI Test


● Function trigger: Member wants to view MBTI test details by clicking on the MBTI test item.
● Function description: This feature allows the Member to view details of the selected MBTI
test.
● Screen layout:

94
● Function details:
● Pre-condition:
○ Member has already logged into the system.
○ Member is currently on the ”Personality Tests History” page.
● Flow:
○ Member click on the selected MBTI test.
○ System displays the detail of the selected MBTI test
● System displays MBTI test detailed with the following information:

○ Câu hỏi: text.


○ Câu trả lời: text.
○ Số câu hỏi đã được trả lời: number
● Business rules:

95
○ Users can only view details of the finished MBTI tests.

3.3.9.3 Do MBTI Test


● Function trigger: Member can start doing the MBTI test:
○ Doing a new MBTI test by clicking the “Thực hiện trắc nghiệm” button on the
“Personality Tests History” page.
○ Continue to do MBTI that has not been done yet by clicking into that MBTI test.
● Function description: This feature allows the actor to do the new MBTI test or continue
doing the MBTI test that has not been finished yet.
● Screen layout:

96
● Function details:
● Pre-condition:

97
○ Member has already logged into the system.
○ Member is currently on the “Personality Test History” page.
● Flow:
○ Member clicks the “Thực hiện trắc nghiệm” button.
○ System displays 32 MBTI questions and starts the MBTI Test process.
○ Member answer by choosing 1 of 5 options.
● Member can view MBTI questions with the following information:
○ Number of MBTI questions: number, length 1-32.
○ Question title: text.
○ Answer: choose 1 in 5 options.
● System gets MBTI questions:
○ Success: system displays MBTI questions and the Member can start the MBTI
test.
○ Fail: system shows an error message based on Member’s action.
● Alternative Flow:

Actor Action System Response

Member continues doing the System displays MBTI questions, starting from
selected MBTI test that is not the last question that the Member has not
done yet by clicking the “Tiếp finished yet.
tục” button.
● Business rules:
○ Users can only do a new MBTI test when the old one has already been
calculated.
○ If users do 16 on 32 MBTI questions, the system will ask if the user wants to
continue to do the rest or can finish it later.
○ System now supports 32 MBTI questions in total.
● Exception:

Cause System Response

System does not calculate the old System shows dialogue to confirm that the
MBTI test done yet user wants to do another MBTI test.

98
3.3.10 Manage Friend Request

3.3.10.1 View Friend Request List


● Function trigger: Member wants to view all friend requests by clicking the ”Xem tất cả”
button on the “Friends” page.
● Function description: This feature allows the Member to view all friend requests.
● Screen layout:

● Function details:
● Pre-condition:
○ Member have already logged into the system.
○ Member is currently on the “Friend” page.
○ Member has at least 1 friend request.
● Flow:

99
○ Member clicks on the ”Xem tất cả” button on the “Friends” page.
○ System displays the list of friend requests.
● Member can view the list of friend requests with the following information for each
item in the list:
○ Avatar of friend: image.
○ Name of friend: text.
○ Hợp nhau về quan điểm: number.
○ Xác nhận: button.
○ Xóa: button.
● System gets the friend requests list:
○ Success: system displays the friend requests list.
○ Fail: system shows the error message based on Member’s action.
● Business rules:
○ If 2 friend requests or fewer exist, users can view them outside the friend
page.
● Exception:

Cause System Response

Not existing any friend System shows the “Không có lời mời kết bạn nào”
requests. message.

3.3.10.2 View Friend Request Detail


● Function trigger: Member wants to view friend request details by:
○ Clicking on the “Friend Request” item on the “Notifications” page.
○ Clicking on the “Friend Request” item on the “Friends” page.
○ Clicking on the “Xem tất cả” button on the “Friends” page
● Function description: This feature allows the Member to view details of the selected friend
request.
● Screen layout:

100
● Function details:
● Pre-condition:
○ Member have already logged into the system.
● Flow:
○ Member sends the request to view details of the selected friend request.
○ System displays details of the selected friend request.
● Member can view the detail of the friend request with the following information:
○ Avatar of friend: image.
○ Name of friend: text.
○ Hợp nhau về quan điểm: number.
○ Xác nhận: button.
○ Xóa: button.
● System gets the detail of the selected friend request:
○ Success: system displays the details of the selected friend request.
○ Fail: system shows the error message based on Member’s action.
● Business rules: N/A

101
3.3.10.3 Send Friend Request
● Function trigger: Premium Member want to send a friend request by clicking on the “Kết
bạn” button on the expanded call history card at the “Call Histories” page.
● Function description: This feature allows the Premium Member to send a friend request to
called users in call history.
● Screen layout:

● Function details:
● Pre-condition:

○ Premium Member has already logged into the system.


○ The Premium Member has already called the user that he/she wants to send
a friend request.
○ Both users haven’t been friends yet.

102
○ Premium Member is currently on the “Call Histories” page.
● Flow:
○ Premium Member clicks on the “Kết bạn” button on the expanded call
history card.
○ System sends a friend request to another user and pushes the notification to
the receiver.
● System validates the resolving content:

○ Success: system sends a friend request to the receiver and updates the status
of the friend request of the Premium member.
○ Fail: system does not send a friend request and shows a specified error
message on a popup.

● Business rules:
○ Receiver must be used to call the sender.
○ Receiver must have “Kích hoạt” status.
○ If the user was denied a friend request in the past, the user can not send a
friend request again to that account.
○ Premium Member can not send the friend request again to the account
being a friend.
● Exception:

Cause System Response

Premium Member has System displays the error message and cancels the
already sent a friend sending process.
request.

3.3.10.4 Deny Friend Request


● Function trigger: Member wants to deny a friend request by clicking on the “Xóa” button on
the selected ”Friend Request” modal.
● Function description: This feature allows the Member to deny a friend request.
● Screen layout:

103
● Function details:
● Pre-condition:
○ Member have already logged into the system.
○ Member currently view details of the friend request that they want to accept
(feature 3.3.10.2).

● Flow:
○ Member click on the “Xóa” button on the selected “Friend Request'' modal.
○ System changes the status of a friend request and the sender can not send
another friend request to the Member.
● System validates the resolving content:

○ Success: system changes the status of a friend request and displays a success
message.

104
○ Fail: system cancels deny process and shows a specified error message on a
popup dialog.

● Business rules:
○ Sender of the friend request must not be in the friend list of the receiver yet.
○ Sender of friend requests must have “Kích hoạt” status.

3.3.10.5 Accept Friend Request


● Function trigger: Member wants to accept a friend request by clicking on the “Xác nhận”
button on the selected friend request modal.
● Function description: This feature allows the Member to accept a friend request.
● Screen layout:

● Function details:
● Pre-condition:

105
○ Member have already logged into the system.
○ The Admin currently views a detailed friend request that they want to accept
(feature 3.3.10.2).

● Flow:
○ Member clicks on the “Xác nhận” button on the selected friend request
modal.
○ System adds 2 users to list friends with each other.
● System validates the resolving content:

○ Success: system adds 2 users to list friends of each other and displays a
success message.
○ Fail: system cancels the accepted process and shows a specified error
message on a popup dialog.

● Business rules:
○ Sender of the friend request must not be in the friend list of the receiver yet.
○ Sender of the friend request must have “Kích hoạt” status.
○ When success accepts a friend request, the avatar of the friend will be
changed to a clear one

3.3.11 Manage Friend

3.3.11.1 View Friend List


● Function trigger: Premium Member wants to view all friends by clicking the “Friend” icon in
the tab bar.
● Function description: This feature allows the Premium Member to view all friends on the
friend page.
● Screen layout:

106
● Function details:
● Pre-condition:

○ Premium Member has already logged into the system.


○ Premium is currently on the “Friends” page.
○ Premium Member has at least 1 friend.
● Flow:
○ Premium Member clicks the “Friend” icon in the tab bar.
○ System displays the Premium Member’s list of friends.
● Premium Member can view the list of friends with the following information for each
item in the list:
○ Avatar: image.
○ Tên/ biệt danh: text.: text.

107
○ Giới tính: icon.
○ Tuổi: number.
○ Quê quán: text.
○ Number of starts.
○ Công việc/ trường: text.
○ Chuyên ngành: text.
● System gets friend request list:
○ Success: system displays the friend request list.
○ Fail: system shows the error message based on Premium Member’s action.
● Business rules:
○ Friend list just only displays users who have “Kích hoạt” status.
○ Friends in the list are default sorted by time accepted.
○ Search criteria include: search by product name of friends.
● Exception:

Cause System Response

Premium Member does System informs “Không có bạn bè để hiển thị”.


not have any friends

3.3.11.2 View Friend Profile


● Function trigger: Premium Member wants to view the profile of the friend by clicking on the
“Friend” item on the list.
● Function description: This feature allows the Premium Member to view the profile of the
selected friend.
● Screen layout:

108
● Function details:
● Pre-condition:

○ Premium Member has already logged into the system by premium member
role.
○ Premium Member has already been a friend with an account that wants to
view the profile.

○ Premium Member is currently on the “Friend Profile” page.

● Flow:
○ Premium Member clicks on the friend item on the list.
○ System displays the profile of the friend on the screen.
● System gets details of the selected friend profile:

○ Success: Premium Member can view the profile of a friend.

109
○ Fail: system shows a specified error message on a popup dialog.

● Business rules:
○ User can only view the profile of the user have the status “Kích hoạt”
○ Both users must be friends to view the profile of each other.
● Exception:

Cause System Response

selected friend is currently System redirects the user back to the friend list page
changed status to “Vô hiệu and updates the friend list to hide information of the
hóa” selected friend.

3.3.11.3 Unfriend
● Function trigger: Premium Member want to unfriend their friend by clicking on the “Hủy kết
bạn” button.
● Function description: This feature allows the Premium Member to delete the selected friend.
● Screen layout:

110
● Function details:
● Pre-condition:

○ Premium Member has already logged into the system.


○ Premium Member is currently on the selected “Friend Profile” page.

● Flow:
○ Premium Member clicks on the “Hủy kết bạn” button.
○ System deletes 2 users from each other's friend list.
● System validates the resolving content:

○ Success: system updates the list of friends of the user to remove the selected
friend that was deleted.

○ Fail: system shows a specified error message on a popup dialogue.

● Exception:

111
Cause System Response

Actor already deleted a System shows an error that did not find the selected
selected friend from the friend to delete.
list

3.4 Admin System

3.4.1 Authenticate

3.4.1.1 Log In
● Function trigger: Admin requests login into the admin dashboard system by filling in the
email and password and tapping on the “Đăng nhập” button.
● Function description: This feature allows Admin login into the Destinee Admin Dashboard
System as the Admin Member role, giving them access to features for each role in the Admin
System.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin already has an account in the Destinee Dashboard System yet.
● Flow:
○ Admin sends the request to login into the system by providing email and
password.
○ After the validation step, the Admin will allow logging into the system as the
admin role.
● Data inputs:

112
○ Email: email format, required.
○ Password: must have at least 8 characters, at least 1 letter and 1 number,
required.
● System checks email and password through the Firebase:
○ Success: System displays the successful message and redirects the user to
the dashboard home page.
○ Fail: System prevents the user from accessing and shows an error message
based on the actor’s actions.
● Business rules:
○ Only the member who is authorised as Admin and has “Kích hoạt” status can
log into the Dashboard system.
● Exceptions:

Cause System Response

Required fields are missing The system shows error messages for each missing
field.

Required information The system shows error messages for each not valid
fields are not valid. field.

The required information The system shows error messages for each incorrect
fields are not correct. field.

3.4.1.2 Log Out


● Function trigger: Admin requests logout from the Admin Dashboard System by clicking on
the “Đăng xuất” button.
● Function description: This feature allows the Admin to log out from the admin dashboard
system.
● Screen layout: N/A
● Function details:
● Pre-condition:
○ Admin logged into the system.
● Flow:
○ Admin clicks on the “Đăng xuất” tab.
○ System redirects to the “Home” page and displays the “Login” modal.
● System logged the Member out of the system.
○ Success: system logs the Admin out of the system.
○ Fail: system shows the error based on the Admin‘s action.

113
● Business rules: N/A.

3.4.2 Manage Account

3.4.2.1 Get Account List


● Function trigger: Admin wants to get a list account by clicking the “Tài khoản” item in the f
sidebar.
● Function description: This feature allows the Admin to view the list of account information,
each row has id, email, role, status, and date created information.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin already has an account in the Admin System.
● Flow:
○ Admin sends the request to view the list of accounts.
○ System displays the account list on the screen.
● Admin can view the account list with the following information:
○ ID: text.
○ Email: text, email format.
○ Chức vụ: text.
○ Trạng thái: text.
○ Ngày tạo: text.
○ Xem hồ sơ tài khoản: button.
○ Đổi mật khẩu: button.

114
○ Nâng cấp: button.
○ Vô hiệu hóa: button.
● System gets account list:
○ Success: system displays account list.
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:

○ The list is default sorted by the “Ngày tạo” field in descending order.

○ Search criteria for account list contains: search by email, filter by role.

○ If the account with the “Admin” role, the following information will not
show:

■ Xem hồ sơ tài khoản: button.


● Exceptions:

Cause System Response

No existing account in the System show “Không có dữ liệu” message.


database.

3.4.2.2 Get Account Detail


● Function trigger: Admin wants to account details by clicking the “Xem chi tiết tài khoản”
button on the selected profile in the ”Manage Profiles” page.
● Function description: This feature allows Admin to get the account information of the
selected profile.
● Screen layout:

● Function details:

115
● Pre-condition:
○ Admin already has an account in the Admin System.
○ Admin is currently on the “Manage Profile” page.
● Flow:
○ Admin sends the request to view details of a specific account
○ System opens the profile drawer to display the current information about the
selected account.
● Admin can view account information:
○ ID: text.
○ UID: text.
○ Email: text, mail format.
○ Chức vụ: text.
○ Trạng thái: text.
○ Ngày tạo: text.
○ Vô hiệu hóa: button.
○ Đóng: button.
● System gets details of the selected account:
○ Success: system displays the account information.
○ Fail: system shows the error message based on the Admin’s action.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System close account detail drawer.


drawer screen to close the
account detail drawer
● Business rules:

○ Accounts with the Admin role can’t be viewed in detail.

3.4.2.3 Create Admin Account


● Function trigger: Admin wants to create a new account with the admin role by clicking the
“Tạo tài khoản” button on the “Manage Accounts” page.
● Function description: This feature allows Admin to create a new admin account.
● Screen layout:

116
● Function details:
● Pre-condition:
○ Admin already has an account in the Admin System.
○ Admin is currently on the “Manage Accounts” page.
● Flow:
○ Admin clicks the “+ Tạo tài khoản” button on the “Tài khoản” page.
○ System displays the “Account Create” modal.
○ Admin fills in new admin account information then clicks the “Lưu” button to
create a new admin account
○ After the validation step, the system will create an account and have a role as
admin and “Kích hoạt” status.
● Data input:
○ Email: email format, required.
○ Nhập mật khẩu: hidden text, must have at least 8 characters, at least 1
letter and 1 number, required.
○ Xác nhận mật khẩu: hidden text input, must be same as the “Nhập mật
khẩu” field, required.
○ Chức vụ: Quản trị viên
● System validates the new account’s information:
○ Success: System creates a new admin account based on the information
provided and has the “Kích hoạt” status, displays the success message and
close modal.
○ Fail: System shows an error message based on the Admin’s actions.

117
● Alternative Flow:

Actor Action System Response

Admin clicks outside the modal System close account create modal.
to close the account create
modal
● Business rules:

○ Admin can create the Admin account only.

○ Admin can only create another 1 admin account each time.

○ Admin accounts don’t have profile data.

○ Passwords must have at least 8 characters, at least 1 letter, and 1 number.

○ An admin account can only be created by another admin user.

● Exceptions:

Cause System Response

Required fields are missing The system shows error messages for each
missing field.

Required information fields The system shows error messages for each not
are not valid. valid field.

3.4.2.4 Reset Password


● Function trigger: Admin wants to change the password of an account by clicking the “Đổi
mật khẩu” button on the selected account in the ”Manage Accounts” page.
● Function description: This feature allows Admin to update the password of the selected
account.
● Screen layout:

118
● Function details:
● Pre-condition:
○ Admin already has an account in the Admin System.
○ Admin is currently on the ”Manage Accounts” page.
● Flow:
○ Admin clicks the “Đổi mật khẩu” button of a specific account item on the
account list shown in the table on the ”Manage Accounts” page.
○ System opens “Password Reset” modal.
○ Admin fills in new password information to update the password.
○ After the validation step, the system will change the password of the
selected account.
● Data inputs:
○ Mật khẩu mới: must have at least 8 characters, at least 1 letter and 1
number, required.
○ Xác nhận mật khẩu: must be the same as “Mật khẩu” field, required.
● System validates the resolving content:
○ Success: System updates the password and shows the successful message.
○ Fail: System shows the error message.
● Alternative Flow:

Actor Action System Response

119
Admin clicks outside the modal System close “Thay đổi mật khẩu” modal.
to close the “Thay đổi mật
khẩu” modal.
● Business rules:

○ The account that is reset password will automatically be logged out of the
system.

● Exceptions:

Cause System Response

Required fields are missing The system shows error messages for each missing
field.

Required information The system shows error messages for each not valid
fields are not valid. field.

3.4.2.5 Update Account Status


● Function trigger: Admin wants to change account status by:
○ Clicking the “Vô hiệu hóa” or “Kích hoạt lại” button on the selected account in the
”Manage Accounts” page.
○ Clicking the “Vô hiệu hóa” or “Kích hoạt lại” button on the selected “Profile Detail”
drawer when clicking the “Xem chi tiết tài khoản” button at the ”Manage Profiles”
page.
● Function description: This feature allows the actor to deactivate an account, preventing the
user from logging into a User System or Admin System or reactive selected account so that
account can log again into the system.
● Screen layout:

120
● Function details:
● Pre-condition:
○ Admin already has an account in the Admin System.
○ Admin is currently on the ”Manage Accounts” page.
● Flow:
○ Admin clicks the “Vô hiệu hóa” or “Kích hoạt lại” button of a specific account
item on the account list shown in the table on the ”Manage Accounts” page.
○ System opens “Update Account Status” modal.
○ Admin clicks confirm button to send the request to update the account’s
status
○ The system will update the status of the selected account.
● System shows confirm dialog and two buttons for Admin to select:
○ Vô hiệu hóa or Kích hoạt: button
○ Hủy: button
● System change status of account:
○ Success: System updates the status of an account and shows the successful
message.
○ Fail: System shows the error message.
● Alternative Flow:

Actor Action System Response

121
Admin clicks outside the modal System closes the “Update Account Status”
to close the “Update Account modal.
Status” modal.
● Business rules:

○ The user’s account after being changed status to “Vô hiệu hóa” will logout of
the User System and can not access the system.

○ “Trạng thái” field only has 2 states “Vô hiệu hóa” and “Kích hoạt”

○ In case the account is logging into the system will automatically log out of the
system if the status of that account is changed from “Kích hoạt” to “Vô hiệu
hóa”.

○ Admin can not change the status of their own account

3.4.3 Manage Profile

3.4.3.1 Get Profile List


● Function trigger: Admin wants to view all profiles by clicking on the “Hồ sơ tài khoản” item
in the sidebar.
● Function description: This feature allows the Admin to get the list of profiles by clicking on
the “Hồ sơ tài khoản” item on the left sidebar.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Existed at least 1 account’s profile.

122
● Flow:
○ Admin sends the request to view the list of profiles.
○ System displays the profile list on the screen.
● Admin can view the table containing the list of the account information:
○ #: number
○ Tên: text, image.
○ Số cuộc gọi: number.
○ Thời lượng gọi: text.
○ Thời lượng mỗi cuộc gọi: text.
○ Tỉ lệ hủy hàng chờ: number.
○ Được đánh giá: number.
○ Đánh giá: number.
○ MBTI type: text.
○ Trạng thái: text.
○ Ngày tạo: text.
○ Xem chi tiết hồ sơ: button.
○ Xem chi tiết tài khoản: button.
● System gets profile list:
○ Success: system display profile list.
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:

○ The list is default sorted by the “Số cuộc gọi” field in descending order.

○ Search criteria for the account list contains: search by username, search by
“tên”, filter by “trạng thái”, and MBTI type.

○ List can be sorted by “thời lượng cuộc gọi”, “Thời lượng mỗi cuộc gọi”, “Tỉ
lệ hủy hàng chờ”, “Được đánh giá”, “Đánh giá”, “Ngày tạo” fields.

● Exceptions:

Cause System Response

No existing profile in the System show “Không có dữ liệu” message.


database.

3.4.3.2 Get Profile Detail


● Function trigger: Admin wants to view the profile information by clicking the “Xem chi tiết
hồ sơ” button of a specific profile on the “Manage Profiles” page.

123
● Function description: This feature allows the Admin to get details of the selected profile
information.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Admin is currently on the “Manage Profiles” page.
● Flow:
○ Admin sends the request to view details of a specific profile.
○ System opens the “Profile Detail” drawer to display the current information
about the selected profile.
● Admin can view details of selected profile:
○ Basic profile information:
■ Account’s avatar: image.
■ Nickname: text.
■ Ngày sinh: text, DD/MM/YYYY format.
■ Xu hướng tính dục: text.
■ Chiều cao: text.
■ Quên quán: text.
■ Công việc: text.
■ Chuyên ngành: text.
■ Ngôn ngữ: text.
■ Sở thích: text.

124
■ Kiểu tính cách: text.
■ Trạng thái: text.
■ Số bài kiểm tra tính cách đã thực hiện: number.
■ Số bạn bè: number.
■ Số bài đăng: number.
○ Profile’s statistics data:
■ Số cuộc gọi: number.
■ Số lần hủy hàng chờ: number.
■ Tỉ lệ bỏ hàng chờ: number.
■ Tổng thời lượng cuộc gọi: number.
■ Thời lượng trung bình 1 cuộc gọi: number.
■ Thời lượng trung bình 1 hàng chờ (thành công): number.
■ Thời lượng trung bình 1 hàng chờ (thất bại): number.
■ Được đánh giá: number.
■ Đánh giá: number.
○ Profile’s keyword data:
■ Keyword: text.
■ Lượt đánh giá: number.
● System gets details of the selected profile:
○ Success: system displays details of the selected profile.
○ Fail: system shows the error message based on the Admin’s action.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System close profile drawer.


drawer to close the profile
drawer.
● Business rules:

○ Profiles that don't have statistics data will be hidden in the statistics box.

○ The keyword statistics will include 24 keyword tags.

3.4.4 Manage Constructive Questions And Answers

3.4.4.1 Get Constructive Question List


● Function trigger: Admin wants to get the constructive question list by clicking the “Câu
hỏi/trả lời kiến tạo” item in the sidebar.

125
● Function description: This feature allows the Admin to see the title, answer, date created,
and question’s status.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Existed at least 1 constructive question.
● Flow:
○ Admin sends the request to view the list of constructive questions.
○ System displays the constructive question list.
● Admin can view the list of constructive questions:
○ #: number.
○ Tiêu đề câu hỏi: text.
○ Số câu trả lời: number.
○ Số lần hiển thị: number.
○ Trạng thái: text.
○ Ngày tạo: text.
○ Xem chỉnh sửa: button.
○ Vô hiệu hóa: button.
● System gets the list of constructive questions:
○ Success: system displays the list of constructive questions.
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:

126
○ The constructive question list is default sorted by the “Ngày tạo” field in
descending order.

○ Search criteria for the constructive questions list are: search by question title.

● Exceptions:

Cause System Response

No existing question in the System show “Không có dữ liệu” message.


database.

3.4.4.2 Get Constructive Question Detail


● Function trigger: The Admin wants to get constructive question detail by clicking the
“Xem/chỉnh sửa” button of the selected question on the “Manage Constructive Questions”
page.
● Function description: This feature allows the Admin to get a call question information.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Admin is currently in the “Manage Constructive Questions” page.
● Flow:
○ Admin sends the request to view details of the selected constructive
question.
○ System displays the current information about the constructive question
● Admin can view detail of the selected constructive question:

127
○ ID: text.
○ Ngày tạo: text.
○ Trạng thái: text.
○ Tiêu đề: text.
○ Câu trả lời: text.
● System gets the detail of the selected constructive question:
○ Success: system displays the detail of the selected constructive question.
○ Fail: system shows the error message based on the Admin’s action.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System close question detail drawer.


drawer to close the question
detail drawer.
● Business rules: N/A

3.4.4.3 Update Constructive Answers


● Function trigger: Admin wants to update the answer to the constructive question by
changing the old answer on the selected “Constructive Question Detail” drawer.
● Function description: This feature allows the Admin to update the answers to the selected
constructive question.
● Screen layout:

● Function details:
● Pre-condition:

128
○ Admin has already logged into the system.
○ Admin is currently in the selected “Constructive Question Detail” drawer.
● Flow:
○ Admin changes the text in the input field of the answer wanted to change
and clicks the “✔” button to update.
○ System replaces the old answer with the new currently updated one.
● System validates the resolving content:
○ Success: The system updates the answer to a question and shows the
successful message.
○ Fail: The system shows an error message based on the Admin’s actions.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System closes the “Constructive Question Detail”
drawer to close the drawer.
“Constructive Question Detail”
drawer.
● Business rules:

○ Only can update answers when the new answer is different from the old one.
If the new answer is the same as the new one, the update button will be
disabled.

○ The data of old answers that were used in the past will not change.

○ Answer’s length limit must be in the range of 1 – 500 characters.

○ The answer can only update after being validated by the system with no fault
found.

● Exceptions:

Cause System Response

Required fields are missing The system shows error messages for each missing
field.

Required information The system shows error messages for each not valid
fields are not valid. field.

3.4.4.4 Create Constructive Answer


● Function trigger: The Admin wants to create a new answer to a question by clicking the “+
Câu trả lời” button on the selected “Constructive Question Detail” drawer.

129
● Function description: This feature allows the Admin to create new answers to the selected
constructive question.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Admin is currently in the selected “Constructive Question Detail” drawer.
● Flow:
○ Admin clicks to “+ Câu trả lời ”.
○ Admin fills in the input field and clicks the “✔” button to create more
answers.
○ System appends new input at the end of the list of answers.
● System validates the resolving content:
○ Success: system stores the new question and shows the successful message.
○ Fail: system shows an error message based on the Admin’s actions.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System closes the “Constructive Question Detail”
drawer to close the drawer.
“Constructive Question Detail”
drawer.
● Business rules:

130
○ Users can only create a maximum of 5 answers.

○ Answer’s length limit must be in the range of 1 – 500 characters.

○ The new answer must be different from answers existing in the same
question.

○ The answer can only be created after being validated by the system with no
fault found.

● Exceptions:

Cause System Response

Required fields are missing The system shows error messages for each missing
field.

Required information The system shows error messages for each not valid
fields are not valid. field.

3.4.4.5 Delete Constructive Answer


● Function trigger: The Admin wants to delete the answer to the selected constructive
question by clicking the “Trash” icon button of the specific answer.
● Function description: This feature allows Admin to delete the answer to the selected
constructive question.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.

131
○ Admin is currently in the selected “Constructive Question Detail” drawer.
● Flow:
○ Admin clicks on the icon trash button to send the request to remove the
selected answer.
○ System removes the selected answer from the list.
● System validates the resolving data:
○ Success: system removes the answer and shows the successful message.
○ Fail: system shows an error message based on the Admin’s actions.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System closes the “Constructive Question Detail”
drawer to close the drawer.
“Constructive Question Detail”
drawer.
● Business rules:

○ Admin can not continue to delete answers if there existed two or fewer
answers in the specific constructive question.

3.4.4.6 Create Constructive Question


● Function trigger: The Admin wants to create new a question by clicking the “+ Tạo câu hỏi”
button on the “Manage Constructive Questions” page.
● Function description: This feature allows the Admin to create new questions.
● Screen layout:

132
● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Admin is currently on the “Manage Constructive Questions” page.
● Flow:
○ Admin clicks on the “+ Tạo câu hỏi” button.
○ System displays the ”Constructive Question Create” drawer.
○ Admin fills in constructive question and 2 answers information to send the
request to create a new constructive question.
○ System adds the currently created constructive question into the
constructive question list.
● System validates the resolving content:
○ Success: The system stores the new constructive question and shows the
successful message.
○ Fail: The system shows an error message based on the Admin’s actions.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System closes the ”Constructive Question


drawer to close the Create” drawer.
”Constructive Question
Create” drawer.
● Business rules:

○ Question’s title length limit must be in the range of 1 – 500 characters.

○ Answer length limit must be in the range of 1 – 500 characters.

○ Each constructive question has at least 2 answers and the maximum is 5


answers.

● Exceptions:

Cause System Response

Required fields are missing The system shows error messages for each
missing field.

Required information fields are The system shows error messages for each not
not valid. valid field.

133
3.4.4.7 Change Constructive Question Status
● Function trigger: The Admin wants to change the selected constructive question status by:
○ Clicking the “Vô hiệu hóa” or “Kích hoạt” button on the “Manage Constructive
Questions” page.
○ Clicking the “Vô hiệu hóa” or “Kích hoạt” button on the selected ”Constructive
Question Detail” drawer.
● Function description: This feature allows the Admin to deactivate an account, preventing
questions from being used in the User System or reactive the selected constructive question
so that that question can be used again in the User System.
● Screen layout:

● Function details:

134
● Pre-condition:
○ Admin has already logged into the system.
● Flow:
○ Admin clicks on the “Vô hiệu hóa/Kích hoạt” button.
○ System opens the “Constructive Question Status Update” modal.
○ Admin clicks confirm button to send the request to update the selected
constructive question status
○ The system will update the status of the selected constructive question.
● System popups the confirm modal:
○ Admin clicks on the “Vô hiệu hóa/Kích hoạt” button: The question status
from “Kích hoạt” to “Vô hiệu hóa”.
○ Admin clicks on the “Hủy” button: Close the confirm modal.

● Alternative Flow:

Actor Action System Response

Admin clicks outside the modal System closes the “Constructive Question Status
to close the “Constructive Update” modal.
Question Status Update”
modal.
● Business rules:

○ Status of question only have 2 states: “Kích hoạt” and “Vô hiệu hóa”.

○ Constructive questions that have “Vô hiệu hóa” status still can be updated
and deleted answers inside but can not be used in User System.

3.4.5 Manage Call History

3.4.5.1 Get Call History List


● Function trigger: The actor wants to view all call histories in the system by clicking the “Lịch
sử cuộc gọi” item on the sidebar.
● Function description: This feature allows the Admin to get the list of call history in the
system.
● Screen layout:

135
● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Existed at least 1 call history.
● Flow:
○ Admin clicks on the “Lịch sử cuộc gọi” item in the sidebar.
○ System displays the list of call history on the screen.
● Admin can view the table containing the list of the call history:
○ Người tham gia #1: image, text.
○ Người tham gian #2: image, text.
○ Thời lượng: text.
○ Độ tương thích: number.
○ Lý do kết thúc: text.
○ Thời gian tạo: text.
○ Chi tiết cuộc gọi: button.
● System gets call history list:
○ Success: system displays the call history list
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:

○ The list is default sorted by the “Ngày tạo” field in descending order.

○ If the call history end reason is “Hủy hàng chờ”, the following information
will not show:

■ Người tham gia #2

136
■ Thời lượng
■ Độ tương hợp.

○ If the caller does not join answer the question game, “Độ tương hợp”
information will not show.

○ Search criteria include: search by product name of users in call history, filter
by “Lý do kết thúc”.

○ List can be sorted by “thời lượng cuộc gọi”, “Thời lượng”, “Độ tương hợp”,
“Thời gian tạo” fields.

● Exceptions:

Cause System Response

No existing call history in System show “Không có dữ liệu” message.


the database.

3.4.5.2 Get Call History Detail


● Function trigger: The Admin wants to view call history details by clicking the “Chi tiết cuộc
gọi” button of specific call history on the “Manage Call Histories” page.
● Function description: This feature allows the Admin to get call history detail.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Admin is currently on the “Manage Call Histories” page.

137
● Flow:
○ Admin clicks on the “Chi tiết cuộc gọi” button.
○ System displays details of the selected call history.
● Admin can view details of the selected call history:
○ Basic information:
■ Thời lượng: text.
■ Ngày thực hiện: text.
■ Người kết thúc: text.
■ Mức độ hợp nhau: text.
○ Information of users in the call history:
■ Avatar: image.
■ Giới tính: icon.
■ Đánh giá: text.
■ Thời lượng hàng chờ: text
■ Tiêu chí tìm kiếm cuộc gọi:
● Giới tính: text.
● Độ tuổi: text.
● Vùng miền: text.
● Chủ đề: text.
● Ngôn ngữ: text.
● Xu hướng tính dục: text.
○ Constructive questions information:
■ Question title: text.
■ Answer: text
○ Đóng: button.
● System gets the detail of the selected call history:
○ Success: system displays the details of the selected call history.
○ Fail: system shows the error message based on Admin’s action.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System closes the “Call History Detail” drawer.
drawer to close the “Call
History Detail” drawer.

● Business rules:

138
○ If the call history end reason is “Hủy hàng chờ”, caller 2 information will not
show.

○ If the caller does not join answer the question game, “Người chơi không
tham gia” will display on the “Câu hỏi kiến tạo” section.

3.4.6 Manage Order History

3.4.6.1 Get Order History List


● Function trigger: The Admin wants to view the order history list.
● Function description: This feature allows the Admin actor to get an order history list.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Existed at least 1 order.
● Flow:
○ Admin clicks on the “Đơn hàng” item in the sidebar.
○ System displays the list of orders on the screen.
● Admin can view the table containing the list of orders.
○ ID: text.
○ Người sở hữu: image, text.
○ Mô tả & số lượng: text.
○ Tổng tiền: number.
○ Trạng thái: text.

139
○ Tạo lúc: text.
○ Chi tiết đơn hàng: button.
○ Thông tin giao dịch: button
● System gets order list:
○ Success: system displays the order list.
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:

○ The list is default sorted by the “Ngày tạo” field in descending order.

○ Search criteria include: search by name of users, filter by “Trạng thái”.

○ “Trạng thái” field has 3 value: “Thành công”, “Hủy”, “Đang thực hiện”.

● Exceptions:

Cause System Response

No existing order in the System show “Không có dữ liệu” message.


database.

3.4.6.2 Get Order History Detail


● Function trigger: The Admin wants to view order history detail.
● Function description: This feature allows the Admin to get order history detail.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Existed at least 1 order.

140
● Flow:
○ Admin clicks on the “Chi tiết đơn hàng” item in the sidebar.
○ System displays the list of orders on the screen.
● Admin can view order information:
○ ID: text.
○ Người thực hiện: image, text.
○ Tổng tiền: number, money format.
○ Trạng thái: text.
○ Trạng thái: text.
○ Ngày tạo: text.
○ Danh sách các gói dịch vụ.
○ Đóng: button.
● System gets details of the selected order:
○ Success: system displays the order information.
○ Fail: system shows the error message based on the Admin’s action.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System close order detail drawer.


drawer screen to close the
order detail drawer
● Business rules: N/A

3.4.7 Manage Payment History

3.4.7.1 Get Payment History List


● Function trigger: The Admin wants to view the payment history list.
● Function description: This feature allows the Admin actor to get a payment history list.
● Screen layout:

141
● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Existed at least 1 payment.
● Flow:
○ Admin clicks on the “Lịch sử giao dịch” item in the sidebar.
○ System displays the list of payments on the screen.
● Admin can view the table containing the list of payments.
○ ID: text.
○ Cổng thanh toán: text.
○ Mô tả: text.
○ Tổng tiền: number.
○ Trạng thái: text.
○ Thời gian tạo: text.
○ Chi tiết giao dịch: button.
○ Thông tin đơn hàng: button
● System gets payment list:
○ Success: system displays the payment list.
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:

○ The list is default sorted by the “Ngày tạo” field in descending order.

○ Search criteria include: filter by “Cổng thanh toán” and filter by “Trạng thái”.

○ “Trạng thái” field has 3 value: “Thành công”, “Thất bại”, “Đang giao dịch”.

142
● Exceptions:

Cause System Response

No existing payment in the System show “Không có dữ liệu” message.


database.

3.4.7.2 Get Payment History Detail


● Function trigger: The Admin wants to view payment history details.
● Function description: This feature allows the Admin to get payment history details.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Existed at least 1 payment.
● Flow:
○ Admin clicks on the “Chi tiết giao dịch” item in the sidebar.
○ System displays the list of payments on the screen.
● Admin can view payment information:
○ Basic information:
■ ID: text.
■ Cổng thanh toán: text
■ Mô tả: text.
■ Đơn vị: text.
■ Trạng thái: text.

143
■ Ngày tạo: text
○ Information of gateway:
■ RefID: text.
■ Số tiền: number, money format.
■ Đơn vị: text.
■ bankCode: text.
■ Loại thanh toán: text.
■ CardType: text.
■ ipArr: text.
■ Tạo lúc: text.
■ Tồn tại đến: text.
■ Thanh toán lúc: text.
■ respCode: text.
■ Status: text.
○ Đóng: button.
● System gets details of the selected payment:
○ Success: system displays the payment information.
○ Fail: system shows the error message based on the Admin’s action.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System close payment detail drawer.


drawer screen to close the
payment detail drawer

3.4.8 Manage MBTI test

3.4.8.1 Get MBTI Test List


● Function trigger: The Admin wants to get the MBTI test list by clicking on the “Trắc nghiệm
tính cách” item in the sidebar.
● Function description: This feature allows the Admin to get the MBTI test list.
● Screen layout:

144
● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Admin is currently on the “Manage MBTI Tests” page.
● Flow:
○ Admin clicks on the “Trắc nghiệm tính cách” item in the sidebar.
○ System displays the MBTI test list.
● Admin can view the MBTI test list with the following information:
○ #: number.
○ Người thực hiện: image, text.
○ Số câu trả lời: number.
○ Kết quả: text.
○ Trạng thái: text.
○ Thời gian tạo: text.
○ Chi tiết: button.
● System gets MBTI test list:
○ Success: system displays the MBTI test list.
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:

○ The list is default sorted by the “Thời gian tạo” field in descending order.

○ Search criteria include: filter by “Nhóm tính cách” and “Trạng thái” and
Name of user.

145
○ “Trạng thái” field has 3 value: “Thành công”, “Chưa hoàn tất”, “Chờ xử lý”.

3.4.8.2 Get MBTI Test Detail


● Function trigger: The Admin wants to view the details of the MBTI test by clicking the “Chi
tiết” button on the “Manage MBTI Tests” page.
● Function description: This feature allows the Admin to get MBTI detail.
● Screen layout:

● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Admin is currently on the “Manage MBTI Tests” page.
● Flow:
○ Admin clicks on the “Chi tiết” button.
○ System displays the details of the selected MBTI test information.
● Admin can view details of the selected MBTI test information:
○ Basic MBTI test information:
■ ID: text
■ Người thực hiện: image, text.
■ Số câu hỏi: number.
■ Kết quả: text.
■ Trạng thái: text.
■ Ngày tạo: text
○ List of MBTI questions and the answer of each question:

146
■ Question title: text.
■ Answer: text.
● Alternative Flow:

Actor Action System Response

Admin clicks outside the System closes the “MBTI Test Detail” drawer.
drawer to close the “MBTI Test
Detail” drawer.

● Business rules:

○ Only MBTI tests with the “Hoàn tất” state has the result.

3.4.9 Statistics

3.4.9.1 View Statistics Data


● Function trigger: The Admin wants to view the statistics data of the system by clicking on the
“Trang chủ” item in the sidebar.
● Function description: This feature allows the Admin to view the statistics data of the User
System.
● Screen layout:

147
● Function details:
● Pre-condition:
○ Admin has already logged into the system.
○ Users in the User System have already rated after call and use constructive
questions while calling
● Flow:
○ Admin clicks on the “Trang chủ” item in the sidebar.
○ System displays statistics data of the User System.
● Admin can view the statistics data with the following information:

148
○ 4 statistics cards about:
■ Number of currently online users in the User System: number
■ Number of the current users finding call: number.
■ Number of the current users in the call: number.
■ The average rating: number.
○ 8 Chart about:
■ Số cuộc gọi
■ Số cuộc gọi/người dùng
■ Thời lượng cuộc gọi
■ Thời lượng cuộc gọi/người dùng
■ Thời lượng trung bình mỗi cuộc gọi
■ Tỉ lệ hủy hàng chờ
■ Thông số hàng chờ
■ Thông số thời lượng chờ
○ Top 20 constructive questions is used most:
■ #: number.
■ Tiêu đề: text.
■ Số câu trả lời: number.
■ Lượt hỏi: number.
■ Trạng thái: text.
■ Xem chi tiết câu trả lời: button.
○ Top rating keywords are used most:
■ Keyword: text.
■ Lượt đánh giá: number.
● System gets statistics data:
○ Success: system displays statistics data on the screen.
○ Fail: system shows the error message based on the Admin’s action.
● Business rules:
○ Admin can filter the statistics data on the chart by: week, month, half year,
year and total
○ Rating keywords are default sorted by descending based on the number of
reviews.

149
4. Non-Functional Requirements
4.1 External Interfaces
4.1.1 User interface
● User interface must be user-friendly.
● User interface must be responsive in order to fit on multiple device screen from desktop to
mobile
● Fonts, and colors must follow a theme structure and have meaning
● Icons should be included to present the meaning of action

4.1.2 Communication interface


● HTTPS Protocol is used for communication between Web Application and server.
● WebSocket Protocol is used for real-time communication between Web Application and
server.

4.2 Quality Attributes


4.2.1 Usability
● Nice user interface and user-friendly. Colors, fonts, and icons should be in harmony, follow a
theme, and have meaning
● Dashboard features should be realistic and support administration works

4.2.2 Flexibility
● User web application must be able to run on different devices
● Easy to access, and serve marketing, product trial without needing to download

4.2.3 Security
● Important input data are validated before saving to the database.
● User only able to access resources when having suitable permission, and role.
● WebSocket/HTTP requests must be authenticated and authorized when accessing private
resources.

150
IV. Software Design Description

1. System Design
1.1 System Architecture
1.1.1 Overall System Architecture

Figure 9: Overall System Architecture .

151
1.1.2 Detail System Architecture

1.1.2.1 User Web Application Sub-system

Figure 10: Detail System Architecture - User Web Application Sub-system.

1.1.2.2 Backend WebAPI Sub-system

Figure 11: Detail System Architecture - Backend WebAPI Sub-system.

152
1.2 Component Diagram

Figure 12: Component Diagram.

153
1.3 Package Diagram
1.3.1 Front-end Package Diagram

Figure 13: Front-end Package Diagram.

No Package Description

The package contains classes that are in charge of common


1 Component
interface components.
The package contains classes responsible for the structure
2 Pages of web application routing and combines components into
a complete interface.
The package contains classes for common methods
3 Hooks
connected with the state of the component.
The package contains classes responsible for sharing states
4 Store
used in the application.

154
The package contains classes that provide common
5 Utils
methods for application usage.
The package provides classes that are in charge of sending
6 Services
HTTP requests and receiving server responses.
Table 21: Front-end Package Diagram .

155
1.3.2 Back-end Package Diagram

Figure 14: Back-end Package Diagram.

No Package Description

This large package contains every single feature package


1 features This is feature-based since controllers, services,
repositories, modules, models, and schemas are defined in

156
each smaller package
Table 22: Back-end Package Diagram .

157
2. Database Design
2.1 Collections Relationship

Figure 15: Database Diagram.

158
The above database diagram is the physical data layer of the Destinee system. We have changed
many parts from the ERD in the logical layer:
● In order to increase performance, we reduce join between collections.
● Most will not use tables with a one-to-one relationship. Instead, since MongoDB supports
embedded documents, it's easy to see that's heavily leveraged here. Specifically collection
profiles, callHistories, and callQuestions
For read optimization, this also leads to duplicate data, but this is what we expected
Specifically, the statistics collection is used to store the account's statistics for each day. If the
requirement is to get the overall statistics of the profile, we can get all the record statistics of that
profile and then sum or group it together
Here, since this request happens frequently, which is costly in performance, we have put a collection
statistics inside the profiles collection which contains overall statistics to make reading faster.
2.2 Data Dictionary
2.2.1 Collection accounts
Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
uid string id generated from firebase X X
authentication
email string X X
role string Is a data fields with 2 enum X
values:
● ADMIN
● USER
profile objectId FK
upgrade object
upgrade.package string X
upgrade.expiresDate date X
disabled bool If the value of disable field X
is true then the user will
not be able to login or
perform any function with
the system
createdAt date X X
updatedAt date X X
Table 23: Data Dictionary - Collection accounts.

2.2.2 Collection registrators


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
uid string id generated from firebase X X
authentication
name string
nickname string
origin string Is a data fields with 10
enum values:
● NORTH_VIETNAM

159
● MIDDLE_VIETNAM
● SOUTH_VIETNAM
● HA_NOI
● HO_CHI_MINH
● CAN_THO
● KIEN_GIANG
● TIEN_GIANG
● BAC_NINH
● QUANG_NGAI
birthdate string
gender bool
sex string Is a data fields with 3
enum values:
● STRAIGHT
● TOP
● BOT
avatar objectId FK
job string Is a data fields with 3
enum values:
● STUDENT
● WORKER
● SUPPORTER
workAt string
major string
height int
languages string[] Is a data fields with list of
one of 5 enum values:
● VIETNAMESE
● ENGLISH
● FRENCH
● GERMAN
● JAPANESE
hobbies string[]
isFinished bool the value of isFinished is
used to check if the user
has completed the
registration process or not.
If isFinished is true then
the user has completed
the registration
createdAt date X X
updatedAt date X X
Table 24: Data Dictionary - Collection registrators.

2.2.3 Collection callQuestions


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
title string Title of the question X X
answers array Answers of the question X
answers._id objectId X X

160
answers.title string X
answers.selectedCou int Number of times selected X
nt for that answer
viewCount int Number of times the X
question was viewed
disabled bool If the value of disable field X
is true, the question will
not be used in the User
System
createdAt date X X
updatedAt date X X
Table 25: Data Dictionary - Collection callQuestions.

2.2.4. Collection statistics


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
owner objectId X FK
callCount int Number of calls made in 1 X
day by users in the system
callDuration int Call time in 1 day of user X
succeededCallCount int X
meanCallDuration int Average call time per day X
of users
queueCount int X
meanQueueDuration int X
succeededQueueCo int Number of times users X
unt successfully matching
meanSucceededQue int Average 1-day wait time X
ueDuration for a successful matching
with another user
droppedQueueCoun int Number of dropped X
t queue performed in 1 day
by users in the system
meanDroppedQueue int Average time it takes a X
Duration user to decide to give up
looking for someone to
matching with
droppedQueueRatio int Dropped Queue Ratio in 1 X
day by users in the system
createdAt date X X
updatedAt date X X
Table 26: Data Dictionary - Collection statistics.

2.2.5 Collection notifications


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
owner objectId Owner of the notification X FK
isSeen bool The status of the X
notification indicates
whether or not this

161
notification has been
detailed by the user
isArchived bool The status of the message X
indicates whether the
message has been viewed
by the user
type string Is a data fields with 4 X
enum values:
● DIRECT_MESSAGE
● FRIEND_REQUEST
● FRIEND_REQUEST_A
CCEPTED
● ANONYMOUS_MESS
AGE
data object Data of notification
data.id objectId
data.profile objectId FK
data.profileName string
data.content string
createdAt date X X
updatedAt date X X
Table 27: Data Dictionary - Collection notifications.

2.2.6 Collection callHistories


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
callerOne object Caller one of the Call X
history
callerOne.profile objectId X FK
callerOne.rates int
callerOne.review string[]
callerOne.queue int Time spent by the user to X
Time be able to match with the
rest of the user in the call
callerOne.filter object Criteria the user chooses X
to be able to be paired
with the other person on
the call
filter.gender bool X
filter.origin string
filter.ageRange int X
filter.topic string
filter.language string
filter.sex string
callerTwo object X
callerTwo.profile objectId X FK
callerTwo.rates int
callerTwo.review string[]

162
callerTwo.queueTim int X
e
callerTwo.filter object X
filter.gender bool X
filter.origin string
filter.ageRange int[] X
filter.topic string
filter.language string
filter.sex string
participants objectId[] X
questions array Constructive questions of
the call history
questions.question objectId X FK
questions.title string X
questions.answers array X
questions.answers.a objectId X FK
nswer
questions.answers.ti string X
tle
questions.callerOne objectId
AnswerId
questions.callerTwo objectId
AnswerId
matchingPercentage int The compatibility of 2
users after completing
the construction
questions
length int Length of the call history
endReason array
endReason.ender objectId X FK
endReason.reason string Is a data fields with 3 X
enum values:
● NORMAL_END
● NO_CONNECTION
● STOP_FINDING
accessAllowedPartici objectId[]
pants
createdAt date X X
updatedAt date X X
Table 28: Data Dictionary - Collection callHistories.

2.2.7 Collection friendRequests


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
requester objectId X FK
verifier objectId X FK
status string Is a data fields with 4 X
enum values:
● PENDING
● ACCEPTED

163
● DENIED
● CANCELED
participants objectId[] X
createdAt date X X
updatedAt date X X
Table 29: Data Dictionary - Collection friendRequests.

2.2.8 Collection mbtiTests


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
owner objectId X FK
answers array X
answers.questionId int X
answers.answer string X
answeredCount int Number of questions that X
user made out of 32 MBTI
questions
resultType string Result type of the MBTI
Test. The result will be 1
of the 16 types of MBTI
processingState string Is a data fields with 5 X
enum values:
● NOT_READY
● PENDING
● PROCESSING
● SUCCEED
● FAILED
createdAt date X X
updatedAt date X X
Table 30: Data Dictionary - Collection mbtiTests.

2.2.9 Collection images


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
owner objectId FK
name string X X
size int X
format string Is a data fields with 7 X
enum values:
● ORIGINAL
● RESIZED
● SQUARE
● BLUR
● BLUR_RESIZED
● BLUR_SQUARE
● BLUR_PIXELATE
types array Types of the image
types.fileName string X
types.format string X
createdAt date X X

164
updatedAt date X X
Table 31: Data Dictionary - Collection images.

2.2.10 Collection posts


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
owner objectId X FK
image objectId Post must be a image FK
status string Is a data fields with 3 X
enum values:
● AVAILABLE
● ARCHIVED
● DELETED
viewCount int The number of times the X
post was viewed
createdAt date X X
updatedAt date X X
Table 32: Data Dictionary - Collection posts.

2.2.11 Collection conversations


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
seen objectId[] Variable used to check X
which of the 2 users of
the conversation seen
lastMessage string
lastMessageAt date
participants objectId[] X
createdAt date X X
updatedAt date X X
Table 33: Data Dictionary - Collection conversations.

2.2.12 Collection messages


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
content string X
sender objectId X FK
conversation objectId X FK
participants objectId[] X
createdAt date X X
updatedAt date X X
Table 34: Data Dictionary - Collection messages.

2.2.13 Collection profiles


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
account objectId X X FK
name string X
nickname string X
username string X X

165
avatar objectId FK
personalInfo object X
personalInfo.origin string X
personalInfo.birthda date X
te
personalInfo.gender bool X
personalInfo.sex string X
personalInfo.job string
personalInfo.workAt string
personalInfo.major string
personalInfo.height int
personalInfo.langua string[]
pes
personalInfo.hobbie string[]
s
personalInfo.favorit array
eSongs
favoriteSongs.id int X
favoriteSongs.path string X
favoriteSongs.title string X
favoriteSongs.artist string
favoriteSongs.thum string
bnailPath
favoriteSongs.releas string
eDate
personalInfo.favorit array
eMovies
favoriteMovies.id string X
favoriteMovies.title string X
favoriteMovies.origi string X
nalTitle
favoriteMovies.back string
dropPath
favoriteMovies.post string
erPath
favoriteMovies.rele string
aseDate
profilePageSetting object Object is used to define X
what users want to display
on their profile
profilePageSetting string X
.displayName
profilePageSetting bool X
.age
profilePageSetting bool X
.height
profilePageSetting bool X
.origin
profilePageSetting bool X
.jobStatus

166
profilePageSetting bool X
.languages
profilePageSetting bool X
.hobbies
profilePageSetting bool X
.sex
profilePageSetting string
.bio
callSetting object Object is used to define X
what users want to display
to another user when
calling
callSetting.displayN string X
ame
callSetting.age bool X
callSetting.height bool X
callSetting.origin bool X
callSetting.jobStatus bool X
callSetting.language bool X
s
callSetting.hobbies bool X
callSetting.sex bool X
mbtiResult object
mbtiResult.type string X
mbtiResult.category string
mbtiTests objectId[] X FK
friends objectId[] Friend Id of the profile X FK
posts objectId[] Post Id of the profile X FK
statistics object Statistics data of profile X
statistics.callCount int X
statistics.callDuratio int X
n
statistics.succeeded int X
CallCount
statistics.meanCallD int X
uration
statistics.queueCou int X
nt
statistics.meanQueu int X
eDuration
statistics.succeeded int X
QueueCount
statistics.meanSucc int X
eededQueueDuratio
n
statistics.droppedQ int X
ueueCount
statistics.meanDrop int X
pedQueueDuration

167
statistics.droppedQ int X
ueueRatio
statistics.ratedRatio int Ratio rated of after calling X
in 1 day of profile
statistics.ratedCoun int Percentage of users who X
t rated the call each time
the call ended in 1 day
statistics.ratingRatio int Rate at which users rate X
the call each time it ends
in 1 day
statistics.ratingCoun int Number of call reviews in X
t 1 day of profile
statistics.keywordsR object X
eviewed
keywordsReviewed string keywords that users are X
.keyword rated by other users in 1
day
keywordsReviewed int Number of times users are X
.count rated by keywords
Statistics.keywordsR object X
eviewing
keywordsReviewing. string X
keyword
keywordsReviewing. int X
count
disable bool X
registrationTokens array Registration Tokens X
registrationTokens string Token issued by firebase X
.token
registrationTokens date X
s.initializeAt
createdAt date X X
updatedAt date X X
Table 35: Data Dictionary - Collection profiles.

2.2.14 Collection orders


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
owner objectId X FK
payment objectId FK
items array X
items.service string X
items.amount int X
items.price int X
totalPrice int X
status string Is a data fields with 3 X
enum values:
● ON_PROGRESS
● SUCCEEDED
● CANCELED

168
createdAt date X X
updatedAt date X X
Table 36: Data Dictionary - Collection orders.

2.2.15 Collection payments


Field Name Type Description Unique Not Null PK/FK
_id objectId X X PK
order objectId X FK
gateway string X
description string X
currency string X
amount int X
status string Is a data fields with 3 X
enum values:
● ON_PROGRESS
● SUCCEEDED
● FAILED
vnpayData object
vnpayData.txnRef string X
vnpayData.orderTyp string X
e
vnpayData.amount int X
vnpayData.currency string X
vnpayData.ipAddr string The ip address of the user X
who making the
transaction
vnpayData.createdD string X
ate
vnpayData.expireDat string X
e
vnpayData.bankCod string
e
vnpayData.bankTran string
sNo
vnpayData.cardType string
vnpayData.payDate string
vnpayData.respCode string
vnpayData.status string
createdAt date X X
updatedAt date X X
Table 37: Data Dictionary - Collection payments.

169
3. Detailed Design
3.1 User find call
Below will contain activity diagrams, sequence diagrams, and class diagrams that describe the call
flow. Call flow contains two main features: the user joins the queue then waits for the call match, set
up the call, and connects two participants

3.1.1 Activity Diagram


User after login to the web application, can join the queue by click “Tuỳ chỉnh cuộc gọi” to custom
call criteria or click “Gọi ngay” to use default criteria. After successfully match, two participant will be
connected together

Figure 16: User find call - Activity Diagram.

3.1.2 Class Diagram


Class diagram below show the relationship between the classes in the web api server when user join
queue and when system start matching users in the queue

170
Figure 17: User find call - Class Diagram.

3.1.2.1 CallGateway Class


No Attribute Data Type Visibility Description
1 wss Server Private
2 logger Logger Private
3 callQueueService CallQueueService Private
4 callService CallService Private
5 _unsubscribe$ Subject<void> Private
6 profileService ProfileService Private

No Method Return Type Visibility Description


1 announceMatchEffect void Public
2 peeringEffect void Public
3 requestQuestionaireEff void Public
ect
4 questionaireResultEffe void Public
ct
5 endCallEffect void Public
6 callAvailableAnnounce void Public
Effect
7 queueEmptyUserAnno void Public
unceEffect
8 afterInit void Public
9 handleConnection void Public
10 handleDisconnect void Public

171
11 startFinding Promise<SocketCall Public
FindingRESP>
12 stopFinding void Public
13 requestQuestionaire void Public
14 rejectQuestionaire void Public
15 submitAnswer void Public
16 endCall void Public
17 peering void Public
18 joinLastQueue void Public

3.1.2.2 CallGatewayGuard Class


No Attribute Data Type Visibility Description
1 reflector Reflector Private
2 firebaseAuthStrategy FirebaseAuthStrate Private
gy

No Method Return Type Visibility Description


1 canActivate Promise Public

3.1.2.3 CallQueueService Class


No Attribute Data Type Visibility Description
1 logger Logger Private

No Method Return Type Visibility Description


1 queue$ Subject<QueueReq Public
uest>
2 queueEmptyUserAnno Subject<string> Public
unce$
3 queueTrendSuggest$ Subject<TrendSugge Public
stion>
4 configService ConfigService Private
5 profileService ProfileService Private
6 callHistoryService CallHistoryService Private
7 accountService AccountService Private
8 callService CallService Private
9 callStateService CallStateService Private
10 queueEffect void Public
11 prepareQueue void Private
12 joinQueue void Public
13 joinLastQueue void Public
14 quitQueue(clientId: void Public
string)
15 clearQueue void Public
16 calculateCompatibility number Private
17 findMatchUsers Promise<CallSorted Public
Queue[]>

3.1.2.4 SocketCallFilterREQ Class


No Attribute Data Type Visibility Description

172
1 gender boolean Public
2 origin REGION | null Public
3 sex SEX | null Public
4 language LANGUAGE | null Public
5 topic TOPIC | null Public
6 ageRange [number, number] Public

No Method Return Type Visibility Description

3.1.2.5 CallService Class


No Attribute Data Type Visibility Description
1 logger Logger Private
2 newMatch$ Public
3 newQuestionaireResult Public
$
4 newQuestionRequest$ Public
5 newPeer$ Public
6 endCall$ Public
7 callAvailableAnnounce Public
$
8 caslAbilityFactory CaslAbilityFactory Private
9 callHistoryService CallHistoryService Private
10 firebaseAuthStrategy FirebaseAuthStrate Private
gy
11 callQueueService CallQueueService Private
12 callStateService CallStateService Private
13 callQuestionRepository CallQuestionReposi Private
tor
14 profileService ProfileService Private

No Method Return Type Visibility Description


1 userConnected void Public
2 userDisconnected void Public
3 prepareCall Promise<void> Public
4 startCalling Promise<void> Public
5 stopCalling Promise<boolean> Public
6 peer Promise<void> Public
7 requestQuestionaire Promise<boolean> Public
8 rejectQuestionaire Promise<boolean> Public
9 submitAnswers Promise<boolean> Public
10 cleanUpCalls Promise<void> Public

3.1.2.6 CallStateService Class


No Attribute Data Type Visibility Description
1 blockMap Map<string, Private
boolean>
2 maleQueueTrend QueueTrend Private

173
3 femaleQueueTrend QueueTrend Private
4 configService ConfigService Private
5 profileService ProfileService Private
6 imageService ImageService Private
7 callQueueService CallQueueService Private
8 redis Redis Private

No Method Return Type Visibility Description


1 initializeQueueTrend object Public
2 countUser number Public

3 getTrendDefaultFilter QueueCallerFilter Public


4 getTopTrendingFilter Promise<QueueCall Public
erFilter | null>
5 getCallerInfo Promise<QueueCall Public
erInfo>
6 isFinding Promise<boolean> Public
7 isCalling Promise<boolean> Public
8 updateTrend void Public
9 getQueueCount number Public
10 getQueueInfo Promise<CallQueueI Public
nfo | null>
11 upgradeAccount Promise<AccountUp Public
grade>
12 checkAccountPackage Promise<boolean> Public
13 getAccountPackage Promise<PACKAGE | Public
null>
14 validateUpgrade 'valid' | 'expired' | Public
'none'
15 setCallInfo Promise<void> Public

3.1.2.7 CallQueueInfo Interface


No Attribute Data Type Visibility Description
1 user AuthUser Public
2 clientId string Public
3 revealAvatarUrl string Public
4 callerInfo QueueCallerInfo Public
5 callerFilter QueueCallerFilter Public
6 createdTime number Public

No Method Return Type Visibility Description

3.1.2.8 SocketActiveCall Interface


No Attribute Data Type Visibility Description
1 callerOne SocketActiveCaller Public
2 callerTwo SocketActiveCaller Public
3 callHistory CallHistoryDocumen Public
t

174
4 createdTime number Public

No Method Return Type Visibility Description

3.1.2.9 SocketActiveCaller Interface


No Attribute Data Type Visibility Description
1 clientId string Public
2 user AuthUser Public
3 isRequestedQuestionai boolean Public
re
4 answers { questionId: string; Public
answerId: string }[]
5 callerInfo SocketCallerInfoRES Public
P
6 revealAvatarUrl string Public

No Method Return Type Visibility Description

3.1.2.10 ProfileService Class


No Attribute Data Type Visibility Description
1 logger Logger Private
2 profileRepository ProfileRepository Private
3 accountRepository AccountRepository Private
4 imageRepository ImageRepository Private
5 imageService ImageService Private
6 storageService StorageService Private
7 configService ConfigService Private
8 callHistoryService CallHistoryService Private
9 accountService AccountService Private
10 redis Redis Private

No Method Return Type Visibility Description


1 create Promise<Profile> Public
2 dashboardSearch Promise<Profile> Public
3 dashboardFindAll Promise<Pagination Public
RESP<ProfileDashbo
ardOverallRESP>>
4 dashboardFindOne Promise<ProfileDash Public
boardDetailRESP>
5 findOne Promise<Profile> Public
6 getRandomProfile Promise<ProfileRESP Public
[]>

3.1.11 CallHistoryService Class


No Attribute Data Type Visibility Description
1 logger Logger Private

175
2 profileService ProfileService Private
3 accountService AccountService Private
4 statisticsService StatisticsService Private
5 callQuestionService CallQuestionService Private
6 imageService ImageService Private
7 configService ConfigService Private
8 callHistoryRepository CallHistoryReposito Private
ry
9 callQuestionRepository CallQuestionReposi Private
tory
10 friendRequestReposito FriendRequestRepo Private
ry sitory
11 conversationRepositor ConversationReposi Private
y tory

No Method Return Type Visibility Description


1 initialize Promise<CallHistory Public
>
2 getQuestions Promise<Question[] Public
>
3 submitAnswers Promise<CallHistory Public
AnswerSubmitRESP>
4 calculateMatchingPerc number Public
entage
5 stopFinding Promise<void> Public
6 endCall Promise<void> Public
7 cleanupQuestionaire Promise<void> Public
8 rateAndReviewCall Promise<void> Public
9 findAll Promise<Pagination Public
RESP<CallHistoryOve
rallRESP>>
10 dashboardFindAll Promise<Pagination Public
RESP<CallHistoryDas
hboardOverallRESP>
>
11 findOne ProjectionType<Call Public
History>):
Promise<CallHistory
>
12 findOneById Promise<CallHistory Public
DashboardDetailRES
P>
13 countCallToday Promise<number> Public

3.1.12 AccountService Class


No Attribute Data Type Visibility Description
1 logger Logger Private
2 accountRepository AccountRepository Private
3 profileRepository ProfileRepository Private

176
4 registratorService RegistratorService Private
5 callHistoryService CallHistoryService Private
6 redis Redis Private

No Method Return Type Visibility Description


1 dashboardCreate Promise<Account> Public
2 changePassword Promise<void> Public
3 updateDisabled Promise<void> Public
4 findOneFromCache Promise<AccountPar Public
sedDTO>
5 removeOneFromCache Promise<void> Public
6 create Promise<Account> Public
7 findAll Promise<void> Public
8 findOneById Promise<Account> Public
9 update Promise<void> Public
10 getMyAccount Promise<AccountCa Public
cheDTO>
11 upgradeAccount Promise<AccountUp Public
grade>
12 checkAccountPackage { accountId?: Public
ObjectId; profileId:
ObjectId },
myPackage:
PACKAGE):
Promise<boolean>
13 getAccountPackage Promise<PACKAGE | Public
null>
14 validateUpgrade 'valid' | 'expired' | Public
'none'

3.1.2.13 PACKAGE
No Enum Visibility Description
1 PREMIUM Public

3.1.2.14 CallHistoryCreateREQ Class


No Attribute Data Type Visibility Description
1 callerOne CallHistoryProfileRE Public
Q
2 callerTwo CallHistoryProfileRE Public
Q

No Method Return Type Visibility Description

3.1.2.15 CallHistoryProfileREQ Class


No Attribute Data Type Visibility Description
1 profile objectId Public
2 queueTime number Public
3 filter SocketCallFilterREQ Public

177
No Method Return Type Visibility Description

3.1.2.16 CallQuestionService Class


No Method Return Type Visibility Description
1 create Promise<CallQuestio Public
n>
2 findAll Promise<Pagination Public
RESP<CallQuestionR
ESP>>
3 findOne Promise<CallQuestio Public
n>
4 disable Promise<void> Public
5 create Promise<CallQuestio Public
n>
6 getRandomQuestions Promise<CallQuestio Public
n[]>

3.1.2.17 CallHistoryRepository Class


No Attribute Data Type Visibility Description
1 callHistoryModel AccessibleRecordM Private
odel<CallHistoryDoc
ument>

No Method Return Type Visibility Description


1 create Promise<CallHistory Public
>
2 findOne Promise<CallHistory Public
Document>
3 findOneWithoutPermis Promise<CallHistory Public
sion >
4 find Promise<CallHistory[ Public
]>

3.1.3 Sequence Diagram


Sequence diagram describes how the web API system handle when a user sends a join queue request
through WebSocket

178
Figure 18: User Join Queue - Sequence Diagram.

This sequence diagram describes how the system pick user from queue and match them with
potential user

179
Figure 19: Find and match user in queue - Sequence Diagram.

3.1.4 State Machine Diagram

180
3.2 User send message
Below will contain activity diagrams, sequence diagrams, and class diagrams that describe the send
message flow.

3.2.1 Activity Diagram


User after clicking “Nhắn tin” will be redirected to DirectMessagePage, this requires two users to
have the conversation. Then both can send message

Figure 20: User send message - Activity Diagram.

3.2.2 Class Diagram


Class diagram below show the relationship between the classes in the web api server when user send
message

181
Figure 21: User send message - Class Diagram.

3.2.2.1 MessageController Class


No Attribute Data Type Visibility Description
1 messageService MessageService Private

No Method Return Type Visibility Description


1 createConversation ObjectId Public
2 getConversations Promise<Paginatio Public
nRESP<Conversatio
nOverallRESP>>
3 seenConversation void Public
4 sendMessage ObjectId Public
5 getMessages Promise<Paginatio Public
nRESP<MessageOv
erallRESP>>

3.2.2.2 MessageService Class


No Attribute Data Type Visibility Description
1 conversationRepositor ConversationRepos Private
y itory
2 messageRepository MessageRepositor Private
y
3 callHistoryRepository CallHistoryReposito Private
ry
5 profileRepository ProfileRepository Private
8 notificationService NotificationService Private

182
9 accountService AccountService Private

No Method Return Type Visibility Description


1 createConversation ObjectId Public
3 sendMessage void Public
4 getMessages Promise<Paginatio Public
nRESP<MessageOv
erallRESP>>
5 getConversations Promise<Paginatio Public
nRESP<Conversatio
nOverallRESP>>
6 seenConversation void Public
7 getSampleConversatio Promise<Paginatio
ns nRESP<Conversatio
nOverallRESP>>
8 getOtherProfile Promise<Paginatio Public
nRESP<Conversatio
nOtherProfileRESP>
>

3.2.2.3 MessageRepository Class


No Attribute Data Type Visibility Description
1 messageModel Message Private

No Method Return Type Visibility Description


1 create void Public
2 findOne Promise<Message> Public
3 find Promise<Message[] Public
>
4 update void Public
5 remove void Public

3.2.2.4 Message Class


No Attribute Data Type Visibility Description
1 id string Public
2 createdAt Date Public
3 updatedAt Date Public
6 sender Profile Public
7 conversation Conversation Public
8 participants ObjectId[] Public

No Method Return Type Visibility Description

3.2.2.5 MessageSendREQ Class


No Attribute Data Type Visibility Description
1 postId ObjectId Public
2 content string Public

183
No Method Return Type Visibility Description

3.2.2.6 ConversationRepository Class


No Attribute Data Type Visibility Description
1 conversationModel Conversation Private

No Method Return Type Visibility Description


1 create void
2 findOne Promise<Conversat Public
ion>
3 find Promise<Conversat Public
ion[]>
4 update void Public
5 remove void Public

3.2.2.7 Conversation Class


No Attribute Data Type Visibility Description
1 id string Private
2 createdAt Date Private
3 updatedAt Date Private
4 seen ObjectId[] Private
5 lastMessage string Private
6 lastMessageAt Date Private
7 participants ObjectId[] Private

No Method Return Type Visibility Description

3.2.2.8 ProfileRepository Class


No Attribute Data Type Visibility Description
1 profileModel Profile Private

No Method Return Type Visibility Description


1 create void Public
2 findOne Promise<Profile> Public
3 find Promise<Profile[]> Public
4 update void Public
5 remove void Public
6 getRandomProfile void Public
7 updateFavorite void Public

3.2.2.9 Profile Class


No Attribute Data Type Visibility Description
1 id string Private
2 updatedAt Date Private
3 createdAt Date Private
4 account Account Private
5 name string Private

184
6 username string Private
7 avatar ObjectId Private
8 personalInfo PersonalInfo Private
9 callSetting CallSetting Private
10 mbtiResult ProfileMbtiResult Private
11 mbtiTests MbtiTest[] Private
12 friends Profile[] Private
13 posts Post[] Private
14 statistics ProfileStatistics Private
15 disabled boolean Private
16 registrationTokens RegistrationToken[] Private

No Method Return Type Visibility Description

3.2.2.10 NotificationService Class


No Attribute Data Type Visibility Description
1 notificationRepository NotificationReposit Private
ory
2 imageService ImageService Private
3 configService ConfigService Private
4 profileService ProfileService Private
5 notificationGatewaySer NotificationGatewa Private
vice yService
6 profileRepository ProfileRepository Private

No Method Return Type Visibility Description


1 sendNotification void Public
2 sendMessageNotificati void Public
on
3 sendToFCM void Public
4 getNotificationProfileN string Public
ame
5 getNotificationDataId string Public
6 getNotificationDataCo string Public
ntent
7 create void Public
8 seenNotification void Public
9 archiveNotification void Public

3.2.2.11 NOTIFICATION_TYPE
No Enum Visibility Description
1 DIRECT_MESSAGE Public
2 ANONYMOUS_MESSAGE Public
3 FRIEND_REQUEST Public
4 FRIEND_REQUEST_ACCEPTED Public

185
3.2.2.12 AccountRepository Class
No Attribute Data Type Visibility Description
1 accountModel Account Private

No Method Return Type Visibility Description


1 create void Public
2 findOne Promise<Account> Public
3 find Promise<Account[] Public
>
4 update void Public
5 findWithoutPermission void Public

3.2.2.13 Account Class


No Attribute Data Type Visibility Description
1 id string Public
2 updatedAt Date Public
3 createdAt Date Public
4 uid string Public
5 email string Public
6 role ROLE Public
7 profile Profile Public
8 upgrade AccountUpgrade Public
9 disabled boolean Public
10 registrationTokens RegistrationToken[] Public

No Method Return Type Visibility Description

3.2.2.14 AccountParsedDTO Interface


No Attribute Data Type Visibility Description
1 _id string Public
2 uid string Public
3 role ROLE Public
4 upgrade AccountUpgrade Public
5 disabled boolean Public
6 email string Public

No Method Return Type Visibility Description

3.2.2.15 AccountUpgrade Class


No Attribute Data Type Visibility Description
1 package PACKAGE Public
2 expiresDate Date Public

No Method Return Type Visibility Description

186
3.2.2.16 ROLE
No Enum Visibility Description
1 ADMIN Public
2 USER Public

3.1.13. PACKAGE
No Enum Visibility Description
1 PREMIUM Public

3.2.2.17 FirebaseAuthGuard Class


No Attribute Data Type Visibility Description
1 _id string Public

No Method Return Type Visibility Description

3.2.2.18 AccountParsedDTO Class


No Attribute Data Type Visibility Description

No Method Return Type Visibility Description


1 canActivate boolean Public

3.2.2.19 FirebaseAuthStrategy Class


No Attribute Data Type Visibility Description
1 accountService AccountService Public

No Method Return Type Visibility Description


1 validate Promise<AuthUser Public
>

3.2.3 Sequence Diagram


Below will contain two sequence diagram which describes how a request is authenticated, after that
how the message is sent and notify to another user

187
Figure 22: Authenticate - Sequence Diagram.

This sequence diagram describes how the message is sent and notified to another user

188
Figure 23: Message is sent and notified to another user - Sequence Diagram.

3.3 User order and pay premium package


Below will contain activity diagrams, sequence diagrams, and class diagrams that describe premium
order and payment flow.

3.3.1 Activity Diagram


User after clicking purchase premium will be redirected to VNPay and finish their payment with the
gateway. After that user will successfully have the Premium package

189
Figure 24: User order and pay premium package - Activity Diagram.

3.3.2 Class Diagram


Below show the relationship between the classes in the web API server when the user purchase the
premium package and how VNPay trigger our server to update transaction status

190
Figure 25: User order and pay premium package - Class Diagram..

3.3.2.1 FirebaseAuthGuard Class


No Attribute Data Type Visibility Description

No Method Return Type Visibility Description


1 canActivate boolean Public

3.3.2.2 OrderController Class


No Attribute Data Type Visibility Description
1 orderService OrderService Private

No Method Return Type Visibility Description


1 purchasePremium Promise<string> Public
2 dashboardFindAll Promise<Paginatio Public
nRESP<OrderDashb
oardOverallRESP>>
3 dashboardFindOne Promise<OrderDas Public
hboardDetailRESP>
3.3.2.3 OrderService Class
No Attribute Data Type Visibility Description

191
1 accountService AccountService Private
2 accountRepository AccountRepository Private
3 profileRepository ProfileRepository Private
4 orderRepository OrderRepository Private
5 paymentService PaymentService Private
6 paymentRepository PaymentRepository Private

3.3.2.4 OrderRepository Class


No Attribute Data Type Visibility Description
1 orderModel Order Private

No Method Return Type Visibility Description


1 create void Public
2 findOne Promise<Order> Public
3 find Promise<Order[]> Public
4 update void Public
5 removeWithoutPermis void Public
sion

3.3.2.5 Order Class


No Attribute Data Type Visibility Description
1 id string Public
2 updatedAt Date Public
3 createdAt Date Public
4 payment Payment Public
5 owner Profile Public
6 items OrderItem Public
7 totalPrice number Public
8 status ORDER_STATUS Public

No Method Return Type Visibility Description

3.3.2.6 ORDER_STATUS
No Attribute Visibility Description
1 ON_PROGRESS Public
2 SUCCEEDED Public
3 CANCELED Public

3.3.2.7 PaymentService Class


No Attribute Data Type Visibility Description
1 VNP_VERSION string Private
2 VNP_TMN_CODE string Private
3 VNP_HASH_SECRET string Private
4 VNP_GATEWAY_URL string Private
5 VNP_RETURN_URL string Private

192
6 VNP_EXPIRES_IN number Private
7 ENV string Private
8 paymentRepository PaymentRepository Private
9 orderRepository OrderRepository Private
10 orderService OrderService Private

No Method Return Type Visibility Description


1 vnpayGenPayParam string Public
2 vnpayGenPayUrl string Public
3 vnpayReturn Promise<VnpayRet Public
urnRESP>
4 vnpayIpn Promise<{ Public
RspCode:
VNPAY_IPN_RESP;
Message: string }>
5 vnpayCheckValidToken boolean Public
6 updateTransactionStat Promise<'not-foun Public
us d' |
'already-update' |
'invalid-amount'>

3.3.2.8 PaymentRepository Class


No Method Return Type Visibility Description
1 create Promise<Payment> Public
2 findOne Promise<Payment> Public
3 find Promise<PaymentD Public
ocument[]>
4 update Promise<void> Public
5 removeWithoutPermis Promise<void> Public
sion

3.3.2.9 Payment Class


No Attribute Data Type Visibility Description
1 id string Public
2 updatedAt Date Public
3 createdAt Date Public
4 order Order Public
5 description string Public
6 currency PAYMENT_CURREN Public
CY
7 status PAYMENT_STATUS Public
8 vnpayData PaymentVnpayDat Public
a

No Method Return Type Visibility Description

193
3.3.2.10 PAYMENT_STATUS
No Attribute Visibility Description
1 ON_PROGRESS Public
2 SUCCEEDED Public
3 FAILED Public

3.3.2.11 PaymentController Class


No Attribute Data Type Visibility Description
1 paymentService PaymentService Private

No Method Return Type Visibility Description


1 vnpayReturn Promise<VnpayRet Public
urnRESP>
2 vnpayIpn Promise<{RspCode: Public
VNPAY_IPN_RESP;
Message: string;}>

3.3.2.12 VnPayPayDTO Class


No Attribute Data Type Visibility Description
1 orderId string Public
2 description string Public
3 amount number Public
4 clientIp string Public
5 orderType VNPAY_ORDER_TY Public
PE

No Method Return Type Visibility Description

3.3.2.13 VnpayReturnREQ Class


No Attribute Data Type Visibility Description
1 vnp_TmnCode string Public
2 vnp_Amount number Public
3 vnp_BankCode string Public
4 vnp_BankTranNo string Public
5 vnp_CardType string Public
6 vnp_PayDate number Public
7 vnp_OrderInfo string Public
8 vnp_TransactionNo string Public
9 vnp_ResponseCode string Public
10 vnp_TransactionStatus string Public
11 vnp_TxnRef string Public
12 vnp_SecureHashType string Public
13 vnp_SecureHash string Public

194
No Method Return Type Visibility Description

3.3.2.14 AccountService Class


No Attribute Data Type Visibility Description
1 accountRepository AccountRepository Private
2 profileRepository ProfileRepository Private
3 registratorService RegistratorService Private
4 callHistoryService CallHistoryService Private

No Method Return Type Visibility Description


1 changePassword void Public
2 updateDisabled void Public
3 create void Public
4 findAll PaginationRESP<Ac Public
countRESP>
5 findOneById Account Public
6 update void Public
7 getMyAccount Promise<AccountU Public
pgrade>
8 upgradeAccount Promise<AccountU Public
pgrade>
9 validateUpgrade 'valid' | 'expired' | Public
'none'

3.3.2.15 AccountRepository Class


No Attribute Data Type Visibility Description
1 accountModel Account Private

No Method Return Type Visibility Description


1 create void Public
2 findOne Promise<Account> Public
3 find Promise<Account[] Public
>
4 update void Public
5 removeWithoutPermis void Public
sion

3.3.2.16 AccountUpgrade Class


No Attribute Data Type Visibility Description
1 package PACKAGE Public
2 expiresDate Date Public

No Method Return Type Visibility Description

195
3.3.2.17 PACKAGE
No Attribute Visibility Description
1 PREMIUM Public

3.3.2.18 Account Class


No Attribute Data Type Visibility Description
1 id string Public
2 updatedAt Date Public
3 createdAt Date Public
4 uid string Public
5 email string Public
6 role ROLE Public
7 profile Profile Public
8 upgrade AccountUpgrade Public
9 disabled boolean Public
10 registrationTokens RegistrationToken[] Public

No Method Return Type Visibility Description

3.3.2.19 ROLE
No Attribute Visibility Description
1 ADMIN Public
2 USER Public
3.3.3 Sequence Diagram
Below describes how the web API authenticate every request that accesses the private resource, and
send a message is one of the actions that required authenticate

196
Figure 26: Authenticate request to accesses the private resource- Sequence Diagram.

Sequence diagram describes how the web API system handle when a user sends a message

197
Figure 27: Buy Premium Package - Sequence Diagram.

198
3.3.4 State Machine Diagram

This state machine diagram describes order state

199
This state machine diagram describes payment state

4. Algorithm
4.1 Find best potentian match for participant in queue
4.1.1 Summary

This algorithm will explain how the system chooses the best match among queue participants

Input: A list of participants in the queue. For each participant, include that person's information:
gender, birthdate, sex, origin, and language. And information about the criteria this participant is
looking for: gender, age range, topic, location, sex, language

Output: The most suitable person

4.1.2 Define problem

There are many users who are online and looking for calls. Each queue participant will specify who
they want to talk to. The system must select people in the queue so that both people match as many
criteria as possible. Then the system will connect this user together to call

200
4.1.3 Solution

The diagram below shows the way the algorithm runs when the user enters the queue.
There are 6 main steps in this algorithm:

1. Get a list of all the participants in the queue


2. Calculate others' scores based on your criteria
3. Calculate your score based on that person's criteria
4. Add these two points together, eliminating those who don't pass the weight threshold
5. Add MBTI compatibility if it exists
6. Loop through the candidate list, and check if that person is still available for call
7. Connect 2 users

201
202
Matching criteria:

The below table show the matching fields and the weight of each field (can be configured).
All weights listed and used in the system are not referenced to any source or article. These weights
are set based on observations, feelings & subjective opinions about user needs. The weights are
ordered from most important to least important
Note that every field is optional excluding gender and age range is required. When the participant
leaves an optional field blank it will meant to be match every options

Field Point Description

Gender 100

Age Range 40 Age range varies from 17 to 65

Topic 20

Location 20

Sex 10

Language 10 User can choose 1 language

Mark Threshold 280 If the total mark is not equal or greater threshold
then that participant fails to qualified

MBTI Compatibility 0 - 100 This is added after user qualified


Table 38: Matching criteria.

The MBTI Compatibility is refer to


https://www.personalitydata.org/16-types/enfj-relationships#partner-matrix

The output:

After running algorithm, from the input with participant list, we get the best match participant.

4.1.4 Performance
Test Environment

VPS Provider: Digital Ocean

CPU Type: Shared, CPU: 1 vCPU, RAM: 1GB, SSD: 25GB

Test Sample: 4 test from 100 to 100000 participant in memory

203
We will use only one criteria throughout the process

Output:

Test 1: Sample 100 participants

204
Min: 0.306ms | Max: 6.791ms | Ave: 1.199ms

Test 2: Sample 1000 participants

Min: 1.394ms | Max: 13.043ms | Ave: 3.7121ms

Test 3: Sample 10000 participants

205
Min: 16.365ms | Max: 30.533ms | Ave: 19.4929ms

Test 4: Sample 100000 participants

Min: 3.237s | Max: 5.038s | Ave: 4.2538s

4.1 Calculate MBTI


4.1.1 Summary

Input: 32 questions with range from 1 to 5

206
Output: User personality type (MBTI Type)

4.1.2 Define problem

User want to match with another participant that is matched with themself not only from criteria but
also the personality. In order to enhance the compatibility when matching two participants in the
queue, we must use personality compatibility helper

4.1.3 Solution
Because MBTI is a trademark it’s very hard to know how to algorithm works. But the foundation of
MBTI is Myers–Briggs Type Indicator which every big MBTI test site use to build its own test suite

Here, we use an open-source MBTI alike call Open Extended Jungian Type Scales version 1.2 refer
here https://openpsychometrics.org/tests/OJTS/development/

And https://openpsychometrics.org/tests/OJTS/development/OEJTS1.2.pdf contains instruction of


how to implement algorithm

V. Software Testing Documentation


1. Overall Description
1.1 Test Model
In the Destinee project, we apply Agile testing for the following purposes:

- Quickly adapt to projects that changed rapidly and continuously.


- Test cases are ready for execution when finishing the implementation.
- Detecting errors in the system early allows for quick correction.

1.2 Test Levels


- Integration test: Ensure every module works appropriately together in the system.
- System test: Ensure that the Destinee system meets the design specification and other
requirements.

1.3 Testing Types


- Functional test: Ensure that all functions in the system meet its requirements.
- User Interface test: Ensure that all elements of the UI are correctly presented.
- Data integrity test: Ensure that data is saved correctly into the database.

207
2. Test Plan
2.1 Test Stages
Stage of Test
Type of Test
Integration System Acceptance
Functional Test X X X
Non-functional test X X X
User interface test X X
Data integrity test X X
Table 39: Test Plan - Test Stages.

2.2 Human Resources

Worker/Doer Role Specific Responsibilities/Comments

Nguyễn Trung Thịnh Leader Planning, assigning test functions to


members and verifying test results.
Đỗ Tuấn Kiệt Member Execute test and report.
Lê Tấn Tài Member Execute test and report.
Lê Đức Minh Thiên Member Execute test and report.
Table 40: Test Plan - Human Resources.

2.3 Test Milestones


Milestone Task Due Date
Test Document 09/12/2022
Table 41: Test Plan - Test Milestones.

3. Test Cases and Test Reports


Testing Level File Name
Unit test Destinee - TestPlan
Table 42: Test Plan - Test Cases and Test Reports.

208
VI. Release Package & User Guides
1. Deliverable Package
1.1 Source codes & documents
No. Items Sub-Items Type Version

Code Package

1 Web API Module Web Service New 1.0.0

2 Client Frontend User Web Application New 1.0.0


Module

3 Dashboard Frontend Admin Web Application New 1.0.0


Module

Database

1 Script destinee-script New

Documents

1 Final Project Report Report7_FinalProjectReport.docx 1.0


Table 43: Source codes & documents.

2. Installation Guides
2.1 System Requirements
2.1.1 Hardware Requirements
This is a hardware requirement in order for the web API to execute

Component Minimum Recommended

CPU At least 1vCPU 2vCPU

Memory At least 1GB RAM 4GB RAM

Storage Space 10GB HDD 50GB SSD

Network At least 50Mbps bandwidth 400Mbps bandwidth


Table 44: System Requirements - Hardware Requirements.

2.1.2 Software Requirements


Application is required user device’s browser include desktop/mobile browser to support WebRTC,
WebSocket, notification, and microphone accessibility in order to execute without collapse

Component Minimum Recommended

209
Chrome 23 Chrome 108 or latest
Edge 79 Edge 107 or latest
Desktop Browser
Safari 11 Safari 16 or latest
Firefox 22 Firefox 107 or latest
Chrome 107 Chrome 107 or latest
Mobile Browser Safari 11 Safari 16.1 or latest
Firefox 106 Firefox 106 or latest
Table 45: System Requirements - Software Requirements.

Component Software and version Description

Operating system for running


OS Window 7-11 or Linux 18.04
project
MongoDB 5.0.8 or 6.0.3 (for docker
BDMS Database Management System
image)
Environment for running web api,
FE/BE Environment NodeJS 16.14.0, Docker 20.10.18
and frontend

Cache Redis 7.0 Cache Database

VCS Git Tool for manage code version


Table 46: System Requirements - Software Requirements.

2.1.3 Setup Files

destinee-backend.zip: Web API

destinee-frontend.zip: User web application

destinee-dashboard.zip: Admin web application

destinee-script: Database script

2.2 Installation Instruction


2.2.1 Setup environment
● Download and install NodeJS 16.14.0: Link
● Download and install MongoDB: Link
● Download and install VSCode: Link
● Download and install Docker: Follow the producer installation guide for Window/Linux OS
● Download and install Redis & RedisInsight(optional): Follow the producer installation guide
for Window/Linux OS
● Download and install Git: Link

2.2.2 3rd Party Service Setup


● Register VNPay development sandbox: Link
● Register S3 Storage from AWS or DigitalOcean
● Register Firebase’s Authentication & Cloud Messaging: Link
● Register Genius API (for music data): Link

210
● Register TMDB API (for movie data): Link

2.2.3 Run Backend/Web API Server


Step 1: Clone the repository (private) or extract “destinee-backend.zip”
Step 2: Download Firebase’s Credential
● https://console.firebase.google.com/u/1/project/<your_project_id>/settings/serviceaccount
s/adminsdk
● Then rename to “firebase-credential.json” and put it in the root folder of “destinee-server”
Step 3: Create a “.env” file and fill up all required keys:
● NODE_ENV: <development | production>
● PORT: <number>
● MULTER_MAX_UPLOAD_SIZE: <number>
● DATABASE_URL: <string>
● REDIS_HOST: <string>
● REDIS_PORT: <number>
● REDIS_USERNAME: <string>
● REDIS_PASSWORD: <string>
● REDIS_TTL: <seconds>
● STORAGE_DO_SPACE_KEY: <provided_by_s3>
● STORAGE_DO_SPACE_SECRET: <provided_by_s3>
● STORAGE_DO_SPACE_ENDPOINT: <provided_by_s3>
● STORAGE_DO_SPACE_REGION: <provided_by_s3>
● STORAGE_DO_SPACE_BUCKET: <provided_by_s3>
● STORAGE_DO_SPACE_PRESIGNED_URL_EXPIRES: <seconds>
● QUESTION_BANK_MIN_NO_QUESTION: <number>
● QUESTION_BANK_MIN_NO_QUESTION_ANSWER: <number>
● QUESTION_BANK_MAX_NO_QUESTION_ANSWER: <number>
● PROFILE_DISABLED_NAME: <title_when_user_disabled>
● PROFILE_MIN_AGE: <number>
● PROFILE_MAX_AGE: <number>
● QUEUE_DELAY_DEFAULT: <seconds>
● QUEUE_DELAY_TREND_FILTER: <seconds>
● QUEUE_DELAY_QUALIFIED_POINT: <qualified_weight>
● QUEUE_DELAY_QUALIFIED_GENDER_POINT: <weight>
● QUEUE_DELAY_QUALIFIED_AGE_POINT: <weight>
● QUEUE_DELAY_QUALIFIED_TOPIC_POINT: <weight>
● QUEUE_DELAY_QUALIFIED_LOCATION_POINT: <weight>
● QUEUE_DELAY_QUALIFIED_SEX_POINT: <weight>
● QUEUE_DELAY_QUALIFIED_LANGUAGE_POINT: <weight>
● QUEUE_JWT_SECRET: <your_secret>
● PRICE_PREMIUM_PACKAGE: <vnd_amount>
● DEFAULT_LIMIT_CALL: <number_of_call_per_day>
● DEFAULT_LIMIT_CALL_HISTORY_EXTEND_DATE: <archive_call_history_after_days>
● VNP_VERSION: <provided_by_vnpay>
● VNP_TMN_CODE: <provided_by_vnpay>
● VNP_HASH_SECRET: <provided_by_vnpay>
● VNP_URL: <provided_by_vnpay>
● VNP_RETURN_URL: <provided_by_vnpay>

211
● VNP_EXPIRES_IN: <expires_in_minutes>
Step 4: Install all dependencies: npm install or npm install --legacy-peer-deps

Step 5: Run: npm run dev

2.2.4 Run User Web Application


Step 1: Clone the repository (private) or extract “destinee-client.zip”
Step 2: Look up firebase credential at
https://console.firebase.google.com/u/1/project/<your-project-id>/settings/general/web:<id>
Step 3: Create a “.env” file and fill up all required keys:
● REACT_APP_PERSONALITY_TEST_QUESTION_LIMIT: <number>
● REACT_APP_DURATION_PER_CALL_QUESTION: <number>
● REACT_APP_MESSAGE_LIMIT: <number>
● REACT_APP_NOTIFICATION_LIMIT: <number>
● REACT_APP_PROFILE_MIN_AGE: <number>
● REACT_APP_PROFILE_MAX_AGE: <number>
● REACT_APP_CALL_LIMIT_FROM: <hh:mm>
● REACT_APP_CALL_LIMIT_TO: <hh:mm>
● REACT_APP_PREMIUM_PRICE: <vnd_amount>
● REACT_APP_FIREBASE_API_KEY: <provided_by_firebase>
● REACT_APP_FIREBASE_AUTH_DOMAIN: <provided_by_firebase>
● REACT_APP_FIREBASE_PROJECT_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_STORAGE_BUCKET: <provided_by_firebase>
● REACT_APP_FIREBASE_MESSAGING_SENDER_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_APP_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_MEASUREMENT_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_VAPID_KEY=: <provided_by_firebase>
● REACT_APP_API_URL: <web_api_url>
● REACT_APP_SOCKET_URL: <socket_url>
● REACT_APP_SOCKET_PATH: <socket_path>
● REACT_APP_GENIUS_URL: <provided_by_genius>
● REACT_APP_GENIUS_KEY: <provided_by_genius>
● REACT_APP_GENIUS_SONG_PER_PAGE: <number>
● REACT_APP_GENIUS_IMAGE_HOST: <provided_by_genius>
● REACT_APP_DEFAULT_SONG_SEARCH: <default_search>
● REACT_APP_MOVIE_URL: <provided_by_tmdb>
● REACT_APP_MOVIE_KEY: <provided_by_tmdb>
● REACT_APP_MOVIE_IMAGE_HOST: <provided_by_tmdb>
● REACT_APP_MOVIE_IMAGE_SIZE: <w45 | w92 | w154 | w185 | w300 | "w500" | w780
| w1280 | original>

Step 4: Install all dependencies: npm install or npm install --legacy-peer-deps

Step 5: Run npm start then your browser will open and redirect to localhost:<your-port>

2.2.5 Run Dashboard/Admin Web Application


Step 1: Clone the repository (private) or extract “destinee-dashboard.zip”
Step 2: Create a “.env” file and fill up all required keys:

212
● REACT_APP_FIREBASE_API_KEY: <provided_by_firebase>
● REACT_APP_FIREBASE_AUTH_DOMAIN: <provided_by_firebase>
● REACT_APP_FIREBASE_PROJECT_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_STORAGE_BUCKET: <provided_by_firebase>
● REACT_APP_FIREBASE_MESSAGING_SENDER_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_APP_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_MEASUREMENT_ID: <provided_by_firebase>
● REACT_APP_FIREBASE_VAPID_KEY: <provided_by_firebase>
● REACT_APP_API_URL: <web_api_url>
● REACT_APP_CALL_QUESTION_ANSWER_MIN: <number>
● REACT_APP_CALL_QUESTION_ANSWER_MAX: <number>
Step 3: Install all dependencies: npm install or npm install --legacy-peer-deps

Step 4: Run npm start then your browser will open and redirect to localhost:<your-port>

2.3 Deployment Guide


2.3.1 Deploy Web API to VPS & setup CI/CD

Step 1: Create VPS from any provider with the below requirements:

● CPU: 1vCPU minimum


● RAM: 1GB minimum
● Storage: 10GB HDD minimum
● Network: 100Mbps minimum
● OS: Ubuntu 18.04LTS

Step 2: Encrypt “firebase-credential.json”

Step 3: Setup CD/CI for Github Action

Step 3.1: Create folder & files as the following structure exclude “prod-decrypt.sh” and
“prod-docker-push.yml”

213
Step 3.1: Create “decrypt.sh” file

Step 3.2: Create “docker-push.yml”

Step 4: Setup DockerHub

214
Step 4.1: Go to DockerHub then Create new “Access Token” at
https://hub.docker.com/settings/security

Step 4.2: Create new DockerHub repository to contain CI/CD container

Step 5: Go to Github and setup the following secrets:


https://github.com/jungtin/<your-repo>/settings/secrets/actions

𝅉 DOCKER_HUB_ACCESS_TOKEN
𝅉 DOCKER_HUB_REPO_NAME
𝅉 DOCKER_HUB_USERNAME
𝅉 LARGE_SECRET_PASSPHRASE
𝅉 PROD_DOCKER_HUB_ACCESS_TOKEN
𝅉 PROD_DOCKER_HUB_REPO_NAME
𝅉 PROD_DOCKER_HUB_USERNAME
𝅉 PROD_LARGE_SECRET_PASSPHRASE
𝅉 PROD_UPDATE_SCRIPT
𝅉 PROD_VPS_HOST
𝅉 PROD_VPS_PASSWORD
𝅉 PROD_VPS_PORT
𝅉 PROD_VPS_USERNAME
𝅉 UPDATE_SCRIPT
𝅉 VPS_HOST
𝅉 VPS_PASSWORD
𝅉 VPS_PORT
𝅉 VPS_USERNAME

Step 6: Setup VPS

Step 6.1: Install Docker on your VPS

● Access VPS through SSH: $ ssh root@your-vps-ip


● Install Docker by following this article: How To Install Docker Compose on Ubuntu 18.04 |
DigitalOcean

Step 6.2: Upload files to VPS through WinSCP

215
Step 6.3: Create “dependencies.docker-compose”

Step 6.4: Create “server.docker-compose.yaml”

216
Step 6.5: Create “update-server.sh”

Step 6.6: Create “server.env”

217
Step 7: Install dependencies & run server

Step 7.1: Go to folder that contains recent upload files

Step 7.1: Run dependencies: $ docker-compose -f ./dependencies.docker-compose.yaml up -d and


wait till it finish

Step 7.2: Run Server: $ docker-compose -f ./server.docker-compose.yaml up -d

Step 8: Access your host: (ex: https://128.199.161.229) and you see “Xin chào đã đến với Destinee
Server...” then you’re complete successfully

218
Step 9: Push commit that contains Github Action CI/CD setup then check if Build process is working
good here: https://github.com/jungtin/destinee-server/actions

2.3.2 Deploy User/Admin Dashboard & setup CI/CD

Step 1: Login Netlify using Github and import project here Import an existing project from a Git
repository | Netlify

Step 2: Pick and import from github repo then deploy site

Step 3: Configuration

Step 3.1: Config build setting here:


https://app.netlify.com/sites/your-repo/settings/deploys#continuous-deployment

Step 3.2: Choose the branch use as trigger

219
Step 3.3: Setup environment variables here
https://app.netlify.com/sites/your-repo/settings/deploys#environment

Refer to the list of environment variables in the installation guide section

Step 4: Custom your domain (optional)

220
Default, Netlify will generate an unique domain for you. But if you want to link your custom domain
to Netlify then setup here: https://app.netlify.com/sites/destinee-dev/settings/domain

Step 5: Access to your domain/custom domain you will see the result after minutes

221
3. User Manual
3.1 Admin System
3.1.1 View Statistics Data
Step 1: In dashboard home page, the sidebar has so many tabs, and in the middle is the statistic
information

Figure 28: User Manual - Feature 1 - Step 1.

Step 2: At this point, the Admin has many options to choose from to see what kind of statistics data.
Statistical data can also be customized to display by week, month, half year, last 1 year or all.

Figure 29: User Manual - Feature 1 - Step 2

Step 3: Admin can also see the details of the most used constructive questions in the system.

222
Figure 30: User Manual - Feature 1 - Step 3

3.1.2 Create Constructive Question


Step 1: Admin can select "Câu hỏi/trả lời kiến tạo" tab on the sidebar. Then admin click "Tạo câu
hỏi" to be able to start creating new questions

Figure 31: User Manual - Feature 2 - Step 1

Step 2: Admin must fill in all required information like: question title, 2 answers. And if user want to
add more answer, he/she can also click on “+ Câu trả lời” button and fill in answer. After that, admin
press “Gửi” button to save.

223
Figure 32: User Manual - Feature 2 - Step 2

Step 3: At this time, the newly created constructive question will be updated to the question list and
used in the User System.

Figure 33: User Manual - Feature 2 - Step 3

3.2 User System


3.2.1 Call
Step1: Firstly, click to “Tùy chỉnh cuộc gọi” button in Home Page.

224
Figure 34: User Manual - Feature 3 - Step 1

Step 2: There are six fields filter: Giới tính, quê quán, độ tuổi, chủ đề, ngôn ngữ, xu hướng. Member
can choose the field to change the criteria or not. Then, member click to “Bắt đầu gọi ngay” button.

225
Figure 35: User Manual - Feature 3 - Step 2

Step 3: After successfully setup queue filters, member will be redirected to the “Call Finding” page.
System starts a finding call process based on the selected criteria.

226
Figure 36: User Manual - Feature 3 - Step 3

Step 4: After successfully matched with another member by the system, member will be redirected
to the “Call Anonymous Reveal” page and can see which one from 3 random users is the one who
matched with them by the system by clicking on 3 images.

227
Figure 37: User Manual - Feature 3 - Step 4

Step 5: After 5 seconds on the call reveals page, the member will be redirected to the “Calling
Screen”. Member can start talking with another user in the call.

228
Figure 38: User Manual - Feature 3 - Step 5

Step 6: Member can view another user’s profile in the call by clicking on the card of the other profile
in the call.

229
Figure 39: User Manual - Feature 3 - Step 6

Step 7: Member can join call constructive questions process by clicking on the “Bắt đầu trò chơi kiến
tạo tại đây” area.

230
Figure 40: User Manual - Feature 3 - Step 7

Step 8: After both 2 users complete the answering process, the system will display the result.
Member can view the matching percent of 2 users and the answers of 2 users.

231
Figure 41: User Manual - Feature 3 - Step 8.

Step 9: Member can end the current call by clicking the “End Call” icon on the “Calling Screen” and
start rate another user in the current call after end the call.

232
Figure 42: User Manual - Feature 3 - Step 9

3.2.2 Chat
Step 1: After a call, Premium member can view the history of the call. Then clicks “Nhắn tin” button
to continue contact to the person in the call history item by chatting.

233
Figure 43: User Manual - Feature 4 - Step 1.

Step 2: Premium member will be redirected to the “Direct Message” page. They can send messages
to another user in the conversation after input the message and clicking send button.

234
Figure 44: User Manual - Feature 4 - Step 2

Step 3: Premium member can view the other member’s message after he/she send message
successfully.

235
Figure 45: User Manual - Feature 4 - Step 3

236

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy