Add New publication component

src/app/pages/publications/publications.module.ts

@@ -9,6 +9,7 @@ import { PublicationsPageRoutingModule } from './publications-routing.module';
 import { PublicationsPage } from './publications.page';
 import { SharedModule } from 'src/app/shared/shared.module';
 import { ViewPublicationsPage } from 'src/app/shared/publication/view-publications/view-publications.page';
+import { NewPublicationPage } from 'src/app/shared/publication/new-publication/new-publication.page';
 
 
 @NgModule({
@@ -21,7 +22,8 @@ import { ViewPublicationsPage } from 'src/app/shared/publication/view-publicatio
   ],
   declarations: [
     PublicationsPage,
-    ViewPublicationsPage
+    ViewPublicationsPage,
+    NewPublicationPage
   ]
 })
 export class PublicationsPageModule {}

src/app/pages/publications/publications.page.html

@@ -62,16 +62,26 @@
     </div>
 
     <!-- Right -->
-    <div class="d-none d-md-flex flex-grow-1 flex-column max-width-60">
-      <!-- <app-view-publications></app-view-publications>   -->
-
+    <div class="d-none d-md-flex flex-grow-1 flex-column max-width-60"
+      style="border-left: 1px solid #d8d8d8;">
+     
+      <!-- View Publication -->
       <app-view-publications 
         *ngIf="desktopComponent.showViewPublication"
         [folderId]="folderId"
         class="height-100 d-flex flex-column overflow-hidden"
+        (addNewPublication)="addNewPublication($event)"
       >
       </app-view-publications>
 
+      <app-new-publication *ngIf="desktopComponent.showAddNewPublication"
+        class="height-100 d-flex flex-column overflow-hidden background-white"
+        [folderId]="folderId"
+        [publicationType]="publicationType"
+        (closeDesktopComponent)="closeDesktopComponent"
+      >
+      </app-new-publication>
+
     </div>
 
   </div>

src/app/pages/publications/publications.page.ts

@@ -34,9 +34,11 @@ export class PublicationsPage implements OnInit {
 
   desktopComponent: any = {
     showViewPublication: false,
+    showAddNewPublication: false
   }
 
   folderId: string;
+  publicationType: any;
 
   constructor(
     private router: Router, 
@@ -96,6 +98,9 @@ export class PublicationsPage implements OnInit {
   }
 
   async AddPublicationFolder(item:any) {
+    
+    this.closeDesktopComponent();
+    
     const modal = await this.modalController.create({
       component: NewActionPage,
       componentProps:{
@@ -137,6 +142,7 @@ export class PublicationsPage implements OnInit {
     }
  
 
+    this.closeDesktopComponent();
 
     // OpenModal
     if( window.innerWidth <= 1024){
@@ -164,4 +170,26 @@ export class PublicationsPage implements OnInit {
 
   }
 
-}
+  async addNewPublication({publicationType, folderId}){
+
+    this.closeDesktopComponent();
+
+    // propr to add new publication
+    this.publicationType = publicationType;
+    this.folderId = folderId;
+    
+    this.desktopComponent.showAddNewPublication = true;
+  }
+
+  async closeDesktopComponent (){
+
+    this.desktopComponent.showViewPublication = false;
+    this.desktopComponent.showAddNewPublication = false;
+
+    this.desktopComponent = {
+      showViewPublication: false,
+      showAddNewPublication: false
+    }
+  }
+
+}