Add a base class for chooser factories

client/src/components/ChooserWidget/index.js

@@ -138,3 +138,22 @@ export class Chooser {
     });
   }
 }
+
+export class ChooserFactory {
+  widgetClass = Chooser;
+
+  constructor(html, idPattern) {
+    this.html = html;
+    this.idPattern = idPattern;
+  }
+
+  render(placeholder, name, id, initialState) {
+    const html = this.html.replace(/__NAME__/g, name).replace(/__ID__/g, id);
+    // eslint-disable-next-line no-param-reassign
+    placeholder.outerHTML = html;
+    // eslint-disable-next-line new-cap
+    const chooser = new this.widgetClass(id);
+    chooser.setState(initialState);
+    return chooser;
+  }
+}

client/src/entrypoints/documents/document-chooser-telepath.js

@@ -1,19 +1,8 @@
-class DocumentChooserFactory {
-  constructor(html, idPattern) {
-    this.html = html;
-    this.idPattern = idPattern;
-  }
+import { ChooserFactory } from '../../components/ChooserWidget';
 
-  render(placeholder, name, id, initialState) {
-    const html = this.html.replace(/__NAME__/g, name).replace(/__ID__/g, id);
-    // eslint-disable-next-line no-param-reassign
-    placeholder.outerHTML = html;
-    /* the DocumentChooser object also serves as the JS widget representation */
-    // eslint-disable-next-line no-undef
-    const chooser = new DocumentChooser(id);
-    chooser.setState(initialState);
-    return chooser;
-  }
+class DocumentChooserFactory extends ChooserFactory {
+  // eslint-disable-next-line no-undef
+  widgetClass = DocumentChooser;
 }
 window.telepath.register(
   'wagtail.documents.widgets.DocumentChooser',

client/src/entrypoints/images/image-chooser-telepath.js

@@ -1,19 +1,8 @@
-class ImageChooserFactory {
-  constructor(html, idPattern) {
-    this.html = html;
-    this.idPattern = idPattern;
-  }
+import { ChooserFactory } from '../../components/ChooserWidget';
 
-  render(placeholder, name, id, initialState) {
-    const html = this.html.replace(/__NAME__/g, name).replace(/__ID__/g, id);
-    // eslint-disable-next-line no-param-reassign
-    placeholder.outerHTML = html;
-    /* the ImageChooser object also serves as the JS widget representation */
-    // eslint-disable-next-line no-undef
-    const chooser = new ImageChooser(id);
-    chooser.setState(initialState);
-    return chooser;
-  }
+class ImageChooserFactory extends ChooserFactory {
+  // eslint-disable-next-line no-undef
+  widgetClass = ImageChooser;
 }
 window.telepath.register(
   'wagtail.images.widgets.ImageChooser',

client/src/entrypoints/snippets/snippet-chooser-telepath.js

@@ -1,19 +1,8 @@
-class SnippetChooserFactory {
-  constructor(html, idPattern) {
-    this.html = html;
-    this.idPattern = idPattern;
-  }
+import { ChooserFactory } from '../../components/ChooserWidget';
 
-  render(placeholder, name, id, initialState) {
-    const html = this.html.replace(/__NAME__/g, name).replace(/__ID__/g, id);
-    // eslint-disable-next-line no-param-reassign
-    placeholder.outerHTML = html;
-    /* the SnippetChooser object also serves as the JS widget representation */
-    // eslint-disable-next-line no-undef
-    const chooser = new SnippetChooser(id);
-    chooser.setState(initialState);
-    return chooser;
-  }
+class SnippetChooserFactory extends ChooserFactory {
+  // eslint-disable-next-line no-undef
+  widgetClass = SnippetChooser;
 }
 window.telepath.register(
   'wagtail.snippets.widgets.SnippetChooser',