superglue 0.53.2 → 1.0.0

data/lib/generators/rails/templates/web/index.js

@@ -1,56 +0,0 @@
-import React from 'react'
-import { useSelector } from 'react-redux'
-
-export default function <%= plural_table_name.camelize %>Index({
-  // visit,
-  // remote,
-  new<%= singular_table_name.camelize %>Path,
-  <%= plural_table_name.camelize(:lower) %> = [],
-}) {
-  const flash = useSelector((state) => state.flash)
-
-  const <%= singular_table_name.camelize(:lower) %>Items = <%= plural_table_name.camelize(:lower) %>.map((<%= singular_table_name.camelize(:lower) %>, key) => {
-    const deleteForm = <%=singular_table_name.camelize(:lower)%>.deleteForm;
-
-    return (
-      <tr key={<%= singular_table_name.camelize(:lower) %>.id}>
-        <%- attributes_list.select{|attr| attr != :id }.each do |attr| -%>
-        <td>{<%=singular_table_name.camelize(:lower)%>.<%=attr.camelize(:lower)%>}</td>
-        <%- end -%>
-        <td><a href={ <%=singular_table_name%>.<%=singular_table_name.camelize(:lower)%>Path } data-sg-visit>Show</a></td>
-        <td><a href={ <%=singular_table_name%>.edit<%=singular_table_name.camelize%>Path } data-sg-visit>Edit</a></td>
-        <td>
-          <form {...deleteForm.props} data-sg-visit>
-            {Object.values(deleteForm.extras).map((hiddenProps) => (<input {...hiddenProps} key={hiddenProps.id} type="hidden"/>))}
-            <button type="submit">Delete</button>
-          </form>
-        </td>
-      </tr>
-    )
-  })
-
-  return (
-    <div>
-      <p id="notice">{flash && flash.notice}</p>
-
-      <h1><%= plural_table_name.capitalize %></h1>
-
-      <table>
-        <thead>
-          <%- attributes_list.select{|attr| attr != :id }.each do |attr| -%>
-          <tr><th><%=attr.capitalize%></th></tr>
-          <%- end -%>
-          <tr>
-            <th colSpan="3"></th>
-          </tr>
-        </thead>
-
-        <tbody>
-          {<%= singular_table_name %>Items}
-        </tbody>
-      </table>
-      <br />
-      <a href={new<%= singular_table_name.camelize %>Path} data-sg-visit>New <%= singular_table_name.capitalize %></a>
-    </div>
-  )
-}

data/lib/generators/rails/templates/web/new.js

@@ -1,33 +0,0 @@
-import React from 'react'
-// import { useSelector } from 'react-redux'
-
-export default function <%= plural_table_name.camelize %>New({
-  // visit,
-  // remote
-  form,
-  errors,
-  <%= plural_table_name.camelize(:lower) %>Path,
-}) {
-  const messagesEl = errors && (
-    <div id="error_explanation">
-      <h2>{ errors.explanation }</h2>
-      <ul>{ errors.messages.map(({body})=> <li key={body}>{body}</li>) }</ul>
-    </div>
-  )
-
-  return (
-    <div>
-      {messagesEl}
-      <form {...form.props} data-sg-visit>
-        {Object.values(form.extras).map((hiddenProps) => (<input {...hiddenProps} key={hiddenProps.id} type="hidden"/>))}
-        <%- attributes.each do |attr| -%>
-        <input {...form.inputs.<%= attr.column_name %>} type="text"/>
-        <label htmlFor={form.inputs.<%= attr.column_name %>.id}><%= attr.column_name %></label>
-        <%- end -%>
-        <button {...form.inputs.submit} type="submit"> {...form.inputs.submit.text} </button>
-      </form>
-
-      <a href={<%= plural_table_name.camelize(:lower) %>Path} data-sg-visit>Back</a>
-    </div>
-  )
-}

data/lib/generators/rails/templates/web/show.js

@@ -1,28 +0,0 @@
-import React from 'react'
-import { useSelector } from 'react-redux'
-
-export default function <%= plural_table_name.camelize %>Show({
-  // visit,
-  // remote,
-  <%- attributes_list_with_timestamps.select{|attr| attr != :id }.each do |attr| -%>
-  <%=attr.camelize(:lower)%>,
-  <%- end -%>
-  edit<%= singular_table_name.camelize %>Path,
-  <%= plural_table_name.camelize(:lower) %>Path
-}) {
-  const flash = useSelector((state) => state.flash)
-
-  return (
-    <div>
-      <p id="notice">{flash && flash.notice}</p>
-      <%- attributes_list_with_timestamps.select{|attr| attr != :id }.each do |attr| -%>
-      <p>
-        <strong><%= attr.capitalize %>:</strong>
-        {<%=attr.camelize(:lower)%>}
-      </p>
-      <%- end -%>
-      <a href={ edit<%= singular_table_name.camelize %>Path } data-sg-visit>Edit</a>
-      <a href={ <%= plural_table_name.camelize(:lower) %>Path } data-sg-visit>Back</a>
-    </div>
-  )
-}

data/lib/install/templates/web/actions.js

@@ -1,6 +0,0 @@
-import { createAction } from '@reduxjs/toolkit'
-import { SAVE_RESPONSE, BEFORE_VISIT, UPDATE_FRAGMENTS } from '@thoughtbot/superglue'
-
-export const saveResponse = createAction(SAVE_RESPONSE)
-export const beforeVisit = createAction(BEFORE_VISIT)
-export const updateFragments = createAction(UPDATE_FRAGMENTS)

data/lib/install/templates/web/application_visit.js

@@ -1,65 +0,0 @@
-import { visit, remote } from '@thoughtbot/superglue/action_creators'
-
-export function buildVisitAndRemote(ref, store) {
-  const appRemote = (...args) => {
-    return store.dispatch(remote(...args))
-  }
-
-  const appVisit = (...args) => {
-    // Do something before
-    // e.g, show loading state, you can access the current pageKey
-    // via store.getState().superglue.currentPageKey
-    let { action } = args
-
-    return store
-      .dispatch(visit(...args))
-      .then((meta) => {
-        // The assets fingerprints changed, instead of transitioning
-        // just go to the URL directly to retrieve new assets
-        if (meta.needsRefresh) {
-          window.location = meta.url
-          return
-        }
-
-        ref.current.navigateTo(meta.pageKey, {
-          action: meta.suggestedAction,
-        })
-
-        // always return meta
-        return meta
-      })
-      .finally(() => {
-        // Do something after
-        // e.g, hide loading state, you can access the changed pageKey
-        // via getState().superglue.currentPageKey
-      })
-      .catch((err) => {
-        const response = err.response
-
-        if (!response) {
-          console.error(err)
-          return
-        }
-
-        if (response.ok) {
-          // err gets thrown, but if the response is ok,
-          // it must be an html body that
-          // superglue can't parse, just go to the location
-          window.location = response.url
-        } else {
-          if (response.status >= 400 && response.status < 500) {
-            window.location = '/400.html'
-            return
-          }
-
-          if (response.status >= 500) {
-            window.location = '/500.html'
-            return
-          }
-        }
-      })
-  }
-
-  return { visit: appVisit, remote: appRemote }
-}
-

data/lib/install/templates/web/flash.js

@@ -1,19 +0,0 @@
-import { createSlice } from '@reduxjs/toolkit'
-import { saveResponse, beforeVisit } from '../actions'
-
-export const flashSlice = createSlice({
-  name: 'flash',
-  initialState: {},
-  extraReducers: (builder) => {
-    builder.addCase(beforeVisit, (state, action) => {
-      return {}
-    })
-    builder.addCase(saveResponse, (state, action) => {
-      const { page } = action.payload;
-
-      return {
-        ...state, ...page.slices.flash
-      }
-    })
-  }
-})

data/lib/install/templates/web/page_to_page_mapping.js

@@ -1,12 +0,0 @@
-// import your page component
-// e.g import PostsEdit from '../views/posts/edit'
-
-
-// Mapping between your props template to Component, you must add to this
-// to register any new page level component you create. If you are using the
-// scaffold, it will auto append the identifers for you.
-//
-// e.g {'posts/new': PostNew}
-export const pageIdentifierToPageComponent = {
-};
-

data/lib/install/templates/web/pages.js

@@ -1,15 +0,0 @@
-import { createSlice } from '@reduxjs/toolkit'
-import { saveResponse, beforeVisit } from '../actions'
-
-export const pagesSlice = createSlice({
-  name: 'pages',
-  // extraReducers: (builder) => {
-  //   builder.addCase(beforeVisit, (state, action) => {
-  //     const {currentPageKey} = action.payload
-  //
-  //     const currentPage = draft[currentPageKey]
-  //     delete currentPage.error
-  //   })
-  // }
-})
-

data/lib/install/templates/web/store.js

@@ -1,32 +0,0 @@
-import { configureStore } from '@reduxjs/toolkit'
-import { pagesSlice } from "./slices/pages"
-import { flashSlice } from "./slices/flash"
-import {
-  BEFORE_VISIT,
-  BEFORE_FETCH,
-  BEFORE_REMOTE,
-  fragmentMiddleware
-} from '@thoughtbot/superglue'
-
-export const buildStore = (initialState, superglueReducer, supergluePagesReducer) => {
-
-  return configureStore({
-    preloadedState: initialState,
-    devTools: process.env.NODE_ENV !== 'production',
-    middleware: (getDefaultMiddleware) =>
-      getDefaultMiddleware({
-        serializableCheck: {
-          ignoredActions: [BEFORE_VISIT, BEFORE_FETCH, BEFORE_REMOTE],
-        },
-      }).concat(fragmentMiddleware),
-    reducer: {
-      superglue: superglueReducer,
-      pages: (state, action) => {
-        const nextState = supergluePagesReducer(state, action)
-        return pagesSlice.reducer(nextState, action)
-      },
-      flash: flashSlice.reducer
-    },
-  });
-};
-

data/lib/install/web.rb

@@ -1,55 +0,0 @@
-def add_member_methods
-  inject_into_file "app/models/application_record.rb", after: "class ApplicationRecord < ActiveRecord::Base\n" do
-    <<-RUBY
-  def self.member_at(index)
-    offset(index).limit(1).first
-  end
-
-  def self.member_by(attr, value)
-    find_by(Hash[attr, value])
-  end
-    RUBY
-  end
-end
-
-def app_js_path
-  "app/javascript/"
-end
-
-say "Copying application.js file to #{app_js_path}"
-copy_file "#{__dir__}/templates/web/application.js", "#{app_js_path}/application.js"
-
-say "Copying page_to_page_mapping.js file to #{app_js_path}"
-copy_file "#{__dir__}/templates/web/page_to_page_mapping.js", "#{app_js_path}/page_to_page_mapping.js"
-
-say "Copying flash.js file to #{app_js_path}"
-copy_file "#{__dir__}/templates/web/flash.js", "#{app_js_path}/slices/flash.js"
-
-say "Copying pages.js file to #{app_js_path}"
-copy_file "#{__dir__}/templates/web/pages.js", "#{app_js_path}/slices/pages.js"
-
-say "Copying store.js file to #{app_js_path}"
-copy_file "#{__dir__}/templates/web/store.js", "#{app_js_path}/store.js"
-
-say "Copying actions.js file to #{app_js_path}"
-copy_file "#{__dir__}/templates/web/actions.js", "#{app_js_path}/actions.js"
-
-say "Copying application_visit.js file to #{app_js_path}"
-copy_file "#{__dir__}/templates/web/application_visit.js", "#{app_js_path}/application_visit.js"
-
-say "Copying Superglue initializer"
-copy_file "#{__dir__}/templates/web/initializer.rb", "config/initializers/superglue.rb"
-
-say "Copying application.json.props"
-copy_file "#{__dir__}/templates/web/application.json.props", "app/views/layouts/application.json.props"
-
-say "Adding required member methods to ApplicationRecord"
-add_member_methods
-
-say "Installing FormProps"
-run "bundle add form_props"
-
-say "Installing Superglue and friends"
-run "yarn add history react react-dom @reduxjs/toolkit react-redux @thoughtbot/superglue --save"
-
-say "Superglue is Installed! 🎉", :green

data/lib/tasks/install.rake

@@ -1,9 +0,0 @@
-namespace :superglue do
-  namespace :install do
-    desc "Install everything needed for superglue web"
-    task "web" do
-      template = File.expand_path("../install/web.rb", __dir__)
-      exec "#{RbConfig.ruby} ./bin/rails app:template LOCATION=#{template}"
-    end
-  end
-end