first iteration of autosuggestion #127

src/app/components/create-status/autosuggest/autosuggest.component.ts

@@ -40,11 +40,13 @@ export class AutosuggestComponent implements OnInit {
     }
 
     private lastPatternUsed: string;
+    private lastPatternUsedWtType: string;
     private analysePattern(value: string) {
         const selectedAccount = this.toolsService.getSelectedAccounts()[0];
         const isAccount = value[0] === '@';
         const pattern = value.substring(1);
         this.lastPatternUsed = pattern;
+        this.lastPatternUsedWtType = value;
 
         this.mastodonService.search(selectedAccount, pattern, false)
             .then((results: Results) => {
@@ -75,12 +77,12 @@ export class AutosuggestComponent implements OnInit {
 
     accountSelected(account: Account): boolean {
         const fullHandle = this.toolsService.getAccountFullHandle(account);
-        this.suggestionSelectedEvent.next(new AutosuggestSelection(this.lastPatternUsed, fullHandle));
+        this.suggestionSelectedEvent.next(new AutosuggestSelection(this.lastPatternUsedWtType, fullHandle));
         return false;
     }
 
     hashtagSelected(hashtag: string): boolean {
-        this.suggestionSelectedEvent.next(new AutosuggestSelection(this.lastPatternUsed, hashtag));
+        this.suggestionSelectedEvent.next(new AutosuggestSelection(this.lastPatternUsedWtType, `#${hashtag}`));
         return false;
     }
 }

src/app/components/create-status/create-status.component.html

@@ -11,7 +11,8 @@
         placeholder="What's in your mind?" (keydown.control.enter)="onCtrlEnter()"></textarea>
 
     <app-autosuggest class="status-form__autosuggest" *ngIf="autosuggestData" 
-        [pattern]="autosuggestData"></app-autosuggest>
+        [pattern]="autosuggestData" 
+        (suggestionSelectedEvent)="suggestionSelected($event)"></app-autosuggest>
 
     <div class="status-form__mention-error" *ngIf="mentionTooFarAwayError">Error: mentions must be placed closer to the start in order to use multiposting.</div>
 

src/app/components/create-status/create-status.component.ts

@@ -11,6 +11,7 @@ import { StatusWrapper } from '../../models/common.model';
 import { AccountInfo } from '../../states/accounts.state';
 import { InstancesInfoService } from '../../services/instances-info.service';
 import { MediaService } from '../../services/media.service';
+import { AutosuggestSelection } from './autosuggest/autosuggest.component';
 
 
 @Component({
@@ -182,6 +183,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
     private focus() {
         setTimeout(() => {
             this.replyElement.nativeElement.focus();
+            this.replyElement.nativeElement.setSelectionRange(this.status.length, this.status.length);
         }, 0);
     }
 
@@ -462,4 +464,13 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
     private getMentionsFromStatus(status: string): string[] {
         return status.split(' ').filter(x => x.indexOf('@') === 0 && x.length > 1);
     }
+
+
+    suggestionSelected(selection: AutosuggestSelection){
+        const parsedStatus = this.status.split(' ');
+        if(parsedStatus[parsedStatus.length - 1] === selection.pattern){
+            this.status = `${this.status.replace(new RegExp(`${selection.pattern}$`), selection.autosuggest)} `;
+            this.focus();
+        }
+    }
 }