Sound’s great and thanks for purchasing anyway

Thanks ilhammeidi, one more doubt i had was i am using the demo dashboard set-up and if user is not logged in i want to show the login page only, how can i achieve that ?

Hi vaquitachpi,

For restriction page that need user auth this template already provide auth wrapper http://enlite.ux-maestro.com/login-firebase?next=/app/pages/authenticated-page And here’s the code you find in app/containers/Session/withAuthorizationRouter.js

Hope this can help. Feel free if you have any further queries.

Regards.

Hi joseponceleon,

Thanks for visiting our portfolio.

To work with this template you need to have knowledge about react.js, redux.js and redux-saga.

Regards.

what percentage of domain in both do you recommend having between 0% to 100%? and… can I used Firebase to Backend?

Hi balakanna,

Thanks for purchasing.

This issue came because of sass-loader v8 (latest). You can remove some deprecated options in internals/webpack/webpack.base.babel.js

- remove options of css-loader => line:76 localIdentName: '[local]__[hash:base64:5]'

- remove options of sass-loader => line: 88 outputStyle: 'expanded',

Here’s the complete file: https://gist.github.com/ilhammeidi/a4384c32c2c77c8287610102822f5f23

We will fix this template on next update. Feel free if you have any further queries.

Regards.

Thank you, After changing it. I faced this error – https://prnt.sc/rj113u

Hi balakanna,

First for the ionicons error, please do not update to the last version. Because that’s not support for string props. Please use v1.2.6 or you can use ionicons with font icon https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css and here’s the usage https://ionicons.com/v2/cheatsheet.html

Second one about react-intl. This template use react-boilerplate, and the latest version still use react-intl v2.8. Since the migration to react-intl v4 is quite complex, we will wait official updates from react-boilerplate before update Enlite Prime. So you can keep to use react-intl v2.8. FYI: here’s the guide migration https://github.com/formatjs/react-intl/blob/master/docs/Upgrade-Guide.md#migrate-to-using-native-intl-apis

Hope this can help.

Regards.

Hi jorgito_ml,

Thanks for purchasing.

This template use React Boilerplate. Here’s the guide for heroku deployment https://github.com/react-boilerplate/react-boilerplate/blob/master/docs/general/deployment.md#heroku

Hope this can help and feel free if you have any further queries.

Regards.

Hi rbarcellos,

Thanks for purchasing.

We use react-boilerplate to build this template. And about redux-persist we haven’t try it before. And we got a discussion how to integrate it with react-boilerplate https://github.com/react-boilerplate/react-boilerplate/issues/2294

And here’s the sample source https://github.com/hendrathings/react-boilerplate-redux-persist-sample.

For reactotron, regarding the official docs https://github.com/infinitered/reactotron/blob/master/docs/quick-start-react-js.md You can try to put the external ReactotronConfig in /server/index.js or internal confit in /app/app.js

Feel free if you have any further queries.

Regards.

Hi rbarcellos,

Thanks for purchasing.

We use react-boilerplate to build this template. And about redux-persist we haven’t try it before. And we got a discussion how to integrate it with react-boilerplate https://github.com/react-boilerplate/react-boilerplate/issues/2294

And here’s the sample source https://github.com/hendrathings/react-boilerplate-redux-persist-sample.

For reactotron, regarding the official docs https://github.com/infinitered/reactotron/blob/master/docs/quick-start-react-js.md You can try to put the external ReactotronConfig in /server/index.js or internal confit in /app/app.js

Feel free if you have any further queries.

Regards.

Follow the steps: https://github.com/hendrathings/react-boilerplate-redux-persist-sample.

and it didn’t work for me. Can you please test and check if it runs on the latest version of the template?

Hi simon-sc,

Thanks for visiting our portfolio. Unfortunately this template don’t have pricing table. But we have another template Dandelion Pro that have it http://dandelion.ux-maestro.com/app/pages/pricing

Regards.

Hi pareshkapuriya17,

Thanks for purchasing.

In the tamplee is use firebase for api. Here’s a guide to use custom api https://medium.com/@lavitr01051977/make-your-first-call-to-api-using-redux-saga-15aa995df5b6

Regards.

Hi BrahmrshiRaval,

Thanks for purchasing and the appreciation.

About the typescript we haven’t try typescript, but in material-ui https://material-ui.com/ use typescript as well. And also jsx and typescript quite similiar. So it should be no critical issue.

Feel free if you have any further queries.

Regards.

Hi littlejack001,

Thanks for purchasing.

Please make sure to test the page link, by direct access on browser address bar, then put the link in menu /app/api/ui/menu.js. The routing structure already in docs https://ilhammeidi.github.io/dandelion-docs/#code_basic in Template Architecture > slide-4.

Feel free if you have any further queries.

Regards.

Hi cid5420,

Thanks for purchasing.

For production deployment, you can follow the documentation https://ilhammeidi.github.io/enlite-docs/#deploy

The production files will be stored in build/ folder, but also please include all folders in your server too. Because the spinner, favicon and images are inside public/ folder.

And for the routing you can trace by check on the diagram https://ilhammeidi.github.io/enlite-docs/#create_page > Routing Architecture

Feel free if you have any further queries.

Regards.

Hallo donnyfauzan,

Terimakasih telah berkunjung ke portofolio kami.

Unutk Enlite Prime tidak menggunakan react hooks. Termplate ini menggunakan Classes

Salam.

Ok thanks infonya. Sukses gan jualannya

Ok sama2

Hi fbenevides,

Those label are got from dynamic data. So the translation cannot handle this. The translation so far just for static text or data.

Regards.

Hi fbenevides,

The build folder is default from react-boilerplate and cannot be modified. For alternative way you can use CDN to store the assets or by using console script https://shapeshed.com/unix-mv/ to move assets.

Regards.

Its possible to use webpack to do this ?

Hi fbenevides,

We just found the webpack plugin to do this https://github.com/webpack-contrib/copy-webpack-plugin You implement that in /internals/webpack/webpack.prod.babel.js

Regards.

Hi Aeternus185,

The enl- prefix is use for alias path to avoid relative path. Here’s the directory alias list https://ilhammeidi.github.io/enlite-docs/#code_basic > Directory Alias

You can find directory alias settings in /internals/webpack/webpack.base.babel.js

Feel free if you have any further queries.

Regards.

I managed to make the message block appear but when it’s success (green color) it still shows it in error (red color) and besides it doesn’t show me what authSaga returns in authReducer, I’m sending this in

authSaga : yield put(createUserSuccessMysql(credential));

authReducer: case CREATE_USER_SUCCESS_MYSQL: return { ...state, loading: false, message: action.success.message };

Hi Aeternus185,

You need to set the variant=”success” props for MessagesForm component

<MessagesForm
                variant="success" 
                className={classes.msgUser}
                message={messagesAuth}
                onClose={closeMsg}
              />

For authSaga it’s probably issue from API backend then saga throw to error. so please check in both success and failure actions in authSagas.js

function* createUserSaga({ credential }) {
  try {
    yield call(firebaseDb.create, 'user', {
      email: credential.email,
      displayName: credential.displayName,
      creationTime: credential.metadata.creationTime,
    });
    console.log(credential)
    yield put(createUserSuccess(credential));
  } catch (error) {
    yield put(createUserFailure(error));
    console.log(error)
  }
}

Hope this can help.

Regards.

Hi fbenevides,

You can remove the id parameter or specific url parameter by create a function https://stackoverflow.com/questions/16941104/remove-a-parameter-to-the-url-with-javascript

function removeParam(key, sourceURL) {
    var rtn = sourceURL.split("?")[0],
        param,
        params_arr = [],
        queryString = (sourceURL.indexOf("?") !== -1) ? sourceURL.split("?")[1] : "";
    if (queryString !== "") {
        params_arr = queryString.split("&");
        for (var i = params_arr.length - 1; i >= 0; i -= 1) {
            param = params_arr[i].split("=")[0];
            if (param === key) {
                params_arr.splice(i, 1);
            }
        }
        rtn = rtn + "?" + params_arr.join("&");
    }
    return rtn;
}

const originalURL = "http://yourewebsite.com?id=10&color_id=1";
const alteredURL = removeParam("color_id", originalURL);

Hope this can help.

Regards

Hi Aeternus185,

Sorry for yesterday, i was though you bought Dandelion Pro. So for Enlite Prime:

"@types/googlemaps": "^3.38.1",
"draft-js": "^0.10.5",
    "draft-js-inline-toolbar-plugin": "^3.0.0",
    "draft-js-plugins-editor": "^2.1.1",
    "draftjs-to-html": "^0.8.3",
    "draftjs-to-markdown": "^0.5.1",
"prismjs": "^1.11.0",
"firebase": "^7.5.0",
    "react-calendar": "^2.17.4",
    "react-clock": "^2.3.0",
    "react-countup": "^3.0.3",
"react-draft-wysiwyg": "^1.12.13",
"react-google-maps": "^9.4.5",
    "react-scrollspy": "^3.3.5",
    "react-select": "^3.0.4",
    "react-slick": "^0.23.1",
    "react-syntax-highlighter": "^7.0.0",
"redux-saga-firebase": "^0.15.0",
"sinon": "^7.3.2",
 "slick-carousel": "^1.8.1",

"chai": "^4.2.0",
"coveralls": "3.0.2",
"enzyme": "3.7.0",
    "enzyme-adapter-react-16": "1.6.0",
    "enzyme-to-json": "3.3.4",

And yes the rest are necessary for UI, Form and Application base.

Regards.

Hi fbenevides,

In this case in columns state > column-name > options please add filter: false and viewColumns: false like this bellow

columns: [
      {
        name: 'Name',
        options: {
          filter: false,
          viewColumns: false
        }
      },
      {
        name: 'Title',
        options: {
          filter: false,
          viewColumns: false
        }
      },
      {
        name: 'KPI',
        options: {
          filter: false,
          viewColumns: false
          )
        }
      },

You can see example hide filter in http://enlite.ux-maestro.com/app/tables/data-table those demo has 5 columns and 4 filters, we hide filter for KPI column. Here’s all options for mui-datatable https://github.com/gregnb/mui-datatables

Feel free if you have any further queries.

Regards.

Hi fbenevides,

Is there any errors show about that? Because by default there’s no connection between dark theme and data table.

Regards.

Hi Aeternus185,

Thanks for purchasing.

To integrate with php laravel we suggest to use laravel as API in separated server and react.js as front-end side. Here’s the article to support you

part: 1 https://code.tutsplus.com/tutorials/build-a-react-app-with-laravel-restful-backend-part-1-laravel-5-api--cms-29442

paert: 2 https://code.tutsplus.com/tutorials/build-a-react-app-with-laravel-backend-part-2-react--cms-29443

About css, the main styling in this template is use JSS, the css files only use in additional 3rd party plugins. But you still can import and use css in components.

Then about firebase, we provide 2 kind sample apps and pages (app/containers/SampleFullstackApps/ and /app/containers/Pages/UsersFullstack/) with firebase and static. You can take out firebase config if not needed.

- app/firebase/
- utils/saga
- /app/redux/configureStore.js

Feel free if you have any further queries.

Regards

well, I’m configuring a project in laravel in backend and react in frontend but using the console npm install @material-ui/core, @material-ui/icons, @material-ui/lab, @material-ui/pickers and I’m trying to include the pages with the styles I want from this template but it doesn’t work.

Hi Aeternus185,

Please try to use npm install only to install all the dependencies. You can use starter-project with minimal components.

Optional: After the default installation work properly you try to remove additional plugins (listed bellow). This action actually not necessary, because as long as the dependencies not imported, so there are won’t affected

"@types/googlemaps": "^3.38.1",
"draft-js": "^0.10.5",
    "draft-js-inline-toolbar-plugin": "^3.0.0",
    "draft-js-plugins-editor": "^2.1.1",
    "draftjs-to-html": "^0.8.3",
    "draftjs-to-markdown": "^0.5.1",
"prismjs": "^1.11.0",
"react-animated-slider": "^1.1.2",
"react-to-print": "^2.0.0-alpha-4",
"react-big-calendar": "^0.19.1",
    "react-calendar": "^2.17.4",
    "react-chartjs-2": "^2.7.4",
    "react-charts": "^1.0.10",
    "react-clock": "^2.3.0",
    "react-countup": "^3.0.3",
"react-draft-wysiwyg": "^1.12.13",
"react-google-maps": "^9.4.5",
"react-scroll-parallax": "^1.3.5",
    "react-scrollspy": "^3.3.5",
    "react-select": "^3.0.4",
    "react-slick": "^0.23.1",
"react-swipeable-views": "^0.12.13",
    "react-syntax-highlighter": "^7.0.0",
 "slick-carousel": "^1.8.1",

Hope this can help.

Regards.