chg: pkg: make a massive refactor to the backend and remove all unnecessary deps - and make small refactors for the frontend too #4

assets/js/mine-seeker/app.js

@@ -6,7 +6,7 @@ class MineSeeker extends React.Component {
   constructor(props) {
     super(props);
 
-    let gameAssoc = '' !== props.gameId ? props.gameId : this.makeGameAssoc(50);
+    let gameAssoc = '' !== props.gameId ? props.gameId : crypto.randomUUID();
     let channel = 'mineseeker/channel/' + gameAssoc;
 
     this.state = {
@@ -23,15 +23,6 @@ class MineSeeker extends React.Component {
     };
   }
 
-  makeGameAssoc(len) {
-    let text = '';
-    let possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
-    for (let i = 0; i < len; i++) {
-      text += possible.charAt(Math.floor(Math.random() * possible.length));
-    }
-    return text;
-  }
-
   currectGridSize() {
     let $field = $('#mine-wrapper .grid');
     $field.height($field.width());
@@ -174,27 +165,6 @@ class MineSeeker extends React.Component {
     }
   }
 
-  /**
-   * @see https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus
-   * @see https://developers.facebook.com/docs/sharing/reference/send-dialog
-   * @see https://developers.facebook.com/docs/plugins/share-button/
-   */
-  clickFBShare() {
-    let display = 'popup';
-
-    FB.getLoginStatus(function(response) {
-      display = 'connected' === response.status
-        ? 'dialog'
-        : 'popup';
-    });
-
-    FB.ui({
-      method: 'send',
-      display: display,
-      link: window.location.href + '/' + this.state.gameAssoc,
-    });
-  }
-
   wInit(session, gridServer, gridClient) {
     this.setState({ session: session });
 
@@ -227,15 +197,10 @@ class MineSeeker extends React.Component {
             <div className="clippy">
               <input
                 id="foo"
-                defaultValue={window.location.href + '/' + this.state.gameAssoc}
+                defaultValue={`${window.location.href}/${this.state.gameAssoc}`}
               />
             </div>
-            {'dev' !== this.state.env
-              && <a onClick={this.clickFBShare.bind(this)}>Share in Facebook message</a>
-            }
-            {'dev' === this.state.env
-              && <a href={'/play/' + this.state.gameAssoc} target="_blank">Play w/ me!</a>
-            }
+            <a href={`/play/${this.state.gameAssoc}`} target="_blank">Play w/ me!</a>
           </div>
         ) : '',
       renderGridFields: this.state.gameAssoc,

assets/js/mine-seeker/grid/grid.js

@@ -24,11 +24,7 @@ class Grid extends React.Component {
 
   createSet(obj) {
     for (let i = 0, j = this.state.row * this.state.col; i < j; i++) {
-      obj.push(
-        0 < this.state.mines
-          ? 'm'
-          : 'w',
-      );
+      obj.push(0 < this.state.mines ? 'm' : 'w');
       this.state.mines--;
     }
 
@@ -61,15 +57,8 @@ class Grid extends React.Component {
     return grid;
   }
 
-  checkMine(field, i, j) {
-    return 'undefined' !== typeof field[i] && 'undefined' !== typeof field[i][j] && 'm' === field[i][j];
-  }
-
   isThereMine(obj, row, col) {
-    if (this.checkMine(obj, row, col)) {
-      return 1;
-    }
-    return 0;
+    return 'm' === obj?.[row]?.[col] ? 1 : 0;
   }
 
   numberingGrid(obj) {