Fix various incompatibilities.

Author: HalfVoxel

src/all.tsx

@@ -1,5 +1,4 @@
 import './style.scss';
-import { JSON, JsonObject, JsonProperty } from "ta-json";
 import { render, Component } from 'inferno';
 import { PreviewSign } from './view_preview';
 import { Sign, PaperSize } from './data';
@@ -36,8 +35,7 @@ interface SignWithID {
     sign: Sign;
     id: number;
 }
-export class App extends Component {
-    state : { signs: SignWithID[], visible_signs: SignWithID[]};
+export class App extends Component<{}, { signs: SignWithID[], visible_signs: SignWithID[]}>{
 
     constructor(props: any) {
         super(props);

src/main.tsx

@@ -1,5 +1,5 @@
 import './style.scss';
-import { JSON, JsonObject, JsonProperty } from "ta-json";
+import { JSON } from "ta-json";
 import { render, Component } from 'inferno';
 import { PreviewSign } from './view_preview';
 import { Sign } from './data';
@@ -34,7 +34,7 @@ function SignItem({ item, onOpen }: any) {
     )
 }
 
-class SignSelector extends Component {
+class SignSelector extends Component<any, {signs: Sign[] }> {
     constructor(props: any) {
         super(props);
         this.state = { signs: [] }
@@ -94,7 +94,7 @@ class SignSelectorSmall extends SignSelector {
 // How often to save (at most). In milliseconds
 const SavingInterval = 2000;
 
-export class App extends Component {
+export class App extends Component<any, { sign: Sign | null, id: number | null }> {
     saving: boolean;
     debouncedSave = debounce(() => this.save(), SavingInterval);
 

src/view_preview.tsx

@@ -107,7 +107,7 @@ accessMessage[Access.CourseRequired] = "You must complete a course to use this m
 accessMessage[Access.UsableByEveryone] = "All members may use this machine";
 accessMessage[Access.UsableByEveryoneCareful] = "You may use this machine if you know how to operate it and can do so safely";
 
-class CourseQRCode extends Component {
+class CourseQRCode extends Component<{ sign: Sign }, { qrData: string }> {
   state: any;
   lastQRUrl: string = null;
 
@@ -136,7 +136,9 @@ class CourseQRCode extends Component {
           }
         }
 
-        QRCode.toDataURL(url, opts).then(data => {
+        QRCode.toDataURL(url, opts, (e, data) => {
+          // Hack: required when called from constructor
+          this.state.qrData = data;
           this.setState({ qrData: data });
         });
       }
@@ -191,8 +193,7 @@ const SignOutOfOrder = ({sign}: {sign: Sign}) => {
   );
  }
 
-class PreviewSignFooter extends Component {
-  state: any;
+class PreviewSignFooter extends Component<{ sign: Sign, id: number }, { qrData: string }> {
   lastQRUrl: string = null;
 
   constructor(props: any) {
@@ -220,13 +221,17 @@ class PreviewSignFooter extends Component {
         }
       }
 
-      QRCode.toDataURL(url, opts).then(data => {
+      console.log("URL ", url);
+      QRCode.toDataURL(url, opts, (e, data) => {
+        // Hack: required when called from constructor
+        this.state.qrData = data;
         this.setState({ qrData: data });
       });
     }
   }
 
   render() {
+    console.log("Q", this.state.qrData);
     return (
       <Fragment>
         <div class="sign-footer">

tsconfig.json

@@ -6,6 +6,7 @@
     "target": "es5",
     "jsx": "preserve",
     "allowJs": true,
+    "moduleResolution": "node",
     "experimentalDecorators": true,
     "types": [
 			"inferno"