Discussion on Gogo - Vite React Admin Dashboard (React 19)

Discussion on Gogo - Vite React Admin Dashboard (React 19)

Cart 3,527 sales
Recently Updated
Well Documented

ColoredStrategies supports this item

Supported

This author's response time can be up to 5 business days.

684 comments found.

hi. I purchased the support package. but doesn’t support customization?

Hi. I’m getting this error trying to start the start package:

webpack-dev-server --mode development --hot --progress --open --port 3002 98% after emitting SizeLimitsPlugin ERROR Failed to compile with 1 errors 4:15:16 PM error in ./src/index.js Syntax Error: SyntaxError: Unexpected token (9:6) 7 | const MainApp = require('./App').default; 8 | ReactDOM.render( > 9 | <MainApp />, | ^ 10 | rootEl 11 | ); 12 | }; @ multi (webpack)-dev-server/client?http://localhost:3002 (webpack)/hot/dev-server.js babel-polyfill react-hot-loader/patch ./src/index.js

And this error when I try to run the complete one:

> webpack-dev-server --mode development --hot --progress --open 98% after emitting SizeLimitsPlugin ERROR Failed to compile with 1 errors 4:21:29 PM error in ./src/index.js Syntax Error: SyntaxError: Unexpected token (18:14) 16 | 17 | let render = () => { > 18 | const css = import('./assets/css/sass/themes/gogo.' + color + '.scss').then(x => { | ^ 19 | const MainApp = require('./App').default; 20 | 21 | ReactDOM.render( @ multi (webpack)-dev-server/client?http://localhost:3000 (webpack)/hot/dev-server.js babel-polyfill react-hot-loader/patch ./src/index.js

I need you help. Thanks!

Hi. Yes, Gogo version is 1.0.2. I downgraded my node version to 8.9.0 and I’m getting the same error. I think this is a babel problem, but I’m getting this error only starting Gogo.

Hi,

You are the first one getting this error or maybe someone had the error but found the solution. We are not able to recreate it so we will not be able to provide a solid solution. You may have a refund if you like.

Regards.

Hi,

One of our users had this exact problem and he managed to find the source of it.

In his case, it is about files which start with a dot being hidden by his os and failing to copy them.

In project directory there should be a ”.babelrc” and ”.eslintrc” files and the problem occurs when ”.babelrc” file is missing. Maybe you should also check it when you have time.

Regards.

Hi, I would like to ask you for an explanation of how to remove the authentication from the complete version (no the start one).

Thanks a lot! Shai

Hi Shai,

Thanks for your purchase.

As for the question, here is where the authentication check is made and how to remove it.

src/containers/App.js

This file checks authentication and makes redirection accordingly.

You should change following block with next one.

const InitialPath = ({ component: Component, ...rest, authUser }) =>
    <Route
        {...rest}
        render={props =>
            authUser
                ? <Component {...props} />
                : <Redirect
                    to={{
                        pathname: '/login',
                        state: { from: props.location }
                    }}
                /> }
    />;
const InitialPath = ({ component: Component, ...rest, authUser }) =>
    <Route
        {...rest}
        render={props => <Component {...props} />}
    />;

Regards.

Hi there,

I bought your react theme “gogo react bootstrap 4 admin”, but it doesn’t load in internet explorer.

This is needed for my client. Is it possible to receive a refund?

Note: Although I have noticed that on the item page it says compatible browsers and internet explorer was not included. But I did not see it at first and thought this was standard. So the fault is on my side…

Thank you,

Aidan

Hi Aidan,

We gladly accept refunds if the problem is with our item or description but we stopped accepting refunds for buyer faults since we felt it was being abused.

If you have not donwloaded the item, we are obligated to accept your request.

We expect you to understand us as a fellow author.

Regards.

Hello Team,

Can you show me an example how can I add a new language in the template.

I need to add a German language.

I have already added It into a /locales/de_CH.js, included it in entries folder and finally in index.js in the lang folder, but still doesn’t work.

Thank you.

Hello,

You have done the most of the job. Here is what we think is missing.

src > redux > settings  > reducer.js
In this file initial state of language is set.
const INIT_STATE = {
    locale: {
        languageId: 'english',
        locale: 'en',
        name: 'English',
        icon: 'en'
    }
};

On your switch you should use redux to update this.

locale: {
        languageId: 'german',
        locale: 'de',
        name: 'German',
        icon: 'de-icon' //burası şu an kullanılmıyor. ileriye dönük raw language switcher için tutuluyor.
}

We will add this feature in next update and we think it will be available start of the next week.

Regards.

Hi,

Multilanguage option is available with the new release. http://gogo-react.crealeaf.com

Regards.

Hello again! Could you tell me what changes I should make to the `webpack.config` file so that the `dist` directory that is generated doesn’t get removed when I run `npm start`, the next time?

I understand that removing the old build makes sense when running `npm run build` but I’d like my old build to remain once I run `npm run start`.

Thanks!

Hello,

We must admit that we are not really experts on this particular area, we can offer a solution but be warned that it may cause problems. Please test some builds with making changes to the source.

- Create a variable just under cleanOptison

let cleanOptionsDev = {
    root: __dirname,
    verbose: false, // Write logs to console.
    dry: true
}


-Change the following line with conditioned one.

new CleanWebpackPlugin(pathsToClean, cleanOptions),

new CleanWebpackPlugin(pathsToClean, process.env.NODE_ENV === 'production' ? cleanOptions : cleanOptionsDev),


Idea here is to send CleanWebpackPlugin different settings base on the build type. If you have any problems, let us know

Regards.

Hello, I saw the example to purchase this project. Is there documentation for this project? I want it to run first in my local area.

Hi,

Sorry to hear that. Is Theme Forest available or is it also requires a vpn? I am asking out of curiosity.

As for the questions, we provided Firebase as an easy starting point. It does not require any server side knowledge and provides backend connection via Rest Api. It is called serverless development. Maybe you have an alternative in your country.

Going back to the topic, as i explained earlier we are using it in src>redux>auth>saga.js file with an import { auth } from ’../../firebase’

These are the methods make Firebase api calls. auth.signInWithEmailAndPassword(), auth.createUserWithEmailAndPassword(), auth.signOut()

We also provided a project called “Gogo-React-Start” which does not include Firebase at all. It is also an empty project that contains only necessary dependencies. You may start from this project and implement your own backend solution from scratch.

Regards.

Hello, I am thinking of some ideas, whether you can add a friend through chat tools or emails to get in touch with you. Some are inconvenient to disclose content.

Hello,

You may use our contact form on profile page. It’s on right bottom side. Then we can continue over email. https://themeforest.net/user/coloredstrategies

Regards.

Hi there!

Thank you for the theme. I have an issue with implementing a parent menu item without a submenu. The documentation for adding a menu item states this,

Under Nav tag you should add new NavItem which is named new-main-menu-single as an example.
<NavItem className={classnames({ "active": this.state.selectedParentMenu == 'new-main-menu-single' })}>
    <NavLink to="/app/new-main-menu-single" onClick={(e) => this.openSubMenu(e, 'new-main-menu-single')}>
        <i classname="simple-icon-control-play" /> 
        <IntlMessages id="menu.new-main-menu-single" />
    </NavLink>
</NavItem>

But if I go to a submenu item route and then try to navigate back to a single item parent route, it still stays on the same route without changing. I tried removing the onClick={(e) => this.openSubMenu(e, 'new-main-menu-single')} line and the navigation works but then the highlighting of the parent menu item along with closing the previously opened submenu doesn’t happen.

Also when adding an only parent item, it doesn’t get highlighted by default.

Any idea how to get these to work? Thanks!

Hello,

Thanks for your patience. We have come up with a solution. Here is what needs to be done.

1. Default menu type should be changed. It is causing a bug and we think that it is not good ux when any of the main menu items don’t have a submenu. On file src > constants > defaultValues.js you should change defaultMenuType variable.

export const defaultMenuType = 'menu-sub-hidden'; 



2. NavItem for a menu item without submenu should be like this
<NavItem  className={classnames({    active: this.state.selectedParentMenu == "main-menu-single1"})}>
  <NavLink to="/app/main-menu-single1" data-flag="main-menu-single1">
    <i classname="icon-main-menu-single1" /><IntlMessages id="menu.main-menu-single1" />
  </NavLink>
</NavItem>



3. This is a fix where setSelectedLiActive function should be changed. src > containers > Sidebar > index.js (line 145)

setSelectedLiActive() {
    const oldli = document.querySelector(".sub-menu  li.active");
    if (oldli != null) {
      oldli.classList.remove("active");
    }

    /* set selected parent menu */
    const selectedlink = document.querySelector(".sub-menu  a.active");
    if (selectedlink != null) {
      selectedlink.parentElement.classList.add("active");
      this.setState({
        selectedParentMenu: selectedlink.parentElement.parentElement.getAttribute(
          "data-parent" 
        )
      });
    }else{
      var selectedParentNoSubItem = document.querySelector(".main-menu  li a.active");
      if(selectedParentNoSubItem!=null){
        this.setState({
          selectedParentMenu: selectedParentNoSubItem.getAttribute(
            "data-flag" 
          )
        });
      }else if (this.state.selectedParentMenu == "") {
        this.setState({
          selectedParentMenu: "dashboards" 
        });
      }

    } 
}



After applying these fixes problem should be solved. If you have any problem with implementation or it does not work as expected, please let us know.

Perfect! Exactly what I was looking for. Thank you. Hope you update the documentation and add this for the next release. Keep up the good work :)

Note: There is a typo in the documentation for the routes section -

If your page does not need to be under a here is what needs to be done at src/containers/Sidebar/index.js file

Hi,

That is great!

We are currently working on some new features and codebase is a little bit complicated so it may take some time for this to be released. But thanks to you we know the fix if anyone experiences it.

Also thanks for the typo warning, i will fix that swiftly.

Happy coding :)

how do i add a second submenu?

You already got the sources? Did you mean the landing page? This one: http://gogo-react-web.crealeaf.com/

i purchased it some weeks ago, and i really like it.

and once again i should have read the documentation more carefully…I started with the “Gogo-React-Start-With-Auth” and I thought it is the full package with some addons (may because it has the longest name :-)

Now i realized the difference and had a look at “Gogo-React”...Problem solved.

Glad that you have sorted it out. Happy coding:)

This two changes in package.json

“webpack”: “4.20.2”,

“webpack-cli”: “3.1.1”,

solved the “Cannot read property ‘properties’ of undefined at module.exports”-issue for me.

Hello,

Thank you for the contribution. Taking your time to share this is really meaningful.

Some of the users have experienced this issue and we also managed to replicate it on a Mac. We provided the solution via comments but will correct this on the next update.

Regards.

Excellent work. Any plan to come-up with Angular 6 ?

Hello,

Thanks for the nice comment.

Our priority is developing this further with updates and then a Vue version. This will take a while and after that we will think about Angular.

Regards.

Hello,

It’s been a while but just wanted to let you know that Angular version of the template is finally available.
https://themeforest.net/item/vien-angular-admin-template/25817698

Cheers.

Hello, Congratulations on great design!!

I have following questions about your app. Appreciate your answers.

1) Is there firebase signin and signup? with Google+, facebook etc 2) Does it have Search feature? 3) Does it have example components with restapi data from external source?

4) We will are planning to use it as front end with firebaseUI sign up and pretty much open to the world to register and login. Do we need extra license for that?

Hello,

Thanks for your nice comment and interest.

Here are the answers.

1. There is only Firebase login which we added as a basic starting point.

2. We have not implemented any server side code. Our priority was to provide frontend as good as we could. So there is not a search function.

3. We have not used any external data source. Some components get their data from a static local json file with a basic import.

4. I am not an expert but i think it depends on what your users will do with it. If you sell concert tickets with it, that is a regular license but if you sell it as an accounting application that might need an extended license since it is a saas(software as a service) Please check the license pages for more information. https://themeforest.net/licenses/terms/regular

Regards.

Hello, i just bought this awesome template. Crongatulations! But I realized that I bouhght the wrong one. My intention was to buy the HTML version and not the React version. Can you send me the correct version, please? The version I bought is 4 dollars more expensive but this is not a problem ok? Just send me the HTML version and everuthing will be fine. Thank you one more time.

Hi, I just bought the correct one! Can you proceed with the refund of the React version, please? Thank you so much for understading and sorry for the inconvenience.

Hi Mikera,

We answered your request.

Regards.

Hi, Is it possible to create a horizontal menu or a landing page example? Regards,

Hi,

We are planning to include a landing page after next update. Next one is currently on development and after that we will be working for the landing page. It should be available approximately in 2 weeks.

There is not a horizontal menu implementation and we are not planning to add one.

Regards.

Hi,

Landing page is available if you are still interested.

You may check it under Landing Page menu item: http://gogo-react.crealeaf.com/

Regards.

Hai, Im beginner to react. As per the instruction after Installing the NPM modules if I run npm start. Im facing below error please tell me how to rectify this..

> gogo-react@1.0.1 start /Users/shreyasarun/Downloads/Gogo-React-Admin-Dashboard-1.0.1/Source/Gogo-React > webpack-dev-server—mode development—hot—progress—open

/Users/shreyasarun/Downloads/Gogo-React-Admin-Dashboard-1.0.1/Source/Gogo-React/node_modules/webpack-cli/bin/config-yargs.js:89 describe: optionsSchema.definitions.output.properties.path.description, ^

TypeError: Cannot read property ‘properties’ of undefined at module.exports (/Users/shreyasarun/Downloads/Gogo-React-Admin-Dashboard-1.0.1/Source/Gogo-React/node_modules/webpack-cli/bin/config-yargs.js:89:48) at Object.<anonymous> (/Users/shreyasarun/Downloads/Gogo-React-Admin-Dashboard-1.0.1/Source/Gogo-React/node_modules/webpack-dev-server/bin/webpack-dev-server.js:84:40) at Module._compile (internal/modules/cjs/loader.js:689:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10) at Module.load (internal/modules/cjs/loader.js:599:32) at tryModuleLoad (internal/modules/cjs/loader.js:538:12) at Function.Module._load (internal/modules/cjs/loader.js:530:3) at Function.Module.runMain (internal/modules/cjs/loader.js:742:12) at startup (internal/bootstrap/node.js:279:19) at bootstrapNodeJSCore (internal/bootstrap/node.js:752:3) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! gogo-react@1.0.1 start: `webpack-dev-server—mode development—hot—progress—open` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the gogo-react@1.0.1 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! /Users/shreyasarun/.npm/_logs/2018-10-02T15_42_20_799Z-debug.log

Hello,

It seems like the problem is about webpack-cli package. We have not experienced it on Windows. Googling the error quickly pointed us to the solution. For more information you may check here: https://github.com/webpack/webpack/issues/8082

1- To get it working uninstall webpack-cli with following command.
npm uninstall webpack-cli

2- After uninstalling complete install it again with following command. This should install webpack-cli 3.1.2
npm install webpack-cli --save-dev

3- After this, you should be able to use npm start and npm run build.

Regards.

Hi, I want to use the template for one of my client. They will sell online tickets and I will use the template on frontent. Should I buy standart or extended license? Regards, Onur

Hi Onur,

Your project does not require an extended license, standard will do.

Regards.

Hello, we have purchased two templates: Dore 4c72120a-204b-4175-a0de-a2e973f31609

and

GOGO 622065ae-71c4-44e2-ae64-ca871578387e

Now we have decided to cancel second purchase, because we don’t need reactjs and they are the same , can we cancel purchase GOGO?

Hello,

We have contacted support about your problem and wating for their response.

I must add that saying “they are the same” is not quite fair. We worked really hard on both items and they have really different structures, lifecycles and implementations. They even have different paradigms since one is imperative and other one is declarative.

In fact, it was even harder for us to make them this similar. They have different open source components. For example Dore has Select 2, Data Tables, Full Calendar, Dropzone etc. In response to this Gogo have React Select, React Tables, Big Calendar, Fine Uploader etc. Theming these different libraries with different styles and usage was not an easy task that we could take some code from one and add it to other.

Regards.

Hi,

We have got a response from support and as the refund policy states that we don’t have to accept refunds on items which user bought by mistake or user changed mind.

Sorry about that.

Regards.

Hi Im facing a problem when I execute the command npm start. this is the error…

Cannot read property ‘properties’ of undefined

Gogo-React-Admin-Dashboard-1.0.1/Source/Gogo-React/node_modules/webpack-cli/bin/config-yargs.js:89:48) at Object.<anonymous> (/Users/juanluisarias/Downloads/Gogo-React-Admin-Dashboard-1.0.1/Source/Gogo-React/node_modules/webpack-dev-server/bin/webpack-dev-server.js:84:40)

Hi,

Another user experienced the issue and we were able to replicate it on a Macbook. Asking for a future update, are you also on a Mac?

Problem is about webpack-cli package, solution is uninstalling and installing again this package via npm.

-------
To get it working uninstall webpack-cli with following command.
npm uninstall webpack-cli

After uninstalling complete install it again with following command. This should install webpack-cli 3.1.2
npm install webpack-cli --save-dev

After this, you should be able to use npm start and npm run build.
Please let us know if that solves the problem.

Regards.

Hi,

Could you please answer this question from my developer who ask if there is a trial, and why he want that? “That we want to see if it is compatible with our frontend as we are not sure about usage of nodejs”

Best regards Timo

Hi Timo,

We can not provide a trial or a light version. It’s an Envato rule.

If your developer has no experience with using and building React code, npm, Nodejs and Redux then we suggest that Gogo is not a good choice for you. Node.js is responsible for loading packages and running the project but React has a very different syntax and lifecycle than regular html/jquery projects.

You might want to use Dore which is a JQuery/HTML version of Gogo. https://themeforest.net/item/dore-jquery-bootstrap-4-admin-dashboard/22604108

Regards.

Hello,

After all proper installation and following the instruction, template is not loading completely. It keep loading for forever.

http://35.154.6.169/t/Gogo-React/public/

Could you tell me where is the problem?

And you should also check and be sure that port 3000 is not in use, you have administration authorization on command line. You might also want to check your log as the error suggests. /Users/krishnakumar/.npm/_logs/2018-09-29T07_57_30_567Z-debug.log

I think some problem with the theme I have done npm install and then npm start. My other applications with react is working absolutely fine. but I am getting error with your template and screenshot is here. Check the circled error related to template. https://ibb.co/fGsMZK

Give me a solution asap.

Hello,

It seems like the problem occurs on some Mac computers and it is about webpack-cli package. We have not experienced it on Windows. Googling the error quickly pointed us to the solution. For more information you may check here: https://github.com/webpack/webpack/issues/8082



To get it working uninstall webpack-cli with following command.
npm uninstall webpack-cli

After uninstalling complete install it again with following command. This should install webpack-cli 3.1.2
npm install webpack-cli --save-dev

After this, you should be able to use npm start and npm run build.

Regards.

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve ThemeForest.

Sure, take me to the survey