#180 - Filename placeholder added

CHANGELOG.md

@@ -8,6 +8,7 @@
 - Updated `check` icon on media inserts to `plus` icon
 - [#178](https://github.com/estruyf/vscode-front-matter/issues/178): Sorting added to the media dashboard
 - [#179](https://github.com/estruyf/vscode-front-matter/issues/179): Updated the `open dashboard` icon to make it easier to spot it
+- [#180](https://github.com/estruyf/vscode-front-matter/issues/180): Added `{filename}` as placeholder for media snippets
 
 ## [5.5.0] - 2021-11-15
 

src/commands/Dashboard.ts

@@ -21,13 +21,13 @@ import { decodeBase64Image } from '../helpers/decodeBase64Image';
 import { DashboardData } from '../models/DashboardData';
 import { ExplorerView } from '../explorerView/ExplorerView';
 import { MediaLibrary } from '../helpers/MediaLibrary';
-import imageSize from 'image-size';
 import { parseWinPath } from '../helpers/parseWinPath';
 import { DateHelper } from '../helpers/DateHelper';
 import { FrameworkDetector } from '../helpers/FrameworkDetector';
 import { ContentType } from '../helpers/ContentType';
 import { SortingOption } from '../dashboardWebView/models';
 import { Sorting } from '../helpers/Sorting';
+import imageSize from 'image-size';
 
 export class Dashboard {
   private static webview: WebviewPanel | null = null;

src/dashboardWebView/components/Media/Item.tsx

@@ -78,9 +78,11 @@ export const Item: React.FunctionComponent<IItemProps> = ({media}: React.PropsWi
   const insertSnippet = () => {
     const relPath = getRelPath();
     let snippet = settings?.mediaSnippet.join("\n");
+
     snippet = snippet?.replace("{mediaUrl}", parseWinPath(relPath) || "");
     snippet = snippet?.replace("{alt}", alt || "");
     snippet = snippet?.replace("{caption}", caption || "");
+    snippet = snippet?.replace("{filename}", basename(relPath || ""));
 
     Messenger.send(DashboardMessage.insertPreviewImage, {
       image: parseWinPath(relPath) || "",