Hi,

We will include it again, update the project and get back to you as fast as we can.

Cheers.

Hi,

There are two possible solutions that I can think of.

1. Make sure you have 10.16.3 LTS version of nodejs.

2. Remove package-lock.json file and node_modules and try installing again.

Please let us know if any of them does not solve the problem.

Hi,

The preview is a production build and works as expected: https://gogo-react.coloredstrategies.com

It would be helpful if you provide details about the problem you have. Does build process have problem, or is it on the deployment. Let us know please.

When ı change the BrowserRouter as Router => MemoryRouter as Router in production mode is problem solved but when i use the default code production mode is not opening its showing white screen. i think there is a problem with base url because program cant find any doc.

84.428c36b3.chunk.js:1 DOMException: Failed to execute ‘replaceState’ on ‘History’: A history state object with URL ‘file:///error’ cannot be created in a document with origin ‘null’ and URL ‘file:///Users/brkrtp/Desktop/electron/build/index.html’. at file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:33461 at Object.confirmTransitionTo (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:30861) at Object.replace (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:33370) at t.perform (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:2622) at t.componentDidMount (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:2107) at file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:226427 at t.unstable_runWithPriority (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:247483) at ci (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:172768) at Bs (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:222501) at xs (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:211138) xa @ 84.428c36b3.chunk.js:1 84.428c36b3.chunk.js:1 Uncaught DOMException: Failed to execute ‘replaceState’ on ‘History’: A history state object with URL ‘file:///error’ cannot be created in a document with origin ‘null’ and URL ‘file:///Users/brkrtp/Desktop/electron/build/index.html’. at file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:33461 at Object.confirmTransitionTo (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:30861) at Object.replace (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:33370) at t.perform (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:2622) at t.componentDidMount (file:///Users/brkrtp/Desktop/electron/build/static/js/85.00dd2c09.chunk.js:1:2107) at file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:226427 at t.unstable_runWithPriority (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:247483) at ci (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:172768) at Bs (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:222501) at xs (file:///Users/brkrtp/Desktop/electron/build/static/js/84.428c36b3.chunk.js:1:211138)

Hi,

The error screenshot contains paths like file:// and your server trying to reach local files like that might be the issue. You may try “serve” to tell apart if the problem is with prod build or your server configuration. Here is how to install and use it:

One other thing that I think that you might be deploying the build in a folder like http://localhost/gogo-test. This is not recommended way to deploy CRA apps and might need lots of configurations. Using ports and subdomains are the right ways to do.

Let us know if the problem are not related to any of these.

Its okey, its working now (in http://localhost:5000) but where is the build folder?

It should be on build folder at project root.

After the npx serve -s build, build folder index.html its still same error. but localhost:5000 its working

I am a little bit confused about the problem.

You run serve and it serves the build folder at localhost:5000 and it is working fine I guess.

What is it to do with index.html file. You are not trying to use the file directly from file system and run it via browser I suppose?

I open direcly browser, its not working if im open localhost 5000 its working, but ı send to this file hosting, if its direcly not working how its working on hosting

Daaaamn, discount price was 18$ )) Normal is 28… It was not obvious…

If only you could answer earlier, I would buy the template…

Hi,

Unfortunately, this is one solid problem that we don’t have an answer yet.

With the upgrades we are doing some work, fixing bugs here and there and shifting the project like you do. The template is more like an implementation rather than a library so we are not able to provide a simple/auto way to update.

I hope you understand.

Regards.

Alright, thank you for your answer.

One more question, I’ve used you ReactAutosuggest Component and set it’s value to one value in the state, when the state value change, the value which should display on ReactAutosuggest didn’t change either. what should I do?

Here’s my sample code:

<ReactAutosuggest id=”name” value={this.state.inputProduct.name} data = {nameSuggestionData} onChange = {this.handleChangeNameLabelOver} />

then did this

inputProduct.code = codeLabelOver inputProduct.name = nameLabelOver this.setState({ inputProduct: inputProduct }

but the ReactAutosuggest UI still the same didn’t display new value of the state

thank you

ReactAutosuggest component is our implementation for Autosuggest and we have missed the default value part.

You may get it working by updating ReactAutosuggest to respond prop changes by following code. I don’t know the version you have but it should be located here: “src/components/common/ReactAutoSuggest”

Yes, It works

Thank you

You are welcome

Hello,

One more problem from me, I worked on DatePicker when I’ve selected any date the picker was not close like it’s should be. I have to click outside the picker to close it.

How can I do if I want it to close automatically after selecting a date?

Hi,

You may also try it with the parameter to set to true.

I’ve tried set shouldCloseOnSelect={true} but It didn’t work

my DatePicker look like this <DatePicker selected={this.state.date} onChange={this.handleChangeDate} shouldCloseOnSelect={true} placeholderText={this.setState.currentDate} name=”date” />

Hi,

I have added your date picker and it works without a problem.

Please check http://localhost:3000/app/ui/forms/components on your project.

Also problem might be related to lightbox if you use it in a modal.

Yes, I used it in a modal. Do you wanna see my code file?

Hi,

this.props undefined error usally happanes when the method it called is not binded. If your code is in a method named onClick, then you should bind it in the construtor. this.onClick = this.onClick.bind(this);

Let us know if the problem is not about this.

I am already binding it. Here is my full login.js file:

import React, { Component } from “react”; import { Row, Card, CardTitle, Label, Button } from “reactstrap”; import { NavLink } from “react-router-dom”; import { connect } from “react-redux”; import { Formik, Form, Field } from ‘formik’;

import { loginUser } from ”../../redux/actions”; import { Colxx } from ”../../components/common/CustomBootstrap”; import IntlMessages from ”../../helpers/IntlMessages”; import { apiPath } from ”../../constants/defaultValues”; const axios = require(‘axios’);

class Login extends Component { constructor(props) { super(props); this.state = { email: ””, password: ”” }; this.validate = this.validate.bind(this); this.handleSubmit = this.handleSubmit.bind(this); } onUserLogin() { if (this.state.email !== ”” && this.state.password !== ””) { this.props.loginUser(this.state, this.props.history); } } handleSubmit(values) { console.log(values); axios.post(apiPath+’verifyLogin’, values) .then(function (response) { this.setState(values); console.log(this.state); console.log(response.data.success.token); localStorage.setItem(“token”, response.data.success.token); this.props.loginUser(this.state, this.props.history); }.bind(this)) .catch(function (error) { console.log(error); }); } } const mapStateToProps = ({ authUser }) => { const { user, loading } = authUser; return { user, loading }; };

validate(values) {
    let errors = {};
    if (!values.email) {
        errors.email = 'Please enter your email address';
    } else if (!/^[A-Z0-9._%]@[A-Z0-9.]+\.[A-Z]{2,4}$/i.test(values.email)) {
        errors.email = 'Invalid email address';
    }
}

if (!values.password) {
    errors.password = 'Please enter your password';
}
return errors;

render() {
  return (
    <Row className="h-100">
      <Colxx xxs="12" md="10" className="mx-auto my-auto">
        <Card className="auth-card">
           
            
MAGIC IS IN THE DETAILS
            

              Please use your credentials to login.
              

              If you are not a member, please{" "}
              <NavLink to={`/register`} className="white">
                register
              </NavLink>
              .
            
           
           
            <NavLink to={`/`} className="white">
               
            </NavLink>
            <CardTitle className="mb-4">
              <IntlMessages id="user.login-title" />
            </CardTitle>
            <Formik
                              validate={this.validate}
                              initialValues={{
                                  email: '',
                                  password: '',
                              }}
                              onSubmit={this.handleSubmit}>
                              {({ errors, touched, isValidating }) => (
            <Form>
              <Label className="form-group has-float-label mb-4">
              <Field className="form-control" name="email" />
                {errors.email && touched.email &&  {errors.email} }
                <IntlMessages id="user.email" />
              </Label>
              <Label className="form-group has-float-label mb-4">
                <Field className="form-control" name="password" type="password" />
                {errors.password && touched.password &&  {errors.password} }
                <IntlMessages
                  id="user.password" 
                />
              </Label>
               
                <NavLink to={`/forgot-password`}>
                  <IntlMessages id="user.forgot-password-question" />
                </NavLink>
                <Button
                  color="primary" 
                  className="btn-shadow" 
                  size="lg" 
                  type="submit" 
                >
                  <IntlMessages id="user.login-button" />
                </Button>
               
            </Form>
            )}
            </Formik>
           
        </Card>
      </Colxx>
    </Row>
  );
}

export default connect( mapStateToProps, { loginUser } )(Login);

If you are getting the error in handleSubmit function after ajax request in “then”, you might be losing context for “this”. You may check if this is the problem by logging this.props outside and inside of then.

Let us know if the problem is not about this.

Thanks it solved this.props issue. But still it’s not redicted to the dashboard. And how i can use oAuth instead of fire base?

You should check redux part of the project. The file is “src/redux/auth/saga.js”. As you may see, this file has “loginWithEmailPassword” function which is called from “onUserLogin” at login view.

You should include your api call in “loginWithEmailPasswordAsync” function instead of from Firebase’s “auth” method.

You may also update logout and register functions at this file.

Best.

Thanks for the quick solution, but it’s not redirecting to the dashboard. Here is update code in my auth/saga.js file:

import { apiPath } from ”../../constants/defaultValues”; const axios = require(‘axios’);

function loginWithEmailPassword({ payload }) { const { email, password } = payload.user; const { history } = payload; try { axios.post(apiPath+’verifyLogin’, { ‘email’: email, ‘password’: password}) .then((response) => { history.push(’/’); }) .catch(function (error) { console.log(error); }); } catch (error) { console.log(‘login error : ’, error) } }

Please make sure your code works fine and reaches to “then”. “history.push(’/’);” makes the redirect so checking if the history is available also can provide some information.