Finish modernization megaticket

README.md

@@ -4,8 +4,8 @@ Two-column web-based git difftool.
 
 <p align="center">
   <a href="https://pypi.org/project/webdiff/" target="_blank"><img alt="PyPI - Version" src="https://img.shields.io/pypi/v/webdiff" /></a>
-  <a href="https://dl.circleci.com/status-badge/redirect/gh/danvk/webdiff/tree/master" target="_blank"><img alt="CircleCI 📝" src="https://dl.circleci.com/status-badge/img/gh/danvk/webdiff/tree/master.svg?style=svg" /></a>
-  <a href="https://github.com/danvk/webdiff/blob/master/LICENSE" target="_blank"><img alt="License: Apache2 📝" src="https://img.shields.io/github/license/danvk/webdiff" /></a>
+  <a href="https://dl.circleci.com/status-badge/redirect/gh/danvk/webdiff/tree/main" target="_blank"><img alt="CircleCI 📝" src="https://dl.circleci.com/status-badge/img/gh/danvk/webdiff/tree/main.svg?style=svg" /></a>
+  <a href="https://github.com/danvk/webdiff/blob/main/LICENSE" target="_blank"><img alt="License: Apache2 📝" src="https://img.shields.io/github/license/danvk/webdiff" /></a>
   <a href="https://github.com/sponsors/danvk" target="_blank"><img alt="Sponsor: On GitHub 💸" src="https://img.shields.io/badge/sponsor-on_github_💸-21bb42.svg" /></a>
 </p>
 
@@ -19,10 +19,10 @@ Features include:
 
 <!-- These are absolute URLs so that they display on pypi.org -->
 <!-- This is `git webdiff 05157bba^..05157bba`, in this repo -->
-![Screenshot of webdiff in action](https://raw.githubusercontent.com/danvk/webdiff/master/images/webdiff.png)
+![Screenshot of webdiff in action](https://raw.githubusercontent.com/danvk/webdiff/main/images/webdiff.png)
 
 <!-- This is `git webdiff c80f969^..c80f969` in the dygraphs-dpxdt repo -->
-![Screenshot of image diffs](https://raw.githubusercontent.com/danvk/webdiff/master/images/webdiff-images.png)
+![Screenshot of image diffs](https://raw.githubusercontent.com/danvk/webdiff/main/images/webdiff-images.png)
 
 ## Installation
 

pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "poetry.core.masonry.api"
 
 [tool.poetry]
 name = "webdiff"
-version = "1.1.0"
+version = "1.2.0"
 description = "Two-column web-based git difftool"
 license = "Apache-2.0"
 readme = "README.md"

tests/version_test.py

@@ -0,0 +1,16 @@
+# Make sure the versions in pyproject.toml and package.json stay in sync.
+
+import json
+import tomllib
+
+
+def test_versions_in_sync():
+    with open('ts/package.json') as f:
+        pkg = json.load(f)
+    with open('pyproject.toml', 'rb') as f:
+        pyproj = tomllib.load(f)
+
+    pyver = pyproj['tool']['poetry']['version']
+    jsver = pkg['version']
+
+    assert jsver == pyver

ts/CodeDiffContainer.tsx

@@ -62,6 +62,19 @@ export function NoChanges(props: {filePair: any}) {
   return null;
 }
 
+// Either side can be empty (i.e. an add or a delete), in which case
+// getOrNull resolves to null
+async function getOrNull(side: string, path: string) {
+  if (!path) return null;
+  const data = new URLSearchParams();
+  data.set('path', path);
+  const response = await fetch(`/${side}/get_contents`, {
+    method: 'post',
+    body: data,
+  });
+  return response.text();
+}
+
 // A side-by-side diff of source code.
 export function CodeDiffContainer(props: {filePair: FilePair; diffOptions: Partial<DiffOptions>}) {
   const {filePair, diffOptions} = props;
@@ -71,19 +84,6 @@ export function CodeDiffContainer(props: {filePair: FilePair; diffOptions: Parti
   >();
 
   React.useEffect(() => {
-    // Either side can be empty (i.e. an add or a delete), in which case
-    // getOrNull resolves to null
-    var getOrNull = async (side: string, path: string) => {
-      if (!path) return null;
-      const data = new URLSearchParams();
-      data.set('path', path);
-      const response = await fetch(`/${side}/get_contents`, {
-        method: 'post',
-        body: data,
-      });
-      return response.text();
-    };
-
     const getDiff = async () => {
       const response = await fetch(`/diff/${filePair.idx}`, {
         method: 'POST',
@@ -98,6 +98,7 @@ export function CodeDiffContainer(props: {filePair: FilePair; diffOptions: Parti
 
     const {a, b} = filePair;
     // Do XHRs for the contents of both sides in parallel and fill in the diff.
+    // TODO: split these into three useEffects to avoid over-fetching when diff options change.
     (async () => {
       const [before, after, diffOps] = await Promise.all([
         getOrNull('a', a),

ts/Root.tsx

@@ -33,27 +33,23 @@ export function Root(props: Props) {
     document.title = 'Diff: ' + filePairDisplayName(filePair) + ' (' + filePair.type + ')';
   }, [filePair]);
 
+  // TODO: switch to useKey() or some such
   React.useEffect(() => {
     const handleKeydown = (e: KeyboardEvent) => {
       if (!isLegitKeypress(e)) return;
-      if (e.keyCode == 75) {
-        // j
+      if (e.code == 'KeyK') {
         if (idx > 0) {
           selectIndex(idx - 1);
         }
-      } else if (e.keyCode == 74) {
-        // k
+      } else if (e.code == 'KeyJ') {
         if (idx < pairs.length - 1) {
           selectIndex(idx + 1);
         }
-      } else if (e.keyCode == 83) {
-        // s
+      } else if (e.code == 'KeyS') {
         setImageDiffMode('side-by-side');
-      } else if (e.keyCode == 66) {
-        // b
+      } else if (e.code == 'KeyB') {
         setImageDiffMode('blink');
-      } else if (e.keyCode == 80) {
-        // p
+      } else if (e.code == 'KeyP') {
         setPDiffMode(PDIFF_MODES[(PDIFF_MODES.indexOf(pdiffMode) + 1) % 3]);
       }
     };

ts/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webdiff",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "client-side code for webdiff",
   "main": "index.js",
   "author": "Dan Vanderkam ([email protected])",