From 008af1b6748465baadedc10ff82ee2c997ae9a0f Mon Sep 17 00:00:00 2001
From: Alexander Bartsch <mail@alexbartsch.de>
Date: Thu, 6 Dec 2018 17:36:15 +0100
Subject: [PATCH 1/2] Add menu icon to fileslist items and implement
 download-action.

---
 .../client/tabs/uploadedFilesList.html        |  3 ++
 .../client/tabs/uploadedFilesList.js          | 37 +++++++++++++++++++
 .../imports/components/contextual-bar.css     | 24 ++++++++++++
 3 files changed, 64 insertions(+)

diff --git a/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.html b/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.html
index 1722cf1cd44d..8ae8ce53af7e 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.html
+++ b/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.html
@@ -37,6 +37,9 @@
 							<span class="attachments__details">{{formatTimestamp uploadedAt}}</span>
 						</span>
 					</a>
+
+					{{> icon file=. block="attachments-menu js-action" icon="menu"}}
+
 				</li>
 			{{/each}}
 		</ul>
diff --git a/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js b/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js
index 197364bac188..5fc6d77882a5 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js
@@ -1,3 +1,4 @@
+/* globals popover */
 import { Mongo } from 'meteor/mongo';
 import { fixCordova } from 'meteor/rocketchat:lazy-load';
 import { ReactiveVar } from 'meteor/reactive-var';
@@ -119,4 +120,40 @@ Template.uploadedFilesList.events({
 			return t.limit.set(t.limit.get() + 50);
 		}
 	}, 200),
+
+	'click .js-action'(e) {
+		e.currentTarget.parentElement.classList.add('active');
+
+		const config = {
+			columns: [
+				{
+					groups: [
+						{
+							items: [
+								{
+									icon: 'import',
+									name: t('Download'),
+									action: () => {
+										const a = document.createElement('a');
+										a.href = this.file.url;
+										a.download = this.file.name;
+										document.body.appendChild(a);
+										a.click();
+										window.URL.revokeObjectURL(this.file.url);
+										a.remove();
+									},
+								},
+							],
+						},
+					],
+				},
+			],
+			currentTarget: e.currentTarget,
+			onDestroyed:() => {
+				e.currentTarget.parentElement.classList.remove('active');
+			},
+		};
+
+		popover.open(config);
+	},
 });
diff --git a/packages/rocketchat_theme/client/imports/components/contextual-bar.css b/packages/rocketchat_theme/client/imports/components/contextual-bar.css
index fcc4fa6f13ff..0eabaad26ac4 100644
--- a/packages/rocketchat_theme/client/imports/components/contextual-bar.css
+++ b/packages/rocketchat_theme/client/imports/components/contextual-bar.css
@@ -119,15 +119,21 @@
 
 .attachments {
 	&__item {
+		position: relative;
 
 		margin-bottom: 10px;
 
 		transition: background-color 300ms linear;
 
+		&.active,
 		&:hover {
 			cursor: pointer;
 
 			background-color: #f7f8fa;
+
+			.attachments-menu {
+				display: inline-block;
+			}
 		}
 
 		&-link {
@@ -231,6 +237,24 @@
 	}
 }
 
+.attachments-menu {
+	position: absolute;
+	top: 8px;
+	right: 8px;
+
+	display: none;
+
+	color: var(--color-darkest);
+
+	font-size: 16px;
+
+	fill: currentColor;
+
+	&:hover {
+		fill: var(--rc-color-button-primary);
+	}
+}
+
 .contextual-bar__content.mail-messages {
 	& .rc-popup-list {
 		z-index: 1;

From 1d90d10de6a168ef9da541abb9af4bbfd54e8366 Mon Sep 17 00:00:00 2001
From: Tasso Evangelista <tasso.evangelista@rocket.chat>
Date: Fri, 7 Dec 2018 11:46:42 -0200
Subject: [PATCH 2/2] Import global popover

---
 packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js b/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js
index 5fc6d77882a5..542caf317be1 100644
--- a/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js
+++ b/packages/rocketchat-ui-flextab/client/tabs/uploadedFilesList.js
@@ -1,8 +1,8 @@
-/* globals popover */
 import { Mongo } from 'meteor/mongo';
 import { fixCordova } from 'meteor/rocketchat:lazy-load';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { DateFormat } from 'meteor/rocketchat:lib';
+import { popover } from 'meteor/rocketchat:ui';
 import { Template } from 'meteor/templating';
 import _ from 'underscore';