From 573703b57885b4bbc21ad0eafa6d005f0d479d78 Mon Sep 17 00:00:00 2001
From: Gabriel Handford <gabrielh@gmail.com>
Date: Wed, 9 Sep 2020 16:19:03 -0700
Subject: [PATCH] v0.1.15 (#38)

---
 RELEASE.md                                |  2 +-
 package.json                              |  2 +-
 src/renderer/components/dialog.tsx        | 16 ++++++-----
 src/renderer/views/export/index.tsx       |  5 ++--
 src/renderer/views/key/content.tsx        | 16 +++--------
 src/renderer/views/key/description.tsx    | 18 -------------
 src/renderer/views/key/label.tsx          | 33 +++++++++++++++++++++++
 src/renderer/views/key/remove.tsx         |  6 ++---
 src/renderer/views/keys/autocomplete.tsx  |  6 ++---
 src/renderer/views/keys/autocompletes.tsx |  6 ++---
 src/renderer/views/keys/index.tsx         |  7 ++---
 src/renderer/views/keys/select.tsx        |  4 +--
 src/renderer/views/search/view.tsx        |  6 ++---
 src/renderer/views/textinput/index.tsx    |  2 +-
 src/renderer/views/user/label.tsx         |  6 ++++-
 src/renderer/views/verify/signer.tsx      |  5 ++--
 16 files changed, 75 insertions(+), 65 deletions(-)
 delete mode 100644 src/renderer/views/key/description.tsx
 create mode 100644 src/renderer/views/key/label.tsx

diff --git a/RELEASE.md b/RELEASE.md
index 99b4b09..a37bd98 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -2,9 +2,9 @@
 
 - Release the service at keys-pub/keys-ext.
 - Update package.json version.
+- Test updater: `VERSION=0.0.0 KEYS_BIN=~/go/bin/keys UPDATER_BIN=~/go/bin/updater UPDATER_APPLY=/Applications/Keys.app yarn start-prod` to ensure this version is updateable. (On Windows, `VERSION=0.0.0 KEYS_BIN=~/go/bin/keys.exe UPDATER_BIN=~/go/bin/updater.exe yarn start-prod`)
 - Create branch with version v1.2.3, the github action will build the apps.
 - Save app release as prerelease (from draft).
-- Test updater with `VERSION=0.0.0 KEYS_BIN=~/go/bin/keys UPDATER_BIN=~/go/bin/updater UPDATER_APPLY=/Applications/Keys.app yarn start-prod` to ensure this version is updateable. (On both windows and macOS.)
 
 ## Prerelease to Release
 
diff --git a/package.json b/package.json
index 890ed89..e836dee 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "keys",
   "productName": "Keys",
-  "version": "0.1.14",
+  "version": "0.1.15",
   "description": "Key management, signing and encryption.",
   "scripts": {
     "dev": "rimraf build && yarn webpack --env.NODE_ENV=development --env.target=render && yarn webpack --env.NODE_ENV=development --env.target=main",
diff --git a/src/renderer/components/dialog.tsx b/src/renderer/components/dialog.tsx
index 006b94f..33fe5c8 100644
--- a/src/renderer/components/dialog.tsx
+++ b/src/renderer/components/dialog.tsx
@@ -23,14 +23,16 @@ type DialogTitleProps = {
 
 const DialogTitle = (props: DialogTitleProps) => {
   return (
-    <Box display="flex" flexDirection="column" className="drag">
+    <Box display="flex" flexDirection="column">
       <Box display="flex" flexGrow={1} flexDirection="row">
-        <Typography
-          style={{paddingBottom: 3, paddingLeft: 20, paddingTop: 10, fontSize: 19, fontWeight: 500}}
-        >
-          {props.children}
-        </Typography>
-        <Box display="flex" flex={1} flexGrow={1} flexDirection="row" />
+        <Box className="drag">
+          <Typography
+            style={{paddingBottom: 3, paddingLeft: 20, paddingTop: 10, fontSize: 20, fontWeight: 500}}
+          >
+            {props.children}
+          </Typography>
+        </Box>
+        <Box display="flex" flex={1} flexGrow={1} flexDirection="row" className="drag" />
         {props.onClose && (
           <Box style={{marginTop: 12, marginRight: 10}}>
             <IconButton size="small" aria-label="close" color="inherit" onClick={props.onClose}>
diff --git a/src/renderer/views/export/index.tsx b/src/renderer/views/export/index.tsx
index f0a6ba1..020c702 100644
--- a/src/renderer/views/export/index.tsx
+++ b/src/renderer/views/export/index.tsx
@@ -14,7 +14,7 @@ import {
   Typography,
 } from '@material-ui/core'
 
-import KeyDescription from '../key/description'
+import {KeyLabel} from '../key/label'
 
 import {styles, DialogTitle} from '../../components'
 import {Key, ExportType, KeyExportRequest, KeyExportResponse} from '../../rpc/keys.d'
@@ -92,11 +92,10 @@ export default class KeyExportDialog extends React.Component<Props, State> {
   }
 
   renderExport() {
-    // TODO: Export type
     return (
       <Box display="flex" flexDirection="column" style={{height: 200}}>
         <Box style={{paddingBottom: 20}}>
-          <KeyDescription k={this.props.k} />
+          <KeyLabel k={this.props.k} full />
         </Box>
         <FormControl error={!!this.state.error}>
           <TextField
diff --git a/src/renderer/views/key/content.tsx b/src/renderer/views/key/content.tsx
index c668bea..4ec02b3 100644
--- a/src/renderer/views/key/content.tsx
+++ b/src/renderer/views/key/content.tsx
@@ -1,9 +1,8 @@
 import * as React from 'react'
-import {CSSProperties} from 'react'
 
 import {Box, Button, Table, TableBody, TableCell, TableRow, Typography} from '@material-ui/core'
 
-import {Skeleton} from '@material-ui/lab'
+import {IDLabel} from './label'
 
 import {shell} from 'electron'
 
@@ -15,18 +14,11 @@ import UserLabel from '../user/label'
 
 import {keyDescription, dateString} from '../helper'
 
-export const IDView = (props: {id: string; owner?: boolean}) => {
-  const style: CSSProperties = {}
-  if (props.owner) style.fontWeight = 600
-  // width: 520, wordWrap: 'break-word', wordBreak: 'break-all'
-  return <Typography style={{...styles.mono, ...style}}>{props.id}</Typography>
-}
-
 export const KeyDescriptionView = (props: {value: Key}) => {
   return <Typography>{keyDescription(props.value)}</Typography>
 }
 
-type UserProps = {
+type UserRowProps = {
   k: Key
   revoke: () => void
   userSign: (service: string) => void
@@ -34,7 +26,7 @@ type UserProps = {
   openURL: (url: string) => void
 }
 
-export const UserRow = (props: UserProps) => {
+const UserRow = (props: UserRowProps) => {
   const key = props.k
   const user = key.user
   const signable = key.type == KeyType.EDX25519
@@ -144,7 +136,7 @@ export default (props: Props) => {
             </TableCell>
             <TableCell style={{...cstyles.cell, paddingBottom: 10}}>
               <Box display="flex" flexDirection="column">
-                <IDView id={kid} />
+                <IDLabel k={key} />
               </Box>
             </TableCell>
           </TableRow>
diff --git a/src/renderer/views/key/description.tsx b/src/renderer/views/key/description.tsx
deleted file mode 100644
index f33fe58..0000000
--- a/src/renderer/views/key/description.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import * as React from 'react'
-
-import {IDView} from './content'
-import UserLabel from '../user/label'
-import {Box, Button, Table, TableBody, TableCell, TableRow, Typography} from '@material-ui/core'
-
-import {Key, KeyType, User} from '../../rpc/keys.d'
-
-type Props = {
-  k: Key
-}
-
-export default (props: Props) => (
-  <Box display="flex" flexDirection="column">
-    <IDView id={props.k.id || ''} />
-    {props.k.user && <UserLabel user={props.k.user} />}
-  </Box>
-)
diff --git a/src/renderer/views/key/label.tsx b/src/renderer/views/key/label.tsx
new file mode 100644
index 0000000..e71a71f
--- /dev/null
+++ b/src/renderer/views/key/label.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react'
+import {CSSProperties} from 'react'
+import {Box, Typography} from '@material-ui/core'
+
+import {styles, Link} from '../../components'
+import UserLabel from '../user/label'
+
+import {Key, KeyType, User} from '../../rpc/keys.d'
+
+export const IDLabel = (props: {k: Key; owner?: boolean}) => {
+  const key = props.k
+  const isPrivate = key.type == KeyType.X25519 || key.type === KeyType.EDX25519
+  const style: CSSProperties = {}
+  if (props.owner && isPrivate) style.fontWeight = 500
+  // width: 520, wordWrap: 'break-word', wordBreak: 'break-all'
+  return <Typography style={{...styles.mono, ...style}}>{key.id}</Typography>
+}
+
+export const KeyLabel = (props: {k: Key; full?: boolean}) => {
+  if (props.full) {
+    return (
+      <Box>
+        {props.k.user && <UserLabel user={props.k.user} />}
+        <IDLabel k={props.k} />
+      </Box>
+    )
+  }
+
+  if (props.k.user) {
+    return <UserLabel user={props.k.user} />
+  }
+  return <IDLabel k={props.k} />
+}
diff --git a/src/renderer/views/key/remove.tsx b/src/renderer/views/key/remove.tsx
index 6be05b7..66a7bec 100644
--- a/src/renderer/views/key/remove.tsx
+++ b/src/renderer/views/key/remove.tsx
@@ -5,7 +5,7 @@ import {Box, Button, Typography} from '@material-ui/core'
 import {styles} from '../../components'
 import Dialog from '../../components/dialog'
 import Snack, {SnackProps} from '../../components/snack'
-import KeyDescription from './description'
+import {KeyLabel} from './label'
 
 import {keyRemove} from '../../rpc/keys'
 import {Key, KeyType, KeyRemoveRequest, KeyRemoveResponse} from '../../rpc/keys.d'
@@ -55,7 +55,7 @@ const PrivateKey = (props: {k: Key}) => {
         Are you really sure you want to delete this <span style={{fontWeight: 600}}>private</span> key?
       </Typography>
       <Box style={{paddingBottom: 10}}>
-        <KeyDescription k={props.k} />
+        <KeyLabel k={props.k} full />
       </Box>
       <Typography>
         <span style={{fontWeight: 600}}>
@@ -70,7 +70,7 @@ const PublicKey = (props: {k: Key}) => {
   return (
     <Box style={{paddingBottom: 10}}>
       <Typography style={{paddingBottom: 10}}>Do you want to delete this public key?</Typography>
-      <KeyDescription k={props.k} />
+      <KeyLabel k={props.k} />
     </Box>
   )
 }
diff --git a/src/renderer/views/keys/autocomplete.tsx b/src/renderer/views/keys/autocomplete.tsx
index 093fea8..8c3a6c4 100644
--- a/src/renderer/views/keys/autocomplete.tsx
+++ b/src/renderer/views/keys/autocomplete.tsx
@@ -10,7 +10,7 @@ import Autocomplete, {
   AutocompleteInputChangeReason,
 } from '@material-ui/lab/Autocomplete'
 
-import UserLabel from '../user/label'
+import {KeyLabel} from '../key/label'
 import matchSorter from 'match-sorter'
 
 import {keys} from '../../rpc/keys'
@@ -142,7 +142,7 @@ export default class AutocompleteView extends React.Component<Props, State> {
 
     return (
       <React.Fragment>
-        <UserLabel kid={option.id!} user={option.user} />
+        <KeyLabel k={option} />
       </React.Fragment>
     )
   }
@@ -197,7 +197,7 @@ export default class AutocompleteView extends React.Component<Props, State> {
             />
           )}
         />
-        <SearchDialog open={this.state.openSearch} close={this.closeSearch} />
+        <SearchDialog open={this.state.openSearch} close={this.closeSearch} reload={() => this.search('')} />
         <KeyImportDialog open={this.state.openImport} close={this.closeImport} />
       </Box>
     )
diff --git a/src/renderer/views/keys/autocompletes.tsx b/src/renderer/views/keys/autocompletes.tsx
index 11e6829..c073015 100644
--- a/src/renderer/views/keys/autocompletes.tsx
+++ b/src/renderer/views/keys/autocompletes.tsx
@@ -5,7 +5,7 @@ import {Box, TextField, TextFieldProps, Typography} from '@material-ui/core'
 
 import Autocomplete from '@material-ui/lab/Autocomplete'
 
-import UserLabel from '../user/label'
+import {KeyLabel} from '../key/label'
 import matchSorter, {rankings} from 'match-sorter'
 
 import SearchDialog from '../search/dialog'
@@ -46,7 +46,7 @@ const renderOption = (option: Key) => {
   }
   return (
     <React.Fragment>
-      <UserLabel kid={option.id!} user={option.user} />
+      <KeyLabel k={option} />
     </React.Fragment>
   )
 }
@@ -59,7 +59,7 @@ const getOptionLabel = (option: Key): string => {
   if (option.id == 'search' || option.id == 'import') {
     return ''
   }
-  return ((<UserLabel kid={option.id!} user={option.user} />) as unknown) as string
+  return ((<KeyLabel k={option} />) as unknown) as string
 }
 
 export default (props: Props) => {
diff --git a/src/renderer/views/keys/index.tsx b/src/renderer/views/keys/index.tsx
index f3b95bc..934dc18 100644
--- a/src/renderer/views/keys/index.tsx
+++ b/src/renderer/views/keys/index.tsx
@@ -30,7 +30,7 @@ import {
 import {styles} from '../../components'
 import Snack, {SnackProps} from '../../components/snack'
 import UserLabel from '../user/label'
-import {IDView} from '../key/content'
+import {IDLabel} from '../key/label'
 
 import Header from '../header'
 
@@ -403,10 +403,7 @@ export default (_: {}) => {
                     {key.user && <UserLabel user={key.user} />}
                   </TableCell>
                   <TableCell style={{verticalAlign: 'top'}}>
-                    <IDView
-                      id={key.id!}
-                      owner={key.type == KeyType.X25519 || key.type === KeyType.EDX25519}
-                    />
+                    <IDLabel k={key} owner />
                   </TableCell>
                 </TableRow>
               )
diff --git a/src/renderer/views/keys/select.tsx b/src/renderer/views/keys/select.tsx
index 60ae88f..892c24a 100644
--- a/src/renderer/views/keys/select.tsx
+++ b/src/renderer/views/keys/select.tsx
@@ -2,7 +2,7 @@ import * as React from 'react'
 
 import {Box, Divider, FormControl, InputLabel, MenuItem, Select, Typography} from '@material-ui/core'
 
-import UserLabel from '../user/label'
+import {KeyLabel} from '../key/label'
 
 import {keys} from '../../rpc/keys'
 import {KeysRequest, KeysResponse, Key, KeyType, SortDirection} from '../../rpc/keys.d'
@@ -79,7 +79,7 @@ export default (props: Props) => {
                   {props.itemLabel}&nbsp;
                 </Typography>
               )}
-              <UserLabel kid={k.id!} user={k.user} />
+              <KeyLabel k={k} />
             </Box>
           </MenuItem>
         ))}
diff --git a/src/renderer/views/search/view.tsx b/src/renderer/views/search/view.tsx
index 57943f2..9e6ddfe 100644
--- a/src/renderer/views/search/view.tsx
+++ b/src/renderer/views/search/view.tsx
@@ -15,7 +15,7 @@ import {
   Typography,
 } from '@material-ui/core'
 
-import {IDView} from '../key/content'
+import {IDLabel} from '../key/label'
 
 import UserLabel from '../user/label'
 import {styles} from '../../components'
@@ -134,10 +134,10 @@ export default class SearchView extends React.Component<Props, State> {
               {this.state.keys.map((k: Key, index: number): any => (
                 <TableRow hover onClick={(event) => this.select(k)} key={k.id} style={{cursor: 'pointer'}}>
                   <TableCell component="th" scope="row">
-                    <UserLabel kid={k.id!} user={k.user} />
+                    {k.user && <UserLabel user={k.user} />}
                   </TableCell>
                   <TableCell style={{verticalAlign: 'top'}}>
-                    <IDView id={k.id!} />
+                    <IDLabel k={k} />
                   </TableCell>
                 </TableRow>
               ))}
diff --git a/src/renderer/views/textinput/index.tsx b/src/renderer/views/textinput/index.tsx
index 8c49971..0f1f760 100644
--- a/src/renderer/views/textinput/index.tsx
+++ b/src/renderer/views/textinput/index.tsx
@@ -71,7 +71,7 @@ export default class MessageInputView extends React.Component<Props, State> {
         }}
       >
         <Input
-          style={styles.messageInput}
+          style={styles.regular}
           autoFocus
           disableUnderline
           fullWidth
diff --git a/src/renderer/views/user/label.tsx b/src/renderer/views/user/label.tsx
index ea68f28..42cf8b9 100644
--- a/src/renderer/views/user/label.tsx
+++ b/src/renderer/views/user/label.tsx
@@ -6,7 +6,11 @@ import styles, {serviceColor} from '../../components/styles'
 
 import {User, UserStatus} from '../../rpc/keys.d'
 
-export default (props: {user: User}) => {
+type Props = {
+  user: User
+}
+
+export default (props: Props) => {
   const {user} = props
 
   let textColor = ''
diff --git a/src/renderer/views/verify/signer.tsx b/src/renderer/views/verify/signer.tsx
index 55a8428..3a97980 100644
--- a/src/renderer/views/verify/signer.tsx
+++ b/src/renderer/views/verify/signer.tsx
@@ -9,6 +9,7 @@ import Snack, {SnackProps} from '../../components/snack'
 import KeyDialog from '../key'
 
 import {Key, EncryptMode} from '../../rpc/keys.d'
+import {KeyLabel} from '../key/label'
 
 type Props = {
   signer?: Key
@@ -94,7 +95,7 @@ const SignerUser = (props: {signer: Key; mode?: EncryptMode}) => {
       <Typography display="inline" style={{...styles.mono}}>
         Verified&nbsp;
       </Typography>
-      <UserLabel kid={signer.id!} user={signer.user} />
+      <KeyLabel k={signer} />
       <Typography display="inline" style={{...styles.mono}}>
         {encryptModeDescription(mode)}
       </Typography>
@@ -113,7 +114,7 @@ const SignerUserUnknown = (props: {signer: Key; lookup: () => void}) => {
       <Typography display="inline" style={{...styles.mono}}>
         Signed by&nbsp;
       </Typography>
-      <UserLabel kid={signer.id!} user={signer.user} />
+      <KeyLabel k={signer} />
       <Button
         size="small"
         variant="outlined"