File sorting algorithm

Without Code listing 4.1 the sorting will not work as mat-sort is case-sensitive.

This code will go through the rows that are going to be sorted, checks if the users want to sort ascending ("asc"), and returns the same data in lower-case.

Checkboxes

The checkboxes enables the possibility to do a mass action, in this case of re-analysing, downloading, favorite and deleting selected files as shown in Fig-ure 4.6. When clicking the button ’Execute action’, the system sends an array containing the selected files to the correct API route according to the specified action. In this proof of concept repository,reanalyze anddownloadare devel-oped and working, as these was considered the most important functions of module

2https://github.com/angular/components/issues/9205#issuecomment-423995549 Ac-cessed: 2021-4-30 12:00

Figure 4.6:Checkboxes

Pagination

The table also supports pagination making traversing and loading the file en-tries easier as shown in Figure 4.7. When clicking on a new page it sends a new http request to the backend and only loads the files that is needed on the pagination page. This is faster as it now it only needs to load a defined amount instead of the whole database.

Figure 4.7:Pagination on the file list

File view

Clicking on the button "expanded details" in the expanded file on the file list, the user will be redirected to a page containing all information about this spe-cific file, as shown in Figure 4.8. The detailed information includes most of the data stored on the database, such as: hashes, original filename, size, data added, file type, analysed information from 3rd party sites (VirusTotal) and static analysis (PEframe). Both thesha256andmd5sum will for convenience be copied to the users clipboard if clicked on. It is also possible to download the files, add them to favorites or requesting a reanalysis of the file on the detailed view and the file list.

Chapter 4: Implementation 27

Figure 4.8:Detailed file view

Tagging

All files uploaded can be tagged. These tags are stored in an array in the database as mentioned in Section 4.3. This functionality was specifically re-quested by the employer as they wanted to be able to tag a file with for in-stanceexamto hide it from students, orprivateto only by visible for the user who uploaded the file. These tags can be edited by admins, researchers, and the user who uploaded the file.

4.1.3 Admin panel

The admin panel (Figure 4.9) contains helpful tools for the users with admin privileges. This panel contains some features. First, a list over users where the admin has the ability to activate/deactivate and edit users. This is an important feature as it adds manual control over access to the repository. It is also an efficient way to deactivate a user in the case of malicious behaviour. Spotting this behaviour is related to the second feature of the admin panel which is a simple log view. This shows live logs in a clean format for the admins to see.

The edit functionality allows the admins to change the role of a user.

Figure 4.9:Admin panel user list

Edit users

On the admin panels user list (Figure 4.10) the admins are able to edit a users role, status (active or not) and if they are able to upload. As requested by the NTNU Malware Lab, when editing a student there should be a checkbox to enable/disable uploading for specific students, as shown in Figure 4.10b. This is by default disabled.

(a)Edit user if admin (b)Edit user if student Figure 4.10:Edit user dialogues

Delete users

On the admin panel’s user list the admins are also able to delete users. Clicking on the delete user selection users are prompted with a delete confirmation, as shown in Figure 4.11.

Figure 4.11:Delete user dialogue

Log list

The log-list on the frontend is establishing a websocket connection to the back-end to continuously receive logs and display them to the user. The logs are created by Winston on the backend and creates a simple way to view the mon-itor the system as an admin. Figure 4.12 shows an example of logs in admin panel.

Chapter 4: Implementation 29

Figure 4.12:System logs in admin panel

4.1.4 Authorization

Handling authorization on the frontend with Angular is done by using a Route Guards, often known as AuthGuard. When a user want to navigate to a different location, it will trigger a call to the Router inside Angular which will handle the request. The Router will check with the AuthGuard whether or not the user should be allowed navigation to the requested route [12]. On the frontend, AuthGuard has been split into 3 different components, each handling a aspect of Route Guarding, these components are:

AuthGuard

The AuthGuard checks if the user that is trying to access the page is authen-ticated, and if not the user gets redirected to the login page. This guard is enabled on all pages other than the login page itself. And if a users "active"

flag is set to false in the database, meaning the user is not allowed into the repository, the user will be redirected to a/accessdeniedpage. The code for this is shown in Code listing C.4

AdminGuard

The AdminGuard checks if the user is an admin. If not, the user wont have ac-cess to the admin component. This guard protects the admin dashboard located on/admin(Code listing C.5).

LoggedInGuard

The LoggedInGuard prevents users from accessing the/loginpage if the user already is logged in, and if the user is not logged in, the user stays on the/login page (Code listing C.6).

Route and guard definitions

The guards protecting the routes are defined on the frontend in app-routing-module.ts, which is keeping the definition of all routes. The routes are defined with their path, which component to render on that path, and which guard to protect this route.

1 const routes: Routes = [

2 { path: ’admin’, component: AdminComponent, canActivate: [AdminGuard] }, 3 { path: ’login’, component: LoginComponent, canActivate: [LoggedInGuard]}, 4 { path: ’favorites’, component: FavoritesComponent, canActivate: [AuthGuard]}, 5 { path: ’upload’, component: FileUploadComponent, canActivate: [AuthGuard]},

6 { path: ’’, component: DashboardComponent, canActivate: [AuthGuard], pathMatch:’full’ }, 7 { path: ’fileview/:sha256’, component: FileViewComponent, canActivate: [AuthGuard]}, 8 { path: ’upload/:id’, component: UploadStatusComponent, canActivate: [AuthGuard]}, 9 { path : ’accessdenied’ , component: notactiveComponent },

10 { path: ’**’, component: NotFoundComponent } 11 ];