@platformos/platformos-language-server-common 0.0.2

package/src/rename/providers/LiquidVariableRenameProvider.ts

@@ -0,0 +1,300 @@
+import {
+  AssignMarkup,
+  ForMarkup,
+  LiquidHtmlNode,
+  LiquidTagFor,
+  LiquidTagTablerow,
+  LiquidVariableLookup,
+  NamedTags,
+  NodeTypes,
+  Position,
+  RenderMarkup,
+  TextNode,
+} from '@platformos/liquid-html-parser';
+import {
+  GraphQLDocumentNode,
+  JSONNode,
+  SourceCodeType,
+  visit,
+} from '@platformos/platformos-check-common';
+import { Connection, Range } from 'vscode-languageserver';
+import {
+  ApplyWorkspaceEditRequest,
+  PrepareRenameParams,
+  PrepareRenameResult,
+  RenameParams,
+  TextDocumentEdit,
+  TextEdit,
+  WorkspaceEdit,
+} from 'vscode-languageserver-protocol';
+import { TextDocument } from 'vscode-languageserver-textdocument';
+import { ClientCapabilities } from '../../ClientCapabilities';
+import { AugmentedLiquidSourceCode, DocumentManager, isLiquidSourceCode } from '../../documents';
+import { FindThemeRootURI } from '../../internal-types';
+import { partialName } from '../../utils/uri';
+import { BaseRenameProvider } from '../BaseRenameProvider';
+
+export class LiquidVariableRenameProvider implements BaseRenameProvider {
+  constructor(
+    private connection: Connection,
+    private clientCapabilities: ClientCapabilities,
+    private documentManager: DocumentManager,
+    private findThemeRootURI: FindThemeRootURI,
+  ) {}
+
+  async prepare(
+    node: LiquidHtmlNode,
+    ancestors: LiquidHtmlNode[],
+    params: PrepareRenameParams,
+  ): Promise<null | PrepareRenameResult> {
+    const document = this.documentManager.get(params.textDocument.uri);
+    const textDocument = document?.textDocument;
+
+    if (!textDocument || !node || !ancestors) return null;
+    if (!supportedTags(node, ancestors)) return null;
+
+    const oldName = variableName(node);
+    const offsetOfVariableNameEnd = node.position.start + oldName.length;
+
+    // The cursor could be past the end of the variable name
+    if (textDocument.offsetAt(params.position) > offsetOfVariableNameEnd) return null;
+
+    return {
+      range: Range.create(
+        textDocument.positionAt(node.position.start),
+        textDocument.positionAt(offsetOfVariableNameEnd),
+      ),
+      placeholder: oldName,
+    };
+  }
+
+  async rename(
+    node: LiquidHtmlNode,
+    ancestors: LiquidHtmlNode[],
+    params: RenameParams,
+  ): Promise<null | WorkspaceEdit> {
+    const document = this.documentManager.get(params.textDocument.uri);
+    const rootUri = await this.findThemeRootURI(params.textDocument.uri);
+    const textDocument = document?.textDocument;
+
+    if (!rootUri || !textDocument || !node || !ancestors) return null;
+    if (document.ast instanceof Error) return null;
+    if (!supportedTags(node, ancestors)) return null;
+
+    const oldName = variableName(node);
+    const scope = variableNameBlockScope(oldName, ancestors);
+    const replaceRange = textReplaceRange(oldName, textDocument, scope);
+
+    let liquidDocParamUpdated = false;
+
+    const ranges: Range[] = await visit(document.ast, {
+      VariableLookup: replaceRange,
+      AssignMarkup: replaceRange,
+      ForMarkup: replaceRange,
+      TextNode: async (
+        node: LiquidHtmlNode,
+        ancestors: (LiquidHtmlNode | JSONNode | GraphQLDocumentNode)[],
+      ) => {
+        if (ancestors.at(-1)?.type !== NodeTypes.LiquidDocParamNode) return;
+
+        liquidDocParamUpdated = true;
+
+        return await replaceRange(node, ancestors);
+      },
+    });
+
+    if (this.clientCapabilities.hasApplyEditSupport && liquidDocParamUpdated) {
+      const themeFiles = this.documentManager.theme(rootUri, true);
+      const liquidSourceCodes = themeFiles.filter(isLiquidSourceCode);
+      const name = partialName(params.textDocument.uri);
+
+      await updateRenderTags(this.connection, liquidSourceCodes, name, oldName, params.newName);
+    }
+
+    const textDocumentEdit = TextDocumentEdit.create(
+      { uri: textDocument.uri, version: textDocument.version },
+      ranges.map((range) => TextEdit.replace(range, params.newName)),
+    );
+
+    return {
+      documentChanges: [textDocumentEdit],
+    };
+  }
+}
+
+function supportedTags(
+  node: LiquidHtmlNode,
+  ancestors: LiquidHtmlNode[],
+): node is AssignMarkup | LiquidVariableLookup | ForMarkup | TextNode {
+  return (
+    node.type === NodeTypes.AssignMarkup ||
+    node.type === NodeTypes.VariableLookup ||
+    node.type === NodeTypes.ForMarkup ||
+    isLiquidDocParamNameNode(node, ancestors)
+  );
+}
+
+function isLiquidDocParamNameNode(
+  node: LiquidHtmlNode,
+  ancestors: LiquidHtmlNode[],
+): node is TextNode {
+  const parentNode = ancestors.at(-1);
+
+  return (
+    !!parentNode &&
+    parentNode.type === NodeTypes.LiquidDocParamNode &&
+    parentNode.paramName === node &&
+    node.type === NodeTypes.TextNode
+  );
+}
+
+function variableName(node: LiquidHtmlNode): string {
+  switch (node.type) {
+    case NodeTypes.VariableLookup:
+    case NodeTypes.AssignMarkup:
+      return node.name ?? '';
+    case NodeTypes.ForMarkup:
+      return node.variableName ?? '';
+    case NodeTypes.TextNode:
+      return node.value;
+    default:
+      return '';
+  }
+}
+
+/*
+ * Find the scope where the variable name is used. Looks at defined in `tablerow` and `for` tags.
+ */
+function variableNameBlockScope(
+  variableName: string,
+  ancestors: (LiquidHtmlNode | JSONNode | GraphQLDocumentNode)[],
+): Position | undefined {
+  let scopedAncestor: LiquidTagTablerow | LiquidTagFor | undefined;
+
+  for (let i = ancestors.length - 1; i >= 0; i--) {
+    const ancestor = ancestors[i];
+    if (
+      ancestor.type === NodeTypes.LiquidTag &&
+      (ancestor.name === NamedTags.tablerow || ancestor.name === NamedTags.for) &&
+      typeof ancestor.markup !== 'string' &&
+      ancestor.markup.variableName === variableName
+    ) {
+      scopedAncestor = ancestor as LiquidTagTablerow | LiquidTagFor;
+      break;
+    }
+  }
+
+  if (!scopedAncestor || !scopedAncestor.blockEndPosition) return;
+
+  return {
+    start: scopedAncestor.blockStartPosition.start,
+    end: scopedAncestor.blockEndPosition.end,
+  };
+}
+
+function textReplaceRange(
+  oldName: string,
+  textDocument: TextDocument,
+  selectedVariableScope?: Position,
+) {
+  return async (
+    node: LiquidHtmlNode,
+    ancestors: (LiquidHtmlNode | JSONNode | GraphQLDocumentNode)[],
+  ) => {
+    if (variableName(node) !== oldName) return;
+
+    const ancestorScope = variableNameBlockScope(oldName, ancestors);
+    if (
+      ancestorScope?.start !== selectedVariableScope?.start ||
+      ancestorScope?.end !== selectedVariableScope?.end
+    ) {
+      return;
+    }
+
+    return Range.create(
+      textDocument.positionAt(node.position.start),
+      textDocument.positionAt(node.position.start + oldName.length),
+    );
+  };
+}
+
+async function updateRenderTags(
+  connection: Connection,
+  liquidSourceCodes: AugmentedLiquidSourceCode[],
+  partialName: string,
+  oldParamName: string,
+  newParamName: string,
+) {
+  const editLabel = `Rename partial parameter '${oldParamName}' to '${newParamName}'`;
+  const annotationId = 'renamePartialParameter';
+  const workspaceEdit: WorkspaceEdit = {
+    documentChanges: [],
+    changeAnnotations: {
+      [annotationId]: {
+        label: editLabel,
+        needsConfirmation: false,
+      },
+    },
+  };
+
+  for (const sourceCode of liquidSourceCodes) {
+    if (sourceCode.ast instanceof Error) continue;
+    const textDocument = sourceCode.textDocument;
+    const edits: TextEdit[] = await visit<SourceCodeType.LiquidHtml, TextEdit>(sourceCode.ast, {
+      async RenderMarkup(node: RenderMarkup) {
+        if (node.snippet.type !== NodeTypes.String || node.snippet.value !== partialName) {
+          return;
+        }
+
+        const renamedNameParamNode = node.args.find((arg) => arg.name === oldParamName);
+
+        if (renamedNameParamNode) {
+          return {
+            newText: `${newParamName}: `,
+            range: Range.create(
+              textDocument.positionAt(renamedNameParamNode.position.start),
+              textDocument.positionAt(renamedNameParamNode.value.position.start),
+            ),
+          };
+        }
+
+        if (node.alias?.value === oldParamName && node.variable) {
+          // `as variable` is not captured in our liquid parser yet,
+          // so we have to check it manually and replace it
+          const aliasMatch = /as\s+([^\s,]+)/g;
+          const match = aliasMatch.exec(node.source.slice(node.position.start, node.position.end));
+
+          if (!match) return;
+
+          return {
+            newText: `as ${newParamName}`,
+            range: Range.create(
+              textDocument.positionAt(node.position.start + match.index),
+              textDocument.positionAt(node.position.start + match.index + match[0].length),
+            ),
+          };
+        }
+      },
+    });
+
+    if (edits.length === 0) continue;
+    workspaceEdit.documentChanges!.push({
+      textDocument: {
+        uri: textDocument.uri,
+        version: sourceCode.version ?? null /* null means file from disk in this API */,
+      },
+      annotationId,
+      edits,
+    });
+  }
+
+  if (workspaceEdit.documentChanges!.length === 0) {
+    console.error('Nothing to do!');
+    return;
+  }
+
+  await connection.sendRequest(ApplyWorkspaceEditRequest.type, {
+    label: editLabel,
+    edit: workspaceEdit,
+  });
+}

package/src/renamed/BaseRenameHandler.ts

@@ -0,0 +1,5 @@
+import { RenameFilesParams } from 'vscode-languageserver-protocol';
+
+export interface BaseRenameHandler {
+  onDidRenameFiles(params: RenameFilesParams): Promise<void>;
+}

package/src/renamed/RenameHandler.ts

@@ -0,0 +1,45 @@
+import { Connection } from 'vscode-languageserver';
+import { RenameFilesParams } from 'vscode-languageserver-protocol';
+import { ClientCapabilities } from '../ClientCapabilities';
+import { DocumentManager } from '../documents';
+import { FindThemeRootURI } from '../internal-types';
+import { BaseRenameHandler } from './BaseRenameHandler';
+import { AssetRenameHandler } from './handlers/AssetRenameHandler';
+import { BlockRenameHandler } from './handlers/BlockRenameHandler';
+import { SectionRenameHandler } from './handlers/SectionRenameHandler';
+import { PartialRenameHandler } from './handlers/PartialRenameHandler';
+
+/**
+ * The RenameHandler is responsible for handling workspace/didRenameFiles notifications.
+ *
+ * Stuff we'll handle:
+ * - When a partial is renamed, then we'll change all the render calls
+ * - When an asset is renamed, then we'll change the asset_url calls
+ * - etc.
+ */
+export class RenameHandler {
+  private handlers: BaseRenameHandler[];
+  constructor(
+    connection: Connection,
+    capabilities: ClientCapabilities,
+    documentManager: DocumentManager,
+    findThemeRootURI: FindThemeRootURI,
+  ) {
+    this.handlers = [
+      new PartialRenameHandler(documentManager, connection, capabilities, findThemeRootURI),
+      new AssetRenameHandler(documentManager, connection, capabilities, findThemeRootURI),
+      new BlockRenameHandler(documentManager, connection, capabilities, findThemeRootURI),
+      new SectionRenameHandler(documentManager, connection, capabilities, findThemeRootURI),
+    ];
+  }
+
+  async onDidRenameFiles(params: RenameFilesParams) {
+    try {
+      const promises = this.handlers.map((handler) => handler.onDidRenameFiles(params));
+      await Promise.all(promises);
+    } catch (error) {
+      console.error(error);
+      return;
+    }
+  }
+}

package/src/renamed/handlers/AssetRenameHandler.spec.ts

@@ -0,0 +1,217 @@
+import { MockFileSystem } from '@platformos/platformos-check-common/src/test';
+import { assert, beforeEach, describe, expect, it } from 'vitest';
+import { TextDocumentEdit } from 'vscode-json-languageservice';
+import { ApplyWorkspaceEditParams } from 'vscode-languageserver-protocol';
+import { TextDocument } from 'vscode-languageserver-textdocument';
+import { ClientCapabilities } from '../../ClientCapabilities';
+import { DocumentManager } from '../../documents';
+import { MockConnection, mockConnection } from '../../test/MockConnection';
+import { RenameHandler } from '../RenameHandler';
+
+describe('Module: AssetRenameHandler', () => {
+  const mockRoot = 'mock-fs:';
+  const findThemeRootURI = async () => mockRoot;
+  let capabilities: ClientCapabilities;
+  let documentManager: DocumentManager;
+  let handler: RenameHandler;
+  let connection: MockConnection;
+  let fs: MockFileSystem;
+  beforeEach(() => {
+    connection = mockConnection(mockRoot);
+    connection.spies.sendRequest.mockReturnValue(Promise.resolve(true));
+    capabilities = new ClientCapabilities();
+    fs = new MockFileSystem(
+      {
+        'assets/oldName.js': 'console.log("Hello, world!")',
+        'sections/section.liquid': `<script src="{{ 'oldName.js' | asset_url }}" defer></script>`,
+        'blocks/block.liquid': `{{ 'oldName.js' | asset_url | script_tag }} oldName.js`,
+      },
+      mockRoot,
+    );
+    documentManager = new DocumentManager(fs);
+    handler = new RenameHandler(connection, capabilities, documentManager, findThemeRootURI);
+  });
+
+  describe('when the client does not support workspace/applyEdit', () => {
+    beforeEach(() => {
+      capabilities.setup({
+        workspace: {
+          applyEdit: false,
+        },
+      });
+    });
+
+    it('does nothing', async () => {
+      await handler.onDidRenameFiles({
+        files: [
+          {
+            oldUri: 'mock-fs:/assets/oldName.js',
+            newUri: 'mock-fs:/assets/newName.js',
+          },
+        ],
+      });
+      expect(connection.spies.sendRequest).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('when the client supports workspace/applyEdit', () => {
+    beforeEach(() => {
+      capabilities.setup({
+        workspace: {
+          applyEdit: true,
+        },
+      });
+    });
+
+    it('returns a needConfirmation: false workspace edit for renaming an asset', async () => {
+      await handler.onDidRenameFiles({
+        files: [
+          {
+            oldUri: 'mock-fs:/assets/oldName.js',
+            newUri: 'mock-fs:/assets/newName.js',
+          },
+        ],
+      });
+
+      const expectedTextEdit = {
+        range: expect.any(Object),
+        newText: 'newName.js',
+      };
+
+      expect(connection.spies.sendRequest).toHaveBeenCalledWith('workspace/applyEdit', {
+        label: "Rename asset 'oldName.js' to 'newName.js'",
+        edit: {
+          changeAnnotations: {
+            renameAsset: {
+              label: `Rename asset 'oldName.js' to 'newName.js'`,
+              needsConfirmation: false,
+            },
+          },
+          documentChanges: [
+            {
+              textDocument: {
+                uri: 'mock-fs:/sections/section.liquid',
+                version: null,
+              },
+              edits: [expectedTextEdit],
+              annotationId: 'renameAsset',
+            },
+            {
+              textDocument: {
+                uri: 'mock-fs:/blocks/block.liquid',
+                version: null,
+              },
+              edits: [expectedTextEdit],
+              annotationId: 'renameAsset',
+            },
+          ],
+        },
+      });
+    });
+
+    it('replaces the correct text in the documents', async () => {
+      await handler.onDidRenameFiles({
+        files: [
+          {
+            oldUri: 'mock-fs:/assets/oldName.js',
+            newUri: 'mock-fs:/assets/newName.js',
+          },
+        ],
+      });
+
+      const params: ApplyWorkspaceEditParams = connection.spies.sendRequest.mock.calls[0][1];
+      const expectedFs = new MockFileSystem(
+        {
+          'assets/oldName.js': 'console.log("Hello, world!")',
+          'sections/section.liquid': `<script src="{{ 'newName.js' | asset_url }}" defer></script>`,
+          'blocks/block.liquid': `{{ 'newName.js' | asset_url | script_tag }} oldName.js`,
+        },
+        'mock-fs:',
+      );
+
+      assert(params.edit);
+      assert(params.edit.documentChanges);
+      for (const docChange of params.edit.documentChanges) {
+        assert(TextDocumentEdit.is(docChange));
+        const uri = docChange.textDocument.uri;
+        const edits = docChange.edits;
+        const initialDoc = await fs.readFile(uri);
+        const expectedDoc = await expectedFs.readFile(uri);
+        expect(edits).to.applyEdits(initialDoc, expectedDoc);
+      }
+    });
+
+    it('handles .js.liquid files', async (ext) => {
+      await handler.onDidRenameFiles({
+        files: [
+          {
+            oldUri: 'mock-fs:/assets/oldName.js',
+            newUri: `mock-fs:/assets/newName.js.liquid`,
+          },
+        ],
+      });
+
+      const params: ApplyWorkspaceEditParams = connection.spies.sendRequest.mock.calls[0][1];
+      const expectedFs = new MockFileSystem(
+        {
+          'assets/oldName.js': 'console.log("Hello, world!")',
+          'sections/section.liquid': `<script src="{{ 'newName.js' | asset_url }}" defer></script>`,
+          'blocks/block.liquid': `{{ 'newName.js' | asset_url | script_tag }} oldName.js`,
+        },
+        'mock-fs:',
+      );
+
+      assert(params.edit);
+      assert(params.edit.documentChanges);
+      for (const docChange of params.edit.documentChanges) {
+        assert(TextDocumentEdit.is(docChange));
+        const uri = docChange.textDocument.uri;
+        const edits = docChange.edits;
+        const initialDoc = await fs.readFile(uri);
+        const expectedDoc = await expectedFs.readFile(uri);
+        expect(edits).to.applyEdits(initialDoc, expectedDoc);
+      }
+    });
+
+    it('handles .css.liquid files', async () => {
+      fs = new MockFileSystem(
+        {
+          'assets/oldName.css.liquid': 'body { color: red; }',
+          'sections/section.liquid': `{% echo 'oldName.css' | asset_url | stylesheet_tag %}`,
+        },
+        'mock-fs:',
+      );
+      documentManager = new DocumentManager(fs);
+      handler = new RenameHandler(connection, capabilities, documentManager, findThemeRootURI);
+
+      await handler.onDidRenameFiles({
+        files: [
+          {
+            oldUri: 'mock-fs:/assets/oldName.css.liquid',
+            newUri: `mock-fs:/assets/newName.css.liquid`,
+          },
+        ],
+      });
+
+      const params: ApplyWorkspaceEditParams = connection.spies.sendRequest.mock.calls[0][1];
+      const expectedFs = new MockFileSystem(
+        {
+          'assets/newName.css.liquid': 'body { color: red; }',
+          'sections/section.liquid': `{% echo 'newName.css' | asset_url | stylesheet_tag %}`,
+        },
+        'mock-fs:',
+      );
+
+      assert(params.edit);
+      assert(params.edit.documentChanges);
+      for (const docChange of params.edit.documentChanges) {
+        assert(TextDocumentEdit.is(docChange));
+        const uri = docChange.textDocument.uri;
+        const edits = docChange.edits;
+        const initialDoc = await fs.readFile(uri);
+        const expectedDoc = await expectedFs.readFile(uri);
+        expect(edits).to.applyEdits(initialDoc, expectedDoc);
+      }
+    });
+  });
+});

package/src/renamed/handlers/AssetRenameHandler.ts

@@ -0,0 +1,108 @@
+import { LiquidVariable, NodeTypes } from '@platformos/liquid-html-parser';
+import { path, SourceCodeType, visit } from '@platformos/platformos-check-common';
+import { Connection } from 'vscode-languageserver';
+import {
+  ApplyWorkspaceEditRequest,
+  Range,
+  RenameFilesParams,
+  TextEdit,
+  WorkspaceEdit,
+} from 'vscode-languageserver-protocol';
+import { ClientCapabilities } from '../../ClientCapabilities';
+import { DocumentManager, isLiquidSourceCode } from '../../documents';
+import { assetName, isAsset } from '../../utils/uri';
+import { BaseRenameHandler } from '../BaseRenameHandler';
+import { FindThemeRootURI } from '../../internal-types';
+
+/**
+ * The AssetRenameHandler will handle asset renames.
+ *
+ * We'll change all the `| asset_url` that reference the old asset:
+ *   {{ 'oldName.js' | asset_url }} -> {{ 'newName.js' | asset_url }}
+ *
+ * We'll do that for `.(css|js).liquid` files as well
+ *
+ * We'll do this by visiting all the liquid files in the theme and looking for
+ * string | asset_url Variable nodes that reference the old asset. We'll then create a
+ * WorkspaceEdit that changes the references to the new asset.
+ */
+export class AssetRenameHandler implements BaseRenameHandler {
+  constructor(
+    private documentManager: DocumentManager,
+    private connection: Connection,
+    private capabilities: ClientCapabilities,
+    private findThemeRootURI: FindThemeRootURI,
+  ) {}
+
+  async onDidRenameFiles(params: RenameFilesParams): Promise<void> {
+    if (!this.capabilities.hasApplyEditSupport) return;
+
+    const relevantRenames = params.files.filter(
+      (file) => isAsset(file.oldUri) && isAsset(file.newUri),
+    );
+
+    // Only preload if you have something to do (folder renames are not supported)
+    if (relevantRenames.length !== 1) return;
+    const rename = relevantRenames[0];
+    const rootUri = await this.findThemeRootURI(path.dirname(params.files[0].oldUri));
+    if (!rootUri) return;
+    await this.documentManager.preload(rootUri);
+    const theme = this.documentManager.theme(rootUri, true);
+    const liquidSourceCodes = theme.filter(isLiquidSourceCode);
+
+    const oldAssetName = assetName(rename.oldUri);
+    const newAssetName = assetName(rename.newUri);
+    const editLabel = `Rename asset '${oldAssetName}' to '${newAssetName}'`;
+    const annotationId = 'renameAsset';
+    const workspaceEdit: WorkspaceEdit = {
+      documentChanges: [],
+      changeAnnotations: {
+        [annotationId]: {
+          label: editLabel,
+          needsConfirmation: false,
+        },
+      },
+    };
+
+    for (const sourceCode of liquidSourceCodes) {
+      if (sourceCode.ast instanceof Error) continue;
+      const textDocument = sourceCode.textDocument;
+      const edits: TextEdit[] = await visit<SourceCodeType.LiquidHtml, TextEdit>(sourceCode.ast, {
+        async LiquidVariable(node: LiquidVariable) {
+          if (node.filters.length === 0) return;
+          if (node.expression.type !== NodeTypes.String) return;
+          if (node.filters[0].name !== 'asset_url') return;
+          const assetName = node.expression.value;
+          if (assetName !== oldAssetName) return;
+          return {
+            newText: newAssetName,
+            range: Range.create(
+              textDocument.positionAt(node.expression.position.start + 1), // +1 to skip the opening quote
+              textDocument.positionAt(node.expression.position.end - 1), // -1 to skip the closing quote
+            ),
+          };
+        },
+      });
+
+      if (edits.length === 0) continue;
+      workspaceEdit.documentChanges!.push({
+        textDocument: {
+          uri: textDocument.uri,
+          version: sourceCode.version ?? null /* null means file from disk in this API */,
+        },
+        annotationId,
+        edits,
+      });
+    }
+
+    if (workspaceEdit.documentChanges!.length === 0) {
+      console.error('Nothing to do!');
+      return;
+    }
+
+    await this.connection.sendRequest(ApplyWorkspaceEditRequest.type, {
+      label: editLabel,
+      edit: workspaceEdit,
+    });
+  }
+}