non-ugly note composer

vivganes · Nov 19, 2023 · 390b711 · 390b711
1 parent 44b4a60
commit 390b711
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 4 deletions.
diff --git a/src/app/component/note-composer/note-composer.component.html b/src/app/component/note-composer/note-composer.component.html
@@ -1,4 +1,4 @@
-<div class="{{ 'clr-row clr-justify-content-center'+ (isReply? 'clr-row reply-card' : '') }}">
+<div *ngIf="isActivated" class="{{ 'clr-row clr-justify-content-center'+ (isReply? ' reply-card' : '') }}">
     <div class="{{ isReply ? 'clr-col-12' :'clr-col-md-8 clr-col-12' }}">
         <div class="card">
             <div class="card-block">
@@ -33,3 +33,17 @@
     </div>
 </div>
 
+<div *ngIf="!isActivated" class="{{ 'clr-row clr-justify-content-center'+ (isReply? ' reply-card' : '') }}">
+    <div class="{{ isReply ? 'clr-col-12' :'clr-col-md-8 clr-col-12' }}">
+                <div class="clr-row clr-justify-content-left">
+                    <div class="clr-col-md-1 clr-col-2 pt-10">
+                        <app-user-pic-and-name [onlyPic]="true" [user]="ndkProvider.currentUser"/>
+                    </div>                    
+                    <div class="card clickable clr-col-md-11 clr-col-10 mt-0" (click)="activate()">
+                        <h3 class="card-header">Create new note</h3>
+                    </div>
+                </div>
+
+            </div>
+
+</div>
diff --git a/src/app/component/note-composer/note-composer.component.ts b/src/app/component/note-composer/note-composer.component.ts
@@ -4,7 +4,7 @@ import { User } from 'src/app/model/user';
 import { NdkproviderService } from 'src/app/service/ndkprovider.service';
 import { LoginUtil } from 'src/app/util/LoginUtil';
 import { ZappeditdbService } from '../../service/zappeditdb.service';
-import { NDKEvent } from '@nostr-dev-kit/ndk';
+import { NDKEvent, NDKPrivateKeySigner } from '@nostr-dev-kit/ndk';
 import Uploader from 'src/app/util/Uploader';
 import { Community } from 'src/app/model/community';
 import { ObjectCacheService } from 'src/app/service/object-cache.service';
@@ -26,6 +26,9 @@ export class NoteComposerComponent {
   static loggedInWithNpub:boolean = false;
   NoteComposerComponent = NoteComposerComponent;
 
+  @Input()
+  isActivated:boolean = false;
+
   @Input()
   isReply:boolean = false;
 
@@ -51,13 +54,17 @@ export class NoteComposerComponent {
   searchResults$: Observable<any[]> = of([]);
   uploadingNow: boolean = false;
   uploadError?: string;
+  ndkProvider: NdkproviderService;
   private searchTermStream = new Subject<string>();
 
-  constructor(private ndkProvider: NdkproviderService, private objectCache:ObjectCacheService){
-
+  constructor(ndkProvider: NdkproviderService, private objectCache:ObjectCacheService){
+    this.ndkProvider = ndkProvider;
   }
 
   ngOnInit() {
+    if(this.isReply){
+      this.isActivated = true;
+    }
     this.searchTermStream
       .subscribe((value:string) => {
         this.searchResults$ = this.getItems(value);
@@ -68,6 +75,10 @@ export class NoteComposerComponent {
       })
   }
 
+  activate(){
+    this.isActivated = true;
+  }
+
   getItems(term:string): Observable<User[]> {
     if (!term) {
       // if the search term is empty, return an empty array

diff --git a/src/styles.scss b/src/styles.scss
@@ -152,6 +152,14 @@ letter-spacing:var(--cds-global-typography-message-letter-spacing);
   font-weight: bold;
 }
 
+.mt-0{
+  margin-top:0px;
+}
+
+.pt-10{
+  padding-top: 10px;
+}
+
 a{
   overflow-wrap: anywhere!important
 }