quilt_rails 1.7.0 → 1.8.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7327df33398c0cf113388e765ed893ba61d6d90c0eeec85989a52f0974da4d77
-  data.tar.gz: c99c5ae5c7cfc371e7687741fcd36fed8dfa002d64d9f52eeacb8d27598c5c08
+  metadata.gz: 393d55d7b0940edb22882fff283debdc403bd991172f4f4fc80c8f11e9e63ca7
+  data.tar.gz: 54eab8702f1f45dcba856e79474ccbde6f575e200b4a4fbb094ffb822d5040cb
 SHA512:
-  metadata.gz: '09c0e63254e5c3e18ac56a52eb28470fd5994a8c1887052d26c2b385391f5fe9ba294f3afd43e8942a039bb5a4d12fab2746e38a1f924de8c920f08c67e1176c'
-  data.tar.gz: d97df6949379a1ec9a6f7ae9636f7008f0a791065a37ba6e5715bf0f489ce7bb7135a44817f6fb5ea4915b1cfea7810fe75f9f54db807b79f5d14c3fbd014315
+  metadata.gz: 000d1fee3b1fc1650f9f7ef9eefe5794facbdd3b05907e7d0b5e72214e7486a76a1c07f9eedd02593c3e366f6ffdcd7bf8592d1db744cdfb6d876cc3a48caec7
+  data.tar.gz: 9444a83ad67ff6298e10554bf3bf33c3a0db9b22bfd6f19f8cf918c6d31d4ed0f62cc369b3fe44867cf2bab41bf5242c991e0820c63b9c671b0313a9d4a8cb2f

data/README.md

@@ -63,8 +63,8 @@ An application can also be setup manually using the following steps.
 # Add core Node dependencies
 yarn add @shopify/sewing-kit @shopify/react-server
 
-# Add Polaris and React
-yarn add @shopify/polaris react react-dom
+# Add React
+yarn add react react-dom
 
 yarn
 dev up
@@ -121,22 +121,15 @@ Add routes to default to the `ReactController`.
 
 `sewing_kit` looks for the top level component of your React app in `app/ui/index`. The component exported from this component (and any imported JS/CSS) will be built into a `main` bundle, and used to render the initial server-rendered markup.
 
-We will add a basic entrypoint using React with Polaris components.
+We will add a basic entrypoint using React with some HTML.
 
 ```tsx
 // app/ui/index.tsx
 
 import React from 'react';
-import {AppProvider, Page, Card} from '@shopify/polaris';
 
 function App() {
-  return (
-    <AppProvider>
-      <Page title="Hello">
-        <Card sectioned>Hi there</Card>
-      </Page>
-    </AppProvider>
-  );
+  return <h1>My application ❤️</h1>;
 }
 
 export default App;
@@ -165,7 +158,7 @@ The basic layout for an app using `quilt_rails` and friends will have a `ui` fol
        └─- react_controller.rb (see above)
 ```
 
-### Rails, Polaris, and React
+### Rails and React
 
 A more complex application will want a more complex layout. The following shows scalable locations for:
 
@@ -181,7 +174,7 @@ A more complex application will want a more complex layout. The following shows
     └── ui
         ├─- index.{js|ts} (exports a React component)
         ├── styles (optional)
-        │   └── settings.scss (global vars and @polaris overrides)
+        └── shared.scss (common functions/mixins you want available in every scss file. Requires configuring `plugin.sass`'s `autoInclude` option in `sewing-kit.config.js`)
         │
         └── tests (optional)
         │   └── each-test.{js|ts}
@@ -293,53 +286,15 @@ describe('MyComponent', () => {
 });
 ```
 
-### Test setup files
-
-By default, the jest plugin will look for test setup files under `/app/ui/tests`.
-
-`setup` can be used to add any custom polyfills needed for the testing environment.
-
-```tsx
-// app/ui/tests/setup.ts
-
-import 'isomorphic-fetch';
-import 'raf/polyfill';
-import {URL, URLSearchParams} from 'url';
-
-(global as any).URL = URL;
-(global as any).URLSearchParams = URLSearchParams;
-```
-
-`each-test` can be used for any logic that needs to run for each individual test suite. Any setup logic that needs to happen with `jest` globals in scope, such as importing custom matchers, should also be done here.
+#### Customizing the test environment
 
-```tsx
-// app/ui/tests/each-test.ts
+Often you will want to hook up custom polyfills, global mocks, or other logic that needs to run either before the initialization of the test environment, or once for each test suite.
 
-// we cannot import these in `setup` because `expect` will not be defined
-import '@shopify/react-testing/matchers';
-
-beforeAll(() => {
-  console.log('I will run before every test suite');
-});
-
-beforeEach(() => {
-  console.log('I will run before every test case');
-});
-
-afterEach(() => {
-  console.log('I will run after every test case');
-});
-
-afterAll(() => {
-  console.log('I will run after every test suite');
-});
-```
-
-For more complete documentation of the jest plugin see [it's documentation](https://github.com/Shopify/sewing-kit/tree/master/docs/plugins/jest.md).
+By default, sewing-kit will look for such test setup files under `/app/ui/tests`. Check out the [documentation](https://github.com/Shopify/sewing-kit/blob/master/docs/plugins/jest.md#smart-defaults) for more details.
 
 ### Interacting with the request and response in React code
 
-React-server sets up [@shopify/react-network](https://github.com/Shopify/quilt/blob/master/packages/react-network/src/hooks.ts#L25) automatically, so most interactions with the request or response can be done from inside the React app.
+React-server sets up [@shopify/react-network](https://github.com/Shopify/quilt/blob/master/packages/react-network) automatically, so most interactions with the request or response can be done from inside the React app.
 
 #### Example: getting headers
 
@@ -347,7 +302,6 @@ React-server sets up [@shopify/react-network](https://github.com/Shopify/quilt/b
 // app/ui/index.tsx
 
 import React from 'react';
-import {AppProvider, Page, Card} from '@shopify/polaris';
 import {useRequestHeader} from '@shopify/react-network';
 
 function App() {
@@ -355,12 +309,10 @@ function App() {
   const someHeaderICareAbout = useRequestHeader('some-header');
 
   return (
-    <AppProvider>
-      <Page title="Hello">
-        {someHeaderICareAbout}
-        <Card sectioned>Hi there</Card>
-      </Page>
-    </AppProvider>
+    <>
+      <h1>My application ❤️</h1>
+      <div>{someHeaderICareAbout}</div>
+    </>
   );
 }
 
@@ -373,20 +325,13 @@ export default App;
 // app/ui/index.tsx
 
 import React from 'react';
-import {AppProvider, Page, Card} from '@shopify/polaris';
 import {useRedirect} from '@shopify/react-network';
 
 function App() {
   // redirect to google as soon as we render
   useRedirect('www.google.com');
 
-  return (
-    <AppProvider>
-      <Page title="Hello">
-        <Card sectioned>Hi there</Card>
-      </Page>
-    </AppProvider>
-  );
+  return <h1>My application ❤️</h1>;
 }
 
 export default App;

data/lib/generators/quilt/install_generator.rb

@@ -8,7 +8,24 @@ module Quilt
 
     def install_js_dependencies
       say "Installing @shopify/react-server and @shopify/sewing-kit dependencies"
-      system("yarn add @shopify/sewing-kit @shopify/react-server") unless Rails.env.test?
+      system("yarn add "\
+        "@shopify/sewing-kit "\
+        "@shopify/react-server "\
+        "typescript "\
+        "react "\
+        "react-dom "\
+        "@types/react "\
+        "@types/react-dom") unless Rails.env.test?
+    end
+
+    def create_tsconfig
+      tsconfig_path = "tsconfig.json"
+
+      unless File.exist?(tsconfig_path)
+        copy_file "tsconfig.json", tsconfig_path
+
+        log(tsconfig_path, 'wrote')
+      end
     end
 
     def create_app_file

data/lib/generators/quilt/templates/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "@shopify/typescript-configs/application.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "rootDir": "."
+  },
+  "include": ["app/ui"]
+}

data/lib/generators/sewing_kit/templates/sewing-kit.config.ts

@@ -1,7 +1,7 @@
 /* eslint-env node */
 
-module.exports = function sewingKitConfig() {
-  return {
-    name: 'your-app-name',
-  };
-};
+import {Env, Plugins} from '@shopify/sewing-kit';
+
+export default function sewingKitConfig(_plugins: Plugins, _env: Env) {
+  return {};
+}

data/lib/quilt_rails/version.rb

@@ -1,4 +1,4 @@
 # frozen_string_literal: true
 module Quilt
-  VERSION = "1.7.0"
+  VERSION = "1.8.0"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: quilt_rails
 version: !ruby/object:Gem::Version
-  version: 1.7.0
+  version: 1.8.0
 platform: ruby
 authors:
 - Mathew Allen
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-09-24 00:00:00.000000000 Z
+date: 2019-09-25 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties
@@ -82,6 +82,7 @@ files:
 - lib/generators/quilt/install_generator.rb
 - lib/generators/quilt/templates/App.tsx
 - lib/generators/quilt/templates/routes.rb
+- lib/generators/quilt/templates/tsconfig.json
 - lib/generators/sewing_kit/USAGE
 - lib/generators/sewing_kit/install_generator.rb
 - lib/generators/sewing_kit/templates/sewing-kit.config.ts