Merge pull request #3 from sourcegraph/develop-find-replace

Create find-replace extension

Author: Marek

README.md

@@ -1,3 +1,17 @@
-# find-replace (Sourcegraph extension)
+# Find-replace campaigns (Sourcegraph extension)
 
-Perform a find-replace over multiple repositories by creating a Sourcegraph campaign.
+Create Sourcegraph campaigns that perform a find-replace on multiple files in multiple repositories.
+
+## What are Sourcegraph campaigns?
+
+Campaigns let you make code changes across many repositories and code hosts. Read more about [campaigns in the Sourcegraph docs.](https://docs.sourcegraph.com/campaigns)
+
+## How does a find-replace campaign work?
+
+A find-replace campaign is a campaign that finds all matches of a given string and replaces them with a replacement string.
+
+- Perform a search on Sourcegraph
+- In the search results toolbar, click "Find-replace"
+- Enter the string to find
+- Enter the replacement string
+- Once the process is complete, click the notification to open the newly created campaign.

package.json

@@ -8,12 +8,34 @@
   ],
   "wip": true,
   "categories": [],
-  "tags": [],
+  "tags": [
+    "campaigns"
+  ],
   "contributes": {
-    "actions": [],
+    "actions": [
+      {
+        "id": "findReplace.startFindReplace",
+        "title": "Create a new find-replace campaign",
+        "command": "findReplace.startFindReplace",
+        "commandArguments": [
+          "${get(context, 'searchQuery')}"
+        ],
+        "actionItem": {
+          "label": "Find-replace"
+        }
+      }
+    ],
     "menus": {
-      "editor/title": [],
-      "commandPalette": []
+      "search/results/toolbar": [
+        {
+          "action": "findReplace.startFindReplace"
+        }
+      ],
+      "commandPalette": [
+        {
+          "action": "findReplace.startFindReplace"
+        }
+      ]
     },
     "configuration": {}
   },
@@ -28,7 +50,9 @@
     "serve": "yarn run symlink-package && parcel serve --no-hmr --out-file dist/find-replace.js src/find-replace.ts",
     "watch:typecheck": "tsc -p tsconfig.json -w",
     "watch:build": "tsc -p tsconfig.dist.json -w",
-    "sourcegraph:prepublish": "yarn run typecheck && yarn run build"
+    "sourcegraph:prepublish": "yarn run typecheck && yarn run build",
+    "prettier": "prettier '**/*.{ts,md,json}' --write --list-different",
+    "test": "TS_NODE_COMPILER_OPTIONS='{\"module\":\"commonjs\"}' mocha --require ts-node/register **/*.test.ts"
   },
   "browserslist": [
     "last 1 Chrome versions",
@@ -39,11 +63,22 @@
   "devDependencies": {
     "@sourcegraph/eslint-config": "^0.20.11",
     "@sourcegraph/tsconfig": "^4.0.1",
+    "@types/assert": "^1.5.2",
+    "@types/mocha": "^8.0.3",
+    "assert": "^2.0.0",
     "eslint": "^7.11.0",
     "lnfs-cli": "^2.1.0",
     "mkdirp": "^1.0.4",
+    "mocha": "^8.2.0",
     "parcel-bundler": "^1.12.4",
+    "prettier": "^2.1.2",
     "sourcegraph": "^24.7.0",
     "typescript": "^4.0.3"
+  },
+  "dependencies": {
+    "@sourcegraph/campaigns-client": "file:../campaigns-client",
+    "rxjs": "^6.6.3",
+    "slugify": "^1.4.5",
+    "ts-node": "^9.0.0"
   }
 }

src/edit-file.test.ts

@@ -0,0 +1,26 @@
+import { editFile } from './edit-file'
+import assert from 'assert'
+
+const input = 'Red redder reddest'
+
+describe('editFile', () => {
+    it('returns identical output', () => {
+        const output = editFile(input, 'foo', 'bar')
+        assert.strictEqual(output, input)
+    })
+
+    it('replaces a string with a replacement', () => {
+        const output = editFile(input, 'red', 'bar')
+        assert.strictEqual(output, 'Red barder bardest')
+    })
+
+    it('replaces a string with a blank string', () => {
+        const output = editFile(input, 'ed', '')
+        assert.strictEqual(output, 'R rder rdest')
+    })
+
+    it('works with blank find string', () => {
+        const output = editFile(input, '', 'foo')
+        assert.strictEqual(output, input)
+    })
+})

src/edit-file.ts

@@ -0,0 +1,14 @@
+/**
+ * Edit a file to apply a string replacement
+ */
+export function editFile(text: string, findString: string, replacement: string): string {
+    if (findString.length === 0) {
+        return text
+    }
+
+    if (!text.includes(findString)) {
+        return text
+    }
+
+    return text.split(findString).join(replacement)
+}

src/find-replace.ts

@@ -1,16 +1,6 @@
-import * as sourcegraph from 'sourcegraph'
+import sourcegraph from 'sourcegraph'
+import { registerFindReplaceAction } from './register-action'
 
-export function activate(ctx: sourcegraph.ExtensionContext): void {
-    ctx.subscriptions.add(
-        sourcegraph.languages.registerHoverProvider(['*'], {
-            provideHover: () => ({
-                contents: {
-                    value: 'Hello world from find-replace! 🎉🎉🎉',
-                    kind: sourcegraph.MarkupKind.Markdown
-                }
-            }),
-        })
-    )
+export function activate(context: sourcegraph.ExtensionContext): void {
+    context.subscriptions.add(registerFindReplaceAction())
 }
-
-// Sourcegraph extension documentation: https://docs.sourcegraph.com/extensions/authoring

src/register-action.ts

@@ -0,0 +1,99 @@
+import { Subscription } from 'rxjs'
+import sourcegraph from 'sourcegraph'
+import { evaluateAndCreateCampaignSpec } from '@sourcegraph/campaigns-client'
+import slugify from 'slugify'
+import { getCurrentUser } from './util'
+import { editFile } from './edit-file'
+
+// TODO: sanitize this for real, it gets used in the description of the campaign
+const escapedMarkdownCode = (text: string): string => '`' + text.replace(/`/g, '\\`') + '`'
+
+export const registerFindReplaceAction = (): Subscription => {
+    const subscription = new Subscription()
+    subscription.add(
+        sourcegraph.commands.registerCommand('findReplace.startFindReplace', async (searchQuery: string) => {
+            // TODO: in the future, use the search query to get the list of matching files.
+            console.log('context.searchQuery', searchQuery)
+
+            if (!searchQuery) {
+                return
+            }
+
+            // To create campaigns, a namespace is used, which can be the current user's username.
+            const currentUser = await getCurrentUser()
+            if (!currentUser) {
+                throw new Error('No current user')
+            }
+            const namespaceName = currentUser.username
+
+            const findString = await sourcegraph.app.activeWindow!.showInputBox({
+                prompt: 'Find all matches of:',
+            })
+            if (!findString) {
+                return
+            }
+
+            const replacementString = await sourcegraph.app.activeWindow!.showInputBox({
+                prompt: 'Replace with:',
+            })
+            // Empty string is a valid replacement, so compare directly with undefined.
+            if (replacementString === undefined) {
+                return
+            }
+
+            const campaignName = `replace-${slugify(findString)}-with-${slugify(replacementString)}`
+            const description = `Replace ${escapedMarkdownCode(findString)} with ${escapedMarkdownCode(
+                replacementString
+            )}`
+
+            let percentage = 0
+            const { applyURL, diffStat } = await sourcegraph.app.activeWindow!.withProgress(
+                { title: '**Find-replace**' },
+                reporter =>
+                    evaluateAndCreateCampaignSpec(namespaceName, {
+                        name: campaignName,
+                        on: [
+                            {
+                                repositoriesMatchingQuery: searchQuery,
+                            },
+                        ],
+                        description,
+                        steps: [
+                            {
+                                // fileFilter is a required property, but we want it to be a noop.
+                                fileFilter: () => true,
+                                editFile: (path, text) => {
+                                    if (!text.includes(findString)) {
+                                        // skip the file by returning null
+                                        return null
+                                    }
+
+                                    percentage += (100 - percentage) / 100
+                                    reporter.next({ message: `Computing changes in ${path}`, percentage })
+
+                                    return editFile(text, findString, replacementString)
+                                },
+                            },
+                        ],
+                        changesetTemplate: {
+                            title: description,
+                            branch: `campaign/${campaignName}`,
+                            commit: {
+                                message: description,
+                                author: {
+                                    name: currentUser.username,
+                                    email: currentUser.email,
+                                },
+                            },
+                            published: false,
+                        },
+                    })
+            )
+            sourcegraph.app.activeWindow!.showNotification(
+                `[**Find-replace changes**](${applyURL}) are ready to preview and apply.\n\n<small>${diffStat.changed} changes made.</small>`,
+                sourcegraph.NotificationType.Success
+            )
+        })
+    )
+    return subscription
+}

src/util.ts

@@ -0,0 +1,23 @@
+import sourcegraph from 'sourcegraph'
+
+interface CurrentUserResponse {
+    data?: {
+        currentUser?: {
+            username: string
+            email: string
+        }
+    }
+    errors?: string[]
+}
+
+export async function getCurrentUser(): Promise<{ username: string; email: string } | undefined> {
+    const response = await sourcegraph.commands.executeCommand<CurrentUserResponse>(
+        'queryGraphQL',
+        `{
+        currentUser {
+          username, email
+        }
+      }`
+    )
+    return response?.data?.currentUser
+}