Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Routing problem #42

Open
BlancNicolas opened this issue Nov 29, 2017 · 9 comments
Open

Routing problem #42

BlancNicolas opened this issue Nov 29, 2017 · 9 comments

Comments

@BlancNicolas
Copy link

BlancNicolas commented Nov 29, 2017

Hi ! I wanted to change home to login as first page. So I modified index.js in /src/routes.

What I have changed

export default [

  {
    path: ['/','/login'],
    children: [
      login,
    ],
    async action({ next, render, context }) {
      const component = await next();
      if (component === undefined) return component;
      return render(
        <App context={context}>{component}</App>
      );
    },
  },


  {
    path: '/home',

  // keep in mind, routes are evaluated in order
    children: [
      home,
      // contact,
      table,
      button,
      flotcharts,
      forms,
      grid,
      icons,
      morrisjscharts,
      notification,
      panelwells,
      typography,
      // register,
      blank,
      // place new routes before...
      // content,
      error,
    ],
    async action({ next, render, context }) {
      // console.log('inside dashboard');
      const component = await next();
      // console.log('inside dasdboard component', component);
      if (component === undefined) return component;
      return render(
        <div>
          <Header />
          <div id="page-wrapper" className="page-wrapper">
            <App context={context}>{component}</App>
          </div>
        </div>
      );
    },
  }, 

Problems

1)
The problem is that my CSS didn't load on localhost:3000, and loaded on localhost:3001 (with browsersync though).

2)
When I go to localhost:3001/home, the dashboard appears but it disappears few seconds after. And with the default routing, there is no problem so I guess I don't understand how routing works in this bundle.

The errors from the console

warning.js?85a7:36 Warning: Failed prop type: Invalid prop `children` of type `boolean` supplied to `App`, expected a single ReactElement.
    in App

warning.js?85a7:36 Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op. Please check the code for the ContainerDimensions component.

Thanks for your job, and for this amazing pack !

@sarika01
Copy link
Contributor

For the first problem, when you run in dev mode i.e. with 'npm start', the page is loaded on localhost:3001 with browsersync. If you build it and then run it as node server, then you would be able to see the pages on localhost:3000

For the default routing, it's not just the changes in index.js, you would have to change the route path in individual route files as well. In this case, you would have to change in src/routes/home/index.js

@BlancNicolas
Copy link
Author

in src/home/index.js

export default {

  path: '/home',

  async action() {
    return <Home />;
},
};

in login/index.js

export default {

  path: '/',

  action() {
    return <Login />;
  },

};

Now at localhost:3001/home, nothing appears.

@sarika01
Copy link
Contributor

Did you change back the path for login from array to '/' ? or is the login page loaded by default now?

@BlancNicolas
Copy link
Author

BlancNicolas commented Nov 29, 2017

Yes I changed back but now, after changing these paths in both index/js files, localhost:3000/home or localhost:3001/home show nothing on the navigator.

Moreover, I can see pages on localhost:3000 with "npm start" but a css file dosen't load and there is no error except those from navigator.

@sarika01
Copy link
Contributor

sarika01 commented Nov 29, 2017

Is the login page loading? Which browser are you using?

@BlancNicolas
Copy link
Author

BlancNicolas commented Nov 29, 2017 via email

@sarika01
Copy link
Contributor

You have to swap the position of '/' with login component and '/home' with the list of other routes in the routes/index.js file.

@sarika01
Copy link
Contributor

If you are just looking at showing login page first in the absence of authentication, then you can do it programmatically too in the home/index.js by putting in a check for auth there and then leave the routes as it is.

@BlancNicolas
Copy link
Author

Fixed ! I had to swap position of /' in login.js.

Thank you @sarika01 !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants