import Component from '@ember/component';
import $ from 'jquery';
import { computed } from '@ember/object';
import config from 'ember-get-config';


function sendFeedback(body, followup, { componentID, priorityID, extra } = {}) {
    let { url } = config.microfeedback;
    const payload = {
        body,
        extra: Object.assign({}, {
            followup,
        }, extra),
    };
    if (url) {
        // Add componentID to query params if provided
        const params = {};
        if (componentID) {
            params.componentID = componentID;
        }
        if (priorityID) {
            params.priorityID = priorityID;
        }
        const query = $.param(params);
        url += `?${query}`;

        return $.ajax(url, {
            method: 'POST',
            contentType: 'application/json',
            dataType: 'json',
            data: JSON.stringify(payload),
        });
    } else { // Log feedback in development environments
        /* eslint-disable no-console */
        console.warn('MICROFEEDBACK_URL is not configured. Feedback will only be logged to the console.');
        console.debug('DEBUG: MicroFeedback payload:');
        console.debug(payload);
        /* eslint-enable no-console */
    }
}

export default Component.extend({
    body: '',
    text: '',
    followup: false,
    // Valid states: null (unopened), 'active', 'success'
    state: null,
    dialogRows: 5,
    componentID: null,
    open: computed('state', function() {
        const state = this.get('state');
        return state === 'active' || state === 'success';
    }),
    active: computed('state', function() {
        return this.get('state') === 'active';
    }),
    success: computed('state', function() {
        return this.get('state') === 'success';
    }),
    modalClass: computed('styleNamespace', function() {
        return `${this.get('styleNamespace')}Modal`;
    }),
    actions: {
        showDialog() {
            this.set('state', 'active');
        },
        hideDialog() {
            this.set('state', null);
            this.reset();
        },
        submit() {
            const body = this.get('body');
            // Dismiss if no input
            if (!body) {
                this.set('state', null);
                this.reset();
                return;
            }
            const followup = this.get('followup');
            // Optimistically display success message
            this.set('state', 'success');
            this.reset();
            sendFeedback(
                body,
                followup,
                {
                    componentID: this.get('componentID'),
                    priorityID: this.get('priorityID'),
                },
            );
        },
    },
    reset() {
        this.set('body', '');
        this.set('followup', false);
    },
    priorityID: config.microfeedback.JIRA.priorities.Not_Selected,
});

@@ -169,16 +169,32 @@
 ck(body,
+ %7B%0A    user,%0A   
  followu
@@ -195,18 +195,20 @@
 ollowup,
+%0A  
  
-%7B
  compone
@@ -212,16 +212,20 @@
 onentID,
+%0A   
  priorit
@@ -232,15 +232,20 @@
 yID,
+%0A   
  extra
- 
+,%0A
 %7D = 
@@ -304,100 +304,249 @@
 nst 
-payload = %7B%0A        body,%0A        extra: Object.assign(%7B%7D, %7B%0A            followup,%0A        %7D
+extraBase = %7B followup %7D;%0A    if (user) %7B%0A        const userLink = %60%5B$%7Buser.get('fullName')%7D%7C$%7Buser.get('profileURL')%7D%5D%60;%0A        extraBase.user = userLink;%0A    %7D%0A    const payload = %7B%0A        body,%0A        extra: Object.assign(%7B%7D, extraBase
 , ex
@@ -1496,16 +1496,32 @@
  false,%0A
+    user: null,%0A
     // V
@@ -2514,59 +2514,8 @@
   %7D%0A
-            const followup = this.get('followup');%0A
     
@@ -2610,34 +2610,8 @@
 ');%0A
-            this.reset();%0A
     
@@ -2674,35 +2674,105 @@
     
-followup,%0A                %7B
+%7B%0A                    followup: this.get('followup'),%0A                    user: this.get('user'),
 %0A   
@@ -2916,16 +2916,42 @@
      );%0A
+            this.reset();%0A
         

Include user in issue