Merge remote-tracking branch 'justin/feature/edit-message-title' into feature/replies-lookup

2 years ago · cc5c7a364f
8 changed files with 67 additions and 37 deletions
--- a/qortal-ui-core/font/switch-theme.css
+++ b/qortal-ui-core/font/switch-theme.css
@ -9,7 +9,7 @@ html {
  --copybutton: #707584;
  --chat-group: #080808;
  --chat-bubble: #9f9f9f0a;
-  --chat-bubble-bg: #f3f3f3;
+  --chat-bubble-bg: #e6e6e6;
  --chat-bubble-msg-color: #080808;
  --reaction-bubble-outline: #6b6969;
  --chat-menu-bg: #ffffff;
--- a/qortal-ui-core/language/us.json
+++ b/qortal-ui-core/language/us.json
@ -572,8 +572,8 @@
      "cchange63": "Enter Enabled",
      "cchange64": "Enter Disabled",
      "cchange65": "Please enter a recipient",
-      "cchange66": "Cannot fetch replied-to message. Message is too old."
-
+      "cchange66": "Cannot fetch replied-to message. Message is too old.",
+      "cchange68": "edited"
   },
   "welcomepage": {
      "wcchange1": "Welcome to Q-Chat",
--- a/qortal-ui-core/src/styles/switch-theme.css
+++ b/qortal-ui-core/src/styles/switch-theme.css
@ -9,7 +9,7 @@ html {
  --copybutton: #707584;
  --chat-group: #080808;
  --chat-bubble: #9f9f9f0a;
-  --chat-bubble-bg: #f3f3f3;
+  --chat-bubble-bg: #e6e6e6;
  --chat-bubble-msg-color: #080808;
  --reaction-bubble-outline: #6b6969;
  --chat-menu-bg: #ffffff;
--- a/qortal-ui-crypto/api/constants.js
+++ b/qortal-ui-crypto/api/constants.js
@ -159,7 +159,7 @@ const ADDRESS_VERSION = 58
 const PROXY_URL = "/proxy/"

 // Chat reference timestamp
-const CHAT_REFERENCE_FEATURE_TRIGGER_TIMESTAMP = 0
+const CHAT_REFERENCE_FEATURE_TRIGGER_TIMESTAMP = 1674316800000

 // Used as a salt for all qora addresses. Salts used for storing your private keys in local storage will be randomly generated
 const STATIC_SALT = new Uint8Array([54, 190, 201, 206, 65, 29, 123, 129, 147, 231, 180, 166, 171, 45, 95, 165, 78, 200, 208, 194, 44, 207, 221, 146, 45, 238, 68, 68, 69, 102, 62, 6])
--- a/qortal-ui-plugins/plugins/core/components/ChatPage.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatPage.js
@ -147,7 +147,6 @@ class ChatPage extends LitElement {
        width: 800px;
    }

-
    .close-icon {
        color: #676b71;
        width: 18px;
@ -375,9 +374,9 @@ class ChatPage extends LitElement {

  .repliedTo-message p mark {
 	background-color: #ffe066;
-  border-radius: 0.25em;
-  box-decoration-break: clone;
-  padding: 0.125em 0;
+    border-radius: 0.25em;
+    box-decoration-break: clone;
+    padding: 0.125em 0;
  }

  .reply-icon {
@ -979,17 +978,20 @@ class ChatPage extends LitElement {
                                        <vaadin-icon class="reply-icon" icon="vaadin:reply" slot="icon"></vaadin-icon>
                                        <div class="repliedTo-message">
                                            <p class="senderName">${this.repliedToMessageObj.senderName ? this.repliedToMessageObj.senderName : this.repliedToMessageObj.sender}</p>
-                                            ${this.repliedToMessageObj.toString() === '1' ? html`
-                                        ${this.repliedToMessageObj.message}
-                                        ` : ''}
-                                        ${this.repliedToMessageObj.toString() === '2' ? html`
-                                        ${unsafeHTML(generateHTML(this.repliedToMessageObj.message, [
-                    StarterKit,
-                    Underline,
-                    Highlight
-                    // other extensions …
-                  ]))}    ` : ''}
-                                            
+                                            ${this.repliedToMessageObj.version.toString() === '1' ? html`
+                                            ${this.repliedToMessageObj.message}
+                                            ` : ''}
+                                            ${this.repliedToMessageObj.version.toString() === '2' 
+                                            ? html`
+                                                ${unsafeHTML(generateHTML(this.repliedToMessageObj.message, 
+                                                [
+                                                    StarterKit,
+                                                    Underline,
+                                                    Highlight
+                                                    // other extensions …
+                                                ]))}
+                                            ` 
+                                            : ''}
                                        </div>
                                        <vaadin-icon
                                            class="close-icon"
@ -1006,12 +1008,13 @@ class ChatPage extends LitElement {
                                        <vaadin-icon class="reply-icon" icon="vaadin:pencil" slot="icon"></vaadin-icon>
                                        <div class="repliedTo-message">
                                            <p class="senderName">${translate("chatpage.cchange25")}</p>
-                                            ${unsafeHTML(generateHTML(this.editedMessageObj.message, [
-                    StarterKit,
-                    Underline,
-                    Highlight
-                    // other extensions …
-                  ]))}
+                                                ${unsafeHTML(generateHTML(this.editedMessageObj.message, 
+                                                [
+                                                    StarterKit,
+                                                    Underline,
+                                                    Highlight
+                                                    // other extensions …
+                                                ]))}
                                        </div>
                                        <vaadin-icon
                                            class="close-icon"
--- a/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js
@ -85,9 +85,9 @@ export const chatStyles = css`
 		color: #888888;
 		font-size: 13px;
 		user-select: none;
-		float: right;
-    padding-left: 15px;
-    text-align: right;
+		display: flex;
+		width: 100%;	
+		padding-top: 2px;
 	}

 	.message-data-time-hidden {
@ -96,10 +96,9 @@ export const chatStyles = css`
 		color: #888888;
 		font-size: 13px;
 		user-select: none;
-		float: right;
-    padding-left: 15px;
-		padding-bottom: 3px;
-		text-align: right;
+		display: flex;
+		width: 100%;
+		padding-top: 2px;
 	}

 	.message-user-info {
@ -643,6 +642,13 @@ export const chatStyles = css`
    margin: 2rem 0;
  }

+	.edited-message-style {
+		font-family: "Work Sans", sans-serif;
+    font-style: italic;
+    font-size: 13px;
+    visibility: visible;
+	}
+
  .blink-bg{
 	border-radius: 8px;
 		animation: blinkingBackground 3s;
@ -652,4 +658,6 @@ export const chatStyles = css`

 		100%	        { background-color:rgba(var(--menuactivergb), 0)}
 	}
+
+
 `
--- a/qortal-ui-plugins/plugins/core/components/ChatScroller.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatScroller.js
@ -341,6 +341,7 @@ class MessageTemplate extends LitElement {
        let isImageDeleted = false;
        let version = 0;
        let isForwarded = false
+        let isEdited = false
        try {
            const parsedMessageObj = JSON.parse(this.messageObj.decodedMessage);
            if(parsedMessageObj.version.toString() === '2'){
@ -358,6 +359,7 @@ class MessageTemplate extends LitElement {
            reactions = parsedMessageObj.reactions || [];
            version = parsedMessageObj.version
            isForwarded = parsedMessageObj.type === 'forward'
+            isEdited = this.messageObj.editedTimestamp && true
           if (parsedMessageObj.images && Array.isArray(parsedMessageObj.images) && parsedMessageObj.images.length > 0) {
                image = parsedMessageObj.images[0];
            }
@ -372,6 +374,7 @@ class MessageTemplate extends LitElement {
        let levelFounder = '';
        let hideit = hidemsg.includes(this.messageObj.sender);
        let forwarded = ''
+        let edited = ''

        levelFounder = html`<level-founder checkleveladdress="${this.messageObj.sender}"></level-founder>`;
        if (this.messageObj.senderName) {
@ -435,6 +438,12 @@ class MessageTemplate extends LitElement {
        </span>
        `;

+        edited = html`
+        <span class="edited-message-style">
+            ${translate("chatpage.cchange68")}
+        </span>
+        `;
+
        if (repliedToData) {
            try {
                const parsedMsg =  JSON.parse(repliedToData.decodedMessage);
@ -590,7 +599,11 @@ class MessageTemplate extends LitElement {
                                        ${version.toString() === '1' ? html`
                                        ${unsafeHTML(this.emojiPicker.parse(replacedMessage))}
                                        ` : ''}
-                                        <div class="${((this.isFirstMessage === false && 
+                                        <div 
+                                            style=${isEdited 
+                                            ? "justify-content: space-between;" 
+                                            : "justify-content: flex-end;"}
+                                            class="${((this.isFirstMessage === false && 
                                            this.isSingleMessageInGroup === true && 
                                            this.isLastMessageInGroup === true) || 
                                            (this.isFirstMessage === true && 
@ -599,6 +612,14 @@ class MessageTemplate extends LitElement {
                                            ? 'message-data-time'
                                            : 'message-data-time-hidden'
                                        }">
+                                            ${isEdited ? 
+                                                html`
+                                                    <span>
+                                                        ${edited}
+                                                    </span>
+                                                    `
+                                                : null
+                                            }
                                            <message-time timestamp=${this.messageObj.timestamp}></message-time>
                                        </div>
                                    </div>
@ -858,7 +879,7 @@ class ChatMenu extends LitElement {
                        this.versionErrorSnack()
                        return
                    }
-                    this.setRepliedToMessageObj(this.originalMessage);
+                    this.setRepliedToMessageObj({...this.originalMessage, version: this.version});
                    }}">
                    <vaadin-icon icon="vaadin:reply" slot="icon"></vaadin-icon>
                </div>
--- a/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
+++ b/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
@ -163,8 +163,6 @@ class Chat extends LitElement {
    }

    render() {
-        console.log(12, "q-chat here");
-        console.log(window.location.href);
        return html`
            <div class="container clearfix">
                <div class="people-list" id="people-list">