1507 comments

Currently RubixAssetMiddleware only takes 2 parameters: ltr and rtl for rendering main.scss and main-rtl.scss. The middleware does not check the URL params for rendering the correct CSS file.

However, we have provided the complete source for this middleware in rubix/rubix-bootstrap/src/node/RubixAssetMiddleware.js file. You can copy this file to your project folder and make the necessary changes. The middleware has access to the incoming request object. You can get the URL params from the request object and render the correct CSS file.

I'm currently using Rubix (great work by the way !) with a new React project created with create-react-app boilerplate.Is there a way I can create the same charts you display on the rubix demo page (the dashboard ones) ? I didn't see a "charts" section on the documentation so I'm wondering what are my options here.

I have a second question about handling a route inside SidebarNavItem.

I'm trying to link an item with a SidebarNavItem and I see you can provide a "href" props. Problem is that I'm currently using <Router history={hashHistory}>to create an history on my frontend. When using this, I get this warning "Warning: You cannot PUSH the same path using hash history". Is there any way I can't avoid this with your component ?

> Is there a way I can create the same charts you display on the rubix demo page (the dashboard ones) ? I didn't see a "charts" section on the documentation so I'm wondering what are my options here.

Please include a script tag to public/js/rubix.js in your index.html file. This will enable Rubix charts in your project. Currently we don't have a documentation for the charts but we have provided examples that covers all the functionalities in the demo/src/routes/AreaSeries.js, demo/src/routes/BarColSeries.js, demo/src/routes/MixedSeries.js, demo/src/routes/LineSeries.js, demo/src/routes/PieDonutSeries.js and of course demo/src/routes/Dashboard.js files.

> I have a second question about handling a route inside SidebarNavItem.

> I'm trying to link an item with a SidebarNavItem and I see you can provide a "href" props. Problem is that I'm currently using<Router history={hashHistory}>to create an history on my frontend. When using this, I get this warning "Warning: You cannot PUSH the same path using hash history". Is there any way I can't avoid this with your component ?

This is a strange error. It shouldn't matter if you create Router with hashHistory or browserHistory. Are you using react-router@3.0.0 or some other version? Because the Sidebar components depend on react-router@3.0.0-alpha.3 and up and not react-router@4.x or react-router@2.x.

Great news for the rubix charts, I'll use that based on the demo examples.

As for the react-router error, I'm currently using react-router@3.0.0 (a newer one but it shouldn't have breaking changes). I googled the error and it seems It shouldn't appear anymore. I don't really know where to look for, maybe creating a react-router github issue.

This is because we make use of React-Bootstrap instead of jQuery Bootstrap. Controlling a tab is easy. Just use the activeKey prop to change the tab. It is documented here: http://rubix-docs.sketchpixy.com/tabs#tabs-props-area

I am trying to use your Datatablesjs.js example. When I populate the datatable with data, the data table shows with the length, filter, info and paginate control. They all seem to be disconnected from the data that is displayed in the table. The filter does not work, last line of data table says no data available in table even though there are rows, the info says showing 0 to 0 of 0 entries. The class name on my datatable is set to dataTables_wrapper. I must be missing something else. What typically causes this issue?

The problem is that many pages would have the header and footer (but not the sidebar), so I don't want to repeat the code inside each page. So, I try to do that in routes.js file. The problem with that solution is that the body has margin-left 250px, and when I try to set margin to 0px an animation happens, as if it is a slide effect, which I find it disturbing.So I'm asking for the proper way to get the job done

Could you provide guidance on how to implement Apollo (React/Redux)? I read that you have plan for this in upcoming releases. For now, can you point me to the right direction? I think since everything is tucked inside rubix/lib/node/redux-router.js, is confusing me. I am following this http://dev.apollodata.com/react/redux.html to enable server-side render with no success. Please help.

We have 3 Apollo integration betas ready (Apollo + GraphQL, Apollo + Auth0 + GraphQL and Apollo + Auth0 + Graph.Cool). Can you please contact us on support@sketchpixy.com so we can share the integrations and get your feedback?

Just getting started with your theme, experimenting a little so I can find my way around things. (Meteor React). I've done the Todo tutorial and have moved on to some styling. Before I started though, I thought I would see what the theme looks like on my iPhone and discovered that it doesn't seem to work.

I've tried both Safari and Chrome on my iPhone, and all I get is a blank page. Your live demo works on the phone (although when using a phone, the sidebar doesn't collapse. It does if you emulate an iphone 6 on Chrome on the desktop). So I was wondering if there's something I'm missing.

Also, I can see myself wanting to find answers to questions other people have asked, but this discussion doesn't seem to be searchable so it would be difficult to do - is there a support forum/community somewhere?

> Just getting started with your theme, experimenting a little so I can find my way around things. (Meteor React). I've done the Todo tutorial and have moved on to some styling. Before I started though, I thought I would see what the theme looks like on my iPhone and discovered that it doesn't seem to work.

This is happening because we use Webpack dev server to host the static files and is loaded via localhost. When you try accessing the development site on your mobile device from an external IP requests to localhost will fail. To fix this, please open the webpack.json file in your meteor-seed project and edit the devServer.host field to include the external IP you are accessing from. This should load assets correctly.

> Also, I can see myself wanting to find answers to questions other people have asked, but this discussion doesn't seem to be searchable so it would be difficult to do - is there a support forum/community somewhere?

You are right. We don't have one yet. But we do plan to create a discourse forum soon.

I've spent a few hours struggling with this theme now, but I think I've just hit a show-stopper. I'm using Meteor and started coding up some user sign-up logic. The problem is that as soon as I add in Meteor's account-password and accounts-base packages, the code fails to build due to bcrypt throwing its toys out of the pram. Any ideas?

This seems to be a known bug with Meteor. Until Meteor moves all it's core packages to completely use NPM I think these problems will persist.

Supposedly you need to install bcrypt first like so:

$ meteor add npm-bcrypt@0.8.7

and then:

$ meteor add accounts-ui accounts-password

I know this doesn't make sense. But for some reason, accounts-password package force installs an older npm-bcrypt (0.7.7) which doesn't work with Node 4.x that ships with Meteor 1.4. This issue is discussed at length here: https://github.com/meteor/meteor/issues/7469

Hi, we recently purchased Rubix 4.1.0 and are using it with Meteor JS.We found 2 issues that we need your help with:1. Every change takes a lot of time to refresh!2. Its very hard to debug! Seems like ALL files including my own Javascript files are processed with Webpack and most of the lines in the code can not be debugged

Can you please explain why do I need Webpack in Meteor environment?Can you please help me resolve the above issues?

> 1. Every change takes a lot of time to refresh!> 2. Its very hard to debug! Seems like ALL files including my own Javascript files are processed with Webpack and most of the lines in the code can not be debugged

> Can you please explain why do I need Webpack in Meteor environment? Can you please help me resolve the above issues?

You are right. It takes longer because we provide support for server-side rendering too. This means double the time spent in compilation (one for client and one for the server).

If you are not particular about server-side rendering we can come up with a simplified starter-kit that will solve your issues. Just drop us a mail at support@sketchpixy.com along with your purchase License ID and we'll prepare a kit and send you the file.

The Modal component has an onEntered property. You can use it's callback to disable the scroll in the original window sidebar. Then re-enable the scroll in the onHide callback. Something like this pseudo-code should do the trick (assuming it is the <body> element that has the scroll bar):

Is it possible to include a MultiSelect box in the ui-elements? Every one I try to add has some issue which I am unable to resolve. react-select doesn't actually select the options selected and react-bootstrap-multiselect has an error with jQuery which I'm unable to resolve.

I will test out a fix suggested from the react-select team. react-bootstrap-multiselect appears to have an issue confirmed by the developer which appears to be related: https://github.com/skratchdot/react-bootstrap-multiselect/issues/59

I am trying to "select2" plugin..but its not working as expected. JS file imported in plugins.js and css in main.scss. I checked demo there also multiple select in form controls is just showing options not able to select and show selected items in the text box as select2 does.Please assist on this.