remove signal gear icon, and show back ours on calculatingPow

this is used for a message in the message list and in the conversation
list item

images/gear.svg

@@ -1,22 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 51 (57462) - http://www.bohemiancoding.com/sketch -->
-    <title>Gear/gear-20</title>
-    <desc>Created with Sketch.</desc>
-    <defs>
-        <path d="M17.43,10.98 C17.47,10.66 17.5,10.34 17.5,10 C17.5,9.66 17.47,9.34 17.43,9.02 L19.54,7.37 C19.73,7.22 19.78,6.95 19.66,6.73 L17.66,3.27 C17.54,3.05 17.27,2.97 17.05,3.05 L14.56,4.05 C14.04,3.65 13.48,3.32 12.87,3.07 L12.49,0.42 C12.46,0.18 12.25,0 12,0 L8,0 C7.75,0 7.54,0.18 7.51,0.42 L7.13,3.07 C6.52,3.32 5.96,3.66 5.44,4.05 L2.95,3.05 C2.72,2.96 2.46,3.05 2.34,3.27 L0.34,6.73 C0.21,6.95 0.27,7.22 0.46,7.37 L2.57,9.02 C2.53,9.34 2.5,9.67 2.5,10 C2.5,10.33 2.53,10.66 2.57,10.98 L0.46,12.63 C0.27,12.78 0.22,13.05 0.34,13.27 L2.34,16.73 C2.46,16.95 2.73,17.03 2.95,16.95 L5.44,15.95 C5.96,16.35 6.52,16.68 7.13,16.93 L7.51,19.58 C7.54,19.82 7.75,20 8,20 L12,20 C12.25,20 12.46,19.82 12.49,19.58 L12.87,16.93 C13.48,16.68 14.04,16.34 14.56,15.95 L17.05,16.95 C17.28,17.04 17.54,16.95 17.66,16.73 L19.66,13.27 C19.78,13.05 19.73,12.78 19.54,12.63 L17.43,10.98 Z M10,13.5 C8.07,13.5 6.5,11.93 6.5,10 C6.5,8.07 8.07,6.5 10,6.5 C11.93,6.5 13.5,8.07 13.5,10 C13.5,11.93 11.93,13.5 10,13.5 Z" id="path-1"></path>
-        <rect id="path-3" x="0" y="0" width="40" height="40"></rect>
-    </defs>
-    <g id="Gear/gear-20" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <mask id="mask-2" fill="white">
-            <use xlink:href="#path-1"></use>
-        </mask>
-        <g id="Shape" fill-rule="nonzero"></g>
-        <g id="Primitives/Color/Black" mask="url(#mask-2)">
-            <mask id="mask-4" fill="white">
-                <use xlink:href="#path-3"></use>
-            </mask>
-            <use id="fill" fill="#000000" fill-rule="evenodd" xlink:href="#path-3"></use>
-        </g>
-    </g>
-</svg>

js/background.js

@@ -72,7 +72,6 @@
     'file.svg',
     'folder-outline.svg',
     'forward.svg',
-    'gear.svg',
     'hourglass_empty.svg',
     'hourglass_full.svg',
     'icon_1024.png',

stylesheets/_modules.scss

@@ -1130,14 +1130,6 @@
   text-align: center;
 }
 
-.module-conversation-header__gear-icon {
-  @include color-svg('../images/gear.svg', $color-gray-60);
-  height: 20px;
-  width: 20px;
-  margin-inline-start: 4px;
-  cursor: pointer;
-}
-
 // Module: Message Detail
 
 .module-message-detail {
@@ -1227,6 +1219,12 @@
     infinite;
 }
 
+.module-message-detail__contact__status-icon--pow {
+  @include color-svg('../images/session/gear.svg', $color-gray-60);
+  animation: module-message-detail__contact__status-icon--spinning 4s linear
+    infinite;
+}
+
 @keyframes module-message-detail__contact__status-icon--spinning {
   100% {
     -webkit-transform: rotate(360deg);
@@ -1620,6 +1618,12 @@
     linear infinite;
 }
 
+.module-conversation-list-item__message__status-icon--pow {
+  @include color-svg('../images/session/gear.svg', $color-light-35);
+  animation: module-conversation-list-item__message__status-icon--spinning 4s
+    linear infinite;
+}
+
 @keyframes module-conversation-list-item__message__status-icon--spinning {
   100% {
     -webkit-transform: rotate(360deg);

ts/components/conversation/Message.tsx

@@ -61,7 +61,7 @@ export interface Props {
   direction: 'incoming' | 'outgoing';
   timestamp: number;
   serverTimestamp?: number;
-  status?: 'sending' | 'sent' | 'delivered' | 'read' | 'error';
+  status?: 'sending' | 'sent' | 'delivered' | 'read' | 'error' | 'pow';
   // What if changed this over to a single contact like quote, and put the events on it?
   contact?: Contact & {
     hasSignalAccount: boolean;
@@ -240,6 +240,7 @@ export class Message extends React.PureComponent<Props, State> {
       .filter(i => !!i);
   }
 
+  // tslint:disable-next-line: cyclomatic-complexity
   public renderMetadata() {
     const {
       collapseMetadata,
@@ -264,11 +265,13 @@ export class Message extends React.PureComponent<Props, State> {
       !textPending &&
       direction === 'outgoing' &&
       status !== 'error' &&
-      status !== 'sending';
+      status !== 'sending' &&
+      status !== 'pow';
 
     const showSending =
-      !textPending && direction === 'outgoing' && status === 'sending';
-
+      !textPending &&
+      direction === 'outgoing' &&
+      (status === 'sending' || status === 'pow');
     return (
       <div
         className={classNames(
@@ -634,7 +637,6 @@ export class Message extends React.PureComponent<Props, State> {
     if (!quote || !quote.authorPhoneNumber) {
       return null;
     }
-    // console.warn('quote render ' , quote)
 
     const withContentAbove =
       conversationType === 'group' && direction === 'incoming';

ts/components/session/SessionInboxView.tsx

@@ -162,7 +162,8 @@ export class SessionInboxView extends React.Component<Props, State> {
 
   private async handleMessageSentFailure(
     sentMessage: RawMessage | OpenGroupMessage,
-    error: any) {
+    error: any
+  ) {
     const fetchedData = await this.fetchHandleMessageSentData(sentMessage);
     if (!fetchedData) {
       return;