Put tiny “remove quoted text” button back onto quoted text control

app/internal_packages/composer/lib/composer-view.jsx

@@ -29,6 +29,7 @@ const {
   hasBlockquote,
   hasNonTrailingBlockquote,
   hideQuotedTextByDefault,
+  removeQuotedText,
 } = ComposerSupport.BaseBlockPlugins;
 
 // The ComposerView is a unique React component because it (currently) is a
@@ -180,12 +181,30 @@ export default class ComposerView extends React.Component {
       <a
         className="quoted-text-control"
         onMouseDown={e => {
+          if (e.target.closest('.remove-quoted-text')) return;
           e.preventDefault();
           e.stopPropagation();
           this.setState({ quotedTextHidden: false });
         }}
       >
         <span className="dots">&bull;&bull;&bull;</span>
+        <span
+          className="remove-quoted-text"
+          onMouseUp={e => {
+            e.preventDefault();
+            e.stopPropagation();
+            const { draft, session } = this.props;
+            const change = removeQuotedText(draft.bodyEditorState);
+            session.changes.add({ bodyEditorState: change.value });
+            this.setState({ quotedTextHidden: false });
+          }}
+        >
+          <RetinaImg
+            title="Remove quoted text"
+            name="image-cancel-button.png"
+            mode={RetinaImg.Mode.ContentPreserve}
+          />
+        </span>
       </a>
     );
   }

app/src/components/composer-editor/base-block-plugins.jsx

@@ -249,20 +249,33 @@ export function allNodesInBFSOrder(value) {
   return all;
 }
 
+function isQuoteNode(n) {
+  return (
+    n.type === 'blockquote' ||
+    (n.data && n.data.get('className') && n.data.get('className').includes('gmail_quote'))
+  );
+}
+
 export function lastUnquotedNode(value) {
   const all = allNodesInBFSOrder(value);
   for (let idx = 0; idx < all.length; idx++) {
     const n = all[idx];
-    if (
-      n.type === 'blockquote' ||
-      (n.data && n.data.get('className') && n.data.get('className').includes('gmail_quote'))
-    ) {
+    if (isQuoteNode(n)) {
       return all[Math.max(0, idx - 1)];
     }
   }
   return all[0];
 }
 
+export function removeQuotedText(value) {
+  const change = value.change();
+  let quoteBlock = null;
+  while ((quoteBlock = allNodesInBFSOrder(change.value).find(isQuoteNode))) {
+    change.removeNodeByKey(quoteBlock.key);
+  }
+  return change;
+}
+
 export function hideQuotedTextByDefault(draft) {
   if (draft.isForwarded()) {
     return false;

app/static/components/extra.less

@@ -6,10 +6,10 @@
   display: inline-block;
   border: 1px solid fade(@text-color-very-subtle, 15%);
   border-radius: 3px;
-  line-height: 10px;
+  line-height: 11px;
   padding: 1px 5px;
   font-weight: 600;
-  font-size: @font-size-smaller;
+  font-size: 10.5px;
   margin: 5px 0 3px 0;
 
   &:hover {