inrupt · james-martin-jd · Aug 14, 2019 · Jun 18, 2019 · Jun 19, 2019 · Jun 19, 2019
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,22 @@
 # Solid React Application Generator
 
+## 0.6.0 (August 14, 2019)
+
+#### Solid React Application Base
+
+##### Added
+* New Tic-Tac-Toe Game
+  * Demonstrates key Solid functionality such as:
+      * Discovering where a user wants their application data to be stored
+      * Creating application-specific files and folders
+      * Managing permissions of files and folders
+      * Discovering a global inbox
+      * Sending game invite notifications to a global inbox
+      * Creating and/or discovering an application-specific inbox
+      * Sending application-specific notifications to the application inbox
+      * Granting access to different Pods, to allow opponents to read data from and write data to your Pod
+      * Interoperable notification data structure, so notifications in the global inbox can be read by any compatible application
+
 ## 0.5.2 (June 19, 2019)
 
 #### Solid React Application Base
@@ -11,7 +28,7 @@
 ##### Fixed
 * Fixed some missing error translations
 
-## 0.5.1 (June 5, 2019)
+## 0.5.1 (June 5, 2019)  
 
 #### Solid React Application Base
 

diff --git a/README.md b/README.md
@@ -126,7 +126,7 @@ In the event you want more specific errors in a given component, you can call Er
 <ErrorBoundary
   component={(error, info) => <GlobalError error={error} info={info} />} >
   <App />
-</ErrorBoundary>
+</ErrorBoundary> 
   ```
 
 ## Internationalization
@@ -151,9 +151,22 @@ To add a new language:
 
 Once those two steps are complete then the new language should be compatible with the generated application.
 
+## Access Control
+When building new apps, it's crucial to be able to create and manage access to files and containers. Currently your application requests permissions when the user first authenticates, granting permissions to your application. 
+
+However, many applications will also need to create files or containers and grant access to other people. To that end, the SDK includes examples of creating files and granting access to other users.
+
+For more information, please see the solid-react-components.
+
+## Notifications
+A key part of modern web applications is notifications. Alongside the solid-react-components library, the generated application now has built-in real time notifications. It reads from both the global inbox (if there is one) and the application-specific inbox that the app generates using the components library.
+
+Notifications are generated via the TicTacToe game example. Invites are sent to webIDs provided in the game creation form, and whenever a move is taken in the game a notification is sent to the opponent.
+
 ## Deployment
 
 Once your application is ready, you can deploy it to a server of your choice.
 
 It is ***highly recommended*** that you ensure your server is utilizing TLS. If not, you may encounter security-related errors in the browser, particularly in Google Chrome.
 
+
diff --git a/generators/app/templates/.env b/generators/app/templates/.env
@@ -1,3 +1,4 @@
+REACT_APP_TICTAC_PATH=public/games/tictactoe/
 REACT_APP_VERSION=$npm_package_version
 REACT_APP_NAME=$npm_package_name
-REACT_APP_COMPANY_NAME='inrupt Inc.'
+REACT_APP_COMPANY_NAME=inrupt Inc.
diff --git a/generators/app/templates/.env.example b/generators/app/templates/.env.example
@@ -0,0 +1,4 @@
+REACT_APP_TICTAC_PATH=public/game/tictactoe/
+REACT_APP_VERSION=$npm_package_version
+REACT_APP_NAME=$npm_package_name
+REACT_APP_COMPANY_NAME=inrupt Inc.
diff --git a/generators/app/templates/.eslintrc b/generators/app/templates/.eslintrc
@@ -0,0 +1,36 @@
+{
+  "parser": "babel-eslint",
+  "extends": ["react-app", "airbnb", "prettier"],
+  "plugins": ["react", "prettier", "import"],
+  "rules": {
+    "prettier/prettier": [1],
+    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
+    "no-underscore-dangle": [0],
+    "import/no-unresolved": [0],
+    "no-unused-vars": [1],
+    "react/prop-types": [1],
+    "no-shadow": [0],
+    "no-restricted-syntax": [0],
+    "consistent-return": [0],
+    "import/prefer-default-export": [0],
+    "import/no-cycle": [0],
+    "quotes": [1, "single"],
+    "react/no-array-index-key": [1],
+    "react/jsx-one-expression-per-line": [0],
+    "react/no-unescaped-entities": [0],
+    "import/no-named-as-default": [0],
+    "linebreak-style": [0],
+    "jsx-a11y/label-has-associated-control": [0],
+    "jsx-a11y/label-has-for": [0]
+  },
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true,
+      "modules": true
+    }
+  },
+  "env": {
+    "browser": true,
+    "jest": true
+  }
+}
diff --git a/generators/app/templates/.prettierrc b/generators/app/templates/.prettierrc
@@ -0,0 +1,4 @@
+{
+  "singleQuote": true,
+  "printWidth": 100
+}
diff --git a/generators/app/templates/config/env.js b/generators/app/templates/config/env.js
@@ -1,3 +1,4 @@
+/* eslint-disable */
 const fs = require('fs');
 const path = require('path');
 const paths = require('./paths');
@@ -7,9 +8,7 @@ delete require.cache[require.resolve('./paths')];
 
 const NODE_ENV = process.env.NODE_ENV;
 if (!NODE_ENV) {
-  throw new Error(
-    'The NODE_ENV environment variable is required but was not specified.'
-  );
+  throw new Error('The NODE_ENV environment variable is required but was not specified.');
 }
 
 // https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
@@ -20,7 +19,7 @@ var dotenvFiles = [
   // since normally you expect test to produce the same
   // results for everyone
   NODE_ENV !== 'test' && `${paths.dotenv}.local`,
-  paths.dotenv,
+  paths.dotenv
 ].filter(Boolean);
 
 // Load environment variables from .env* files. Suppress warnings using silent
@@ -32,7 +31,7 @@ dotenvFiles.forEach(dotenvFile => {
   if (fs.existsSync(dotenvFile)) {
     require('dotenv-expand')(
       require('dotenv').config({
-        path: dotenvFile,
+        path: dotenvFile
       })
     );
   }
@@ -74,15 +73,15 @@ function getClientEnvironment(publicUrl) {
         // For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
         // This should only be used as an escape hatch. Normally you would put
         // images into the `src` and `import` them in code to get their paths.
-        PUBLIC_URL: publicUrl,
+        PUBLIC_URL: publicUrl
       }
     );
   // Stringify all values so we can feed into Webpack DefinePlugin
   const stringified = {
     'process.env': Object.keys(raw).reduce((env, key) => {
       env[key] = JSON.stringify(raw[key]);
       return env;
-    }, {}),
+    }, {})
   };
 
   return { raw, stringified };

diff --git a/generators/app/templates/config/jest/cssTransform.js b/generators/app/templates/config/jest/cssTransform.js
@@ -8,5 +8,5 @@ module.exports = {
   getCacheKey() {
     // The output is always the same.
     return 'cssTransform';
-  },
+  }
 };
diff --git a/generators/app/templates/config/jest/fileTransform.js b/generators/app/templates/config/jest/fileTransform.js
@@ -24,5 +24,5 @@ module.exports = {
     }
 
     return `module.exports = ${assetFilename};`;
-  },
+  }
 };
diff --git a/generators/app/templates/config/paths.js b/generators/app/templates/config/paths.js
@@ -1,3 +1,4 @@
+/* eslint-disable */
 const path = require('path');
 const fs = require('fs');
 const url = require('url');
@@ -20,8 +21,7 @@ function ensureSlash(inputPath, needsSlash) {
   }
 }
 
-const getPublicUrl = appPackageJson =>
-  envPublicUrl || require(appPackageJson).homepage;
+const getPublicUrl = appPackageJson => envPublicUrl || require(appPackageJson).homepage;
 
 // We use `PUBLIC_URL` environment variable or "homepage" field to infer
 // "public path" at which the app is served.
@@ -31,8 +31,7 @@ const getPublicUrl = appPackageJson =>
 // like /todos/42/static/js/bundle.7289d.js. We have to know the root.
 function getServedPath(appPackageJson) {
   const publicUrl = getPublicUrl(appPackageJson);
-  const servedUrl =
-    envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : '/');
+  const servedUrl = envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : '/');
   return ensureSlash(servedUrl, true);
 }
 
@@ -47,7 +46,7 @@ const moduleFileExtensions = [
   'tsx',
   'json',
   'web.jsx',
-  'jsx',
+  'jsx'
 ];
 
 // Resolve file paths in the same order as webpack
@@ -79,9 +78,7 @@ module.exports = {
   proxySetup: resolveApp('src/setupProxy.js'),
   appNodeModules: resolveApp('node_modules'),
   publicUrl: getPublicUrl(resolveApp('package.json')),
-  servedPath: getServedPath(resolveApp('package.json')),
+  servedPath: getServedPath(resolveApp('package.json'))
 };
 
-
-
 module.exports.moduleFileExtensions = moduleFileExtensions;
-Original file line number
+Diff line change
@@ Expand Up / @@ -24,5 +24,5 @@ module.exports = { @@
         }
         return `module.exports = ${assetFilename};`;
-      },
+      }
     };