51 Improve Structure

src/app/app-routing.module.ts

@@ -1,11 +1,10 @@
-// tslint:disable-next-line:max-line-length
-import { ActivitiesManagementComponent } from './components/options-sidebar/activities/activities-management/activities-management.component';
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
-import { ReportsComponent } from './components/options-sidebar/reports/reports.component';
-import { TimeClockComponent } from './components/options-sidebar/time-clock/time-clock.component';
-import { TimeEntriesComponent } from './components/options-sidebar/time-entries/time-entries.component';
-import { ProjectManagementComponent } from './components/options-sidebar/project-management/project-management.component';
+import { ReportsComponent } from './modules/reports/pages/reports.component';
+import { TimeClockComponent } from './modules/time-clock/pages/time-clock.component';
+import { TimeEntriesComponent } from './modules/time-entries/pages/time-entries.component';
+import { ProjectManagementComponent } from './modules/project-management/pages/project-management.component';
+import { ActivitiesManagementComponent } from './modules/activities-management/pages/activities-management.component';
 
 const routes: Routes = [
   {path: 'reports', component: ReportsComponent},

src/app/app.module.ts

@@ -1,5 +1,3 @@
-import { ActivityListComponent } from './components/options-sidebar/activities/activity-list/activity-list.component';
-import { CreateActivityComponent } from './components/options-sidebar/activities/create-activity/create-activity.component';
 import { CommonModule } from '@angular/common';
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
@@ -8,23 +6,24 @@ import { HttpClientModule } from '@angular/common/http';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { NavbarComponent } from './components/shared/navbar/navbar.component';
-import { UserComponent } from './components/shared/user/user.component';
-import { SidebarComponent } from './components/shared/sidebar/sidebar.component';
-import { ClockComponent } from './components/shared/clock/clock.component';
-import { TimeClockComponent } from './components/options-sidebar/time-clock/time-clock.component';
-import { ProjectManagementComponent } from './components/options-sidebar/project-management/project-management.component';
-import { TimeEntriesComponent } from './components/options-sidebar/time-entries/time-entries.component';
-import { ProjectListComponent } from './components/shared/project-list/project-list.component';
-import { CreateProjectComponent } from './components/shared/create-project/create-project.component';
-import { DetailsFieldsComponent } from './components/shared/details-fields/details-fields.component';
-import { ProjectListHoverComponent } from './components/shared/project-list-hover/project-list-hover.component';
-import { ModalComponent } from './components/shared/modal/modal.component';
-import { MonthPickerComponent } from './components/shared/month-picker/month-picker.component';
-import { EmptyStateComponent } from './components/shared/empty-state/empty-state.component';
-import { GroupByDatePipe } from './components/shared/pipes/group-by-date/group-by-date.pipe';
-// tslint:disable-next-line:max-line-length
-import { ActivitiesManagementComponent } from './components/options-sidebar/activities/activities-management/activities-management.component';
+import { NavbarComponent } from './modules/shared/components/navbar/navbar.component';
+import { UserComponent } from './modules/shared/components/user/user.component';
+import { SidebarComponent } from './modules/shared/components/sidebar/sidebar.component';
+import { ClockComponent } from './modules/shared/components/clock/clock.component';
+import { TimeClockComponent } from './modules/time-clock/pages/time-clock.component';
+import { ProjectManagementComponent } from './modules/project-management/pages/project-management.component';
+import { TimeEntriesComponent } from './modules/time-entries/pages/time-entries.component';
+import { ProjectListComponent } from './modules/project-management/components/project-list/project-list.component';
+import { CreateProjectComponent } from './modules/project-management/components/create-project/create-project.component';
+import { DetailsFieldsComponent } from './modules/shared/components/details-fields/details-fields.component';
+import { ProjectListHoverComponent } from './modules/time-clock/components/project-list-hover/project-list-hover.component';
+import { ModalComponent } from './modules/shared/components/modal/modal.component';
+import { MonthPickerComponent } from './modules/shared/components/month-picker/month-picker.component';
+import { EmptyStateComponent } from './modules/shared/components/empty-state/empty-state.component';
+import { GroupByDatePipe } from './modules/shared/pipes/group-by-date/group-by-date.pipe';
+import { ActivitiesManagementComponent } from './modules/activities-management/pages/activities-management.component';
+import { ActivityListComponent } from './modules/activities-management/components/activity-list/activity-list.component';
+import { CreateActivityComponent } from './modules/activities-management/components/create-activity/create-activity.component';
 
 
 @NgModule({

src/app/components/options-sidebar/activities/activity-list/activity-list.component.html → src/app/modules/activities-management/components/activity-list/activity-list.component.html

@@ -21,17 +21,11 @@ <h5>Description:</h5>
                             <p>{{activity.description}}</p>
                         </div>
                     </div>
-
                 </div>
             </div>
             <ng-template #notShow>
-                <div class="card">
-                    <div class="card-body">
-                        <h4 class="card-text">There are no activities.</h4>
-                        <h5 class="card-text">Please, create one.</h5>
-                    </div>
-                </div>
+                <app-empty-state></app-empty-state>
             </ng-template>
         </div>
     </div>
-</div>
+</div>

src/app/components/options-sidebar/activities/activity-list/activity-list.component.ts → src/app/modules/activities-management/components/activity-list/activity-list.component.ts

@@ -1,11 +1,11 @@
-import { Activity } from './../model/activity';
 import { Input } from '@angular/core';
 import { Component } from '@angular/core';
+import { Activity } from '../../models';
 
 @Component({
   selector: 'app-activity-list',
   templateUrl: './activity-list.component.html',
-  styleUrls: ['./activity-list.component.css']
+  styleUrls: ['./activity-list.component.scss']
 })
 export class ActivityListComponent {
 

src/app/components/options-sidebar/activities/create-activity/create-activity.component.ts → src/app/modules/activities-management/components/create-activity/create-activity.component.ts

@@ -1,11 +1,11 @@
 import { FormBuilder, Validators, FormGroup } from '@angular/forms';
-import { Activity } from './../model/activity';
 import { Component, Input } from '@angular/core';
+import { Activity } from '../../models';
 
 @Component({
   selector: 'app-create-activity',
   templateUrl: './create-activity.component.html',
-  styleUrls: ['./create-activity.component.css']
+  styleUrls: ['./create-activity.component.scss']
 })
 export class CreateActivityComponent {
 

src/app/modules/activities-management/components/index.ts

@@ -0,0 +1,2 @@
+export * from './activity-list/activity-list.component';
+export * from './create-activity/create-activity.component';

src/app/modules/activities-management/models/index.ts

@@ -0,0 +1 @@
+export * from './activity.model';

src/app/modules/activities-management/pages/activities-management.component.html

@@ -0,0 +1,7 @@
+<div class="parent">
+  <app-create-activity class="item">
+  </app-create-activity>
+
+  <app-activity-list [activities]="activities" class="item">
+  </app-activity-list>
+</div>

src/app/modules/activities-management/pages/activities-management.component.scss

@@ -0,0 +1,21 @@
+.parent {
+    display: flex;
+  }
+
+.item {
+  width: 50%;
+  margin: 2em;
+  min-height: 500px;
+  max-height: 500px;
+}
+
+@media screen and (max-width: 600px){
+  .parent {
+    flex-direction: column-reverse;
+  }
+
+  .item {
+    width: auto;
+    min-height: 200px;
+  }
+}

src/app/components/options-sidebar/activities/activities-management/activities-management.component.spec.ts → src/app/modules/activities-management/pages/activities-management.component.spec.ts

@@ -1,9 +1,8 @@
 import { HttpClient, HttpHandler } from '@angular/common/http';
-import { Activity } from './../model/activity';
+import { async, TestBed } from '@angular/core/testing';
 import { of } from 'rxjs';
+import { Activity } from '../models';
 import { ActivityService } from './../services/activity.service';
-import { async, TestBed } from '@angular/core/testing';
-
 import { ActivitiesManagementComponent } from './activities-management.component';
 
 describe('ActivitiesManagementComponent', () => {

src/app/components/options-sidebar/activities/activities-management/activities-management.component.ts → src/app/modules/activities-management/pages/activities-management.component.ts

@@ -1,11 +1,11 @@
-import { Activity } from './../model/activity';
-import { ActivityService } from './../services/activity.service';
 import { Component, OnInit } from '@angular/core';
+import { ActivityService } from '../services/activity.service';
+import { Activity } from '../models';
 
 @Component({
   selector: 'app-activities-management',
   templateUrl: './activities-management.component.html',
-  styleUrls: ['./activities-management.component.css']
+  styleUrls: ['./activities-management.component.scss']
 })
 export class ActivitiesManagementComponent implements OnInit {
 

src/app/components/options-sidebar/activities/services/activity.service.spec.ts → src/app/modules/activities-management/services/activity.service.spec.ts

@@ -1,7 +1,7 @@
-import {Activity} from './../model/activity';
-import {ActivityService} from './activity.service';
-import {TestBed, inject, async} from '@angular/core/testing';
-import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
+import { TestBed, inject } from '@angular/core/testing';
+import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
+import { Activity } from '../models';
+import { ActivityService } from './activity.service';
 
 describe('Activity Service', () => {
   let service: ActivityService;
@@ -39,5 +39,4 @@ describe('Activity Service', () => {
     expect(getActivitiesRequest.request.method).toBe('GET');
     getActivitiesRequest.flush(activities);
   });
-
 });

src/app/components/options-sidebar/activities/services/activity.service.ts → src/app/modules/activities-management/services/activity.service.ts

@@ -1,7 +1,7 @@
-import { Activity } from './../model/activity';
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
+import { Activity } from '../models';
 
 @Injectable({
   providedIn: 'root'

src/app/components/shared/create-project/create-project.component.spec.ts → src/app/modules/project-management/components/create-project/create-project.component.spec.ts

@@ -1,8 +1,7 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
 import { CreateProjectComponent } from './create-project.component';
-import { Validators, FormBuilder } from '@angular/forms';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
 describe('CreateProjectComponent', () => {
   let component: CreateProjectComponent;