Fixes #734 - broken hover image with remote dev

src/gravatar.ts → src/avatars.ts

@@ -1,11 +1,16 @@
 'use strict';
+import * as fs from 'fs';
 import { Uri } from 'vscode';
 import { GravatarDefaultStyle } from './config';
 import { Strings } from './system';
+import { ContactPresenceStatus } from './vsls/vsls';
+import { Container } from './container';
 
-const gravatarCache: Map<string, Uri> = new Map();
+const gravatarCache = new Map<string, Uri>();
 const missingGravatarHash = '00000000000000000000000000000000';
 
+const presenceCache = new Map<ContactPresenceStatus, string>();
+
 export function clearGravatarCache() {
     gravatarCache.clear();
 }
@@ -23,3 +28,17 @@ export function getGravatarUri(email: string | undefined, fallback: GravatarDefa
 
     return gravatar;
 }
+
+export function getPresenceDataUri(status: ContactPresenceStatus) {
+    let dataUri = presenceCache.get(status);
+    if (dataUri === undefined) {
+        const contents = fs
+            .readFileSync(Container.context.asAbsolutePath(`images/dark/icon-presence-${status}.svg`))
+            .toString('base64');
+
+        dataUri = encodeURI(`data:image/svg+xml;base64,${contents}`);
+        presenceCache.set(status, dataUri);
+    }
+
+    return dataUri;
+}

src/container.ts

@@ -7,7 +7,7 @@ import { Commands, ToggleFileBlameCommandArgs } from './commands';
 import { AnnotationsToggleMode, Config, configuration, ConfigurationWillChangeEvent } from './configuration';
 import { GitFileSystemProvider } from './git/fsProvider';
 import { GitService } from './git/gitService';
-import { clearGravatarCache } from './gravatar';
+import { clearGravatarCache } from './avatars';
 import { LineHoverController } from './hovers/lineHoverController';
 import { Keyboard } from './keyboard';
 import { Logger, TraceLevel } from './logger';

src/git/formatters/commitFormatter.ts

@@ -15,6 +15,7 @@ import { Strings } from '../../system';
 import { FormatOptions, Formatter } from './formatter';
 import * as emojis from '../../emojis.json';
 import { ContactPresence } from '../../vsls/vsls';
+import { getPresenceDataUri } from '../../avatars';
 
 const emptyStr = '';
 const emojiMap: { [key: string]: string } = emojis;
@@ -134,9 +135,7 @@ export class CommitFormatter extends Formatter<GitCommit, CommitFormatOptions> {
                 presence.status === 'dnd' ? 'in ' : ''
             }${presence.statusText.toLocaleLowerCase()}`;
 
-            avatar += `![${title}](${encodeURI(
-                `file:///${Container.context.asAbsolutePath(`images/dark/icon-presence-${presence.status}.svg`)}`
-            )})`;
+            avatar += `![${title}](${getPresenceDataUri(presence.status)})`;
             avatar = `[${avatar}](# "${title}")`;
         }
 

src/git/models/commit.ts

@@ -6,7 +6,7 @@ import { Dates, memoize } from '../../system';
 import { CommitFormatter } from '../formatters/formatters';
 import { Git } from '../git';
 import { GitUri } from '../gitUri';
-import { getGravatarUri } from '../../gravatar';
+import { getGravatarUri } from '../../avatars';
 
 export interface GitAuthor {
     name: string;

src/git/models/contributor.ts

@@ -1,7 +1,7 @@
 'use strict';
 import { Uri } from 'vscode';
 import { GravatarDefaultStyle } from '../../configuration';
-import { getGravatarUri } from '../../gravatar';
+import { getGravatarUri } from '../../avatars';
 
 export class GitContributor {
     constructor(