691 comments found.
Hi, we’re using your template for a piece of software we’re launching. I had a question about your homepage design… https://gogo-vite.crealeaf.com/
We need to create our homepage for this software and your designs are superb. Could we utilise a similar homepage design? Or do you offer homepage design services?
Also – do you offer any UX services if we were to give you access to our software for a UX review? We would like it to look at professional as your templates. Many thanks
Hi,
Thank you, glad to hear you like the template.
The homepage design and code are included in the template. You can use them anyway you like to create yours. We included the homepage in Version 7.5.0. If you have an older version, please download the newest one to access it.
We can work on a freelance contract if you need customization or additional modules for the homepage, and the UX improvements of the application. You can reach us from the contact form in our profile: https://themeforest.net/user/coloredstrategies, or email us at support@crealeaf.com.
All the best.
We purchased an older version of this theme, a version that I think you don’t support anymore now. It is still in active use in our app though. Did you remove the website for this older version at https://gogo-react.coloredstrategies.com/ ? These website links are no longer working. We were using this website as a way to communicate front end components to our developers. Your entire website at coloredstrategies.com seems to not be working right now.
Hi,
We recently updated the template. We also switched to another cloud provider to automate our deployment, so the older website became an extra cost for us. All in all, as you notice, it is no longer in use.
I tried the older version to see if I could help you anyway. After downgrading Node(16.3.0) and NPM , it runs and builds. I can send you both the sources and the build version so you might deploy somewhere and continue using it.
There is one issue that I don’t have a quick solution. We had an API to fill our listing pages, and we no longer have access to it. So, a few listing pages are not working. It can be solved by replacing the API with static JSON. There are 4 pages affected by it.
If you are interested, please email us at support@crealeaf.com so I can send you the files.
Cheers.
Hello there,
I received the following message: “MUI X: Invalid license key”. Is this not included in the Gogo Vite license?
Hi,
MUI comes with lots of components in its free plan and you don’t need a subscription to use them. You might check out the features on their pricing page and if you don’t use those premium features, for example, you might make the data-grid work with the import { DataGrid } from ”@mui/x-data-grid”; And you can remove the line starts with “LicenseInfo.setLicenseKey”.
The other components of MUI-X are mostly available for the Free tier as well. Here is the page to check the features: https://mui.com/pricing/
hey there, the set verification page has some problem for OTP code its not automatically goes for the next one and also it applies for deleting, please fix it
Hi,
Yeap, will look into it. Thanks!
Hi,
We found a library that works well with MUI and included it. We will publish an update but here is how it works in case you don’t want to wait for it.
npm install mui-one-time-password-input
import { MuiOtpInput } from "mui-one-time-password-input";
import { FormEvent, useState } from "react";
import { Link, useNavigate } from "react-router-dom";
import { Box, Button, Divider, FormLabel, Paper, Typography } from "@mui/material";
import Logo from "@/components/logo/logo";
export default function Page() {
const navigate = useNavigate();
const handleSubmit = (event: FormEvent) => {
event.preventDefault();
navigate("/");
};
const [otp, setOtp] = useState("");
const handleChange = (newValue: string) => {
setOtp(newValue);
};
return (
<Box className="bg-waves flex min-h-screen w-full items-center justify-center bg-cover bg-center p-4">
<Paper elevation={3} className="bg-background-paper shadow-darker-xs w-lg max-w-full rounded-4xl py-14">
<Box className="flex flex-col gap-4 px-8 sm:px-14">
<Box className="flex flex-col">
<Box className="mb-14 flex justify-center">
<Logo classNameMobile="hidden" />
</Box>
<Box className="flex flex-col gap-10">
<Box className="flex flex-col">
<Typography variant="h1" component="h1" className="mb-2">
Verification
</Typography>
<Typography variant="body1" className="text-text-primary">
Please enter your 6 digit code that sent to your email address.
</Typography>
</Box>
<Box className="flex flex-col gap-5">
<Box component={"form"} onSubmit={handleSubmit} className="flex flex-col">
<Box className="flex flex-col">
<FormLabel component="label">Verification Code</FormLabel>
<MuiOtpInput
value={otp}
onChange={handleChange}
length={6}
TextFieldsProps={{ size: "small", variant: "standard", className: "outlined" }}
className="gap-1 md:gap-2"
/>
</Box>
<Box className="flex flex-col gap-2">
<Button type="submit" variant="contained" className="mb-4">
Continue
</Button>
</Box>
<Typography variant="body2" className="text-text-secondary">
By clicking Continue, Sign in with Google, or Sign in with GitHub, you agree to the{" "}
<Link target="_blank" to="/auth/terms-and-conditions" className="link-primary link-underline-hover">
Terms and Conditions
</Link>{" "}
and{" "}
<Link target="_blank" to="/auth/privacy-policy" className="link-primary link-underline-hover">
Privacy Policy
</Link>
.
</Typography>
</Box>
</Box>
<Divider className="text-text-secondary my-0 text-sm"></Divider>
<Box className="flex flex-col">
<Typography variant="h6" component="h6">
Did not get the code?
</Typography>
<Typography variant="body1" className="text-text-secondary">
If you have not received the code, please{" "}
<Link to="/auth/get-verification" className="link-primary link-underline-hover">
resend
</Link>
.
</Typography>
</Box>
</Box>
</Box>
</Box>
</Paper>
</Box>
);
}
That is the whole set-verification page. Here is the part with only the new component:
import { MuiOtpInput } from "mui-one-time-password-input";
const [otp, setOtp] = useState("");
const handleChange = (newValue: string) => {
setOtp(newValue);
};
<MuiOtpInput
value={otp}
onChange={handleChange}
length={6}
TextFieldsProps={{ size: "small", variant: "standard", className: "outlined" }}
className="gap-1 md:gap-2"
/>
Hi, How can I use the MenuType.SingleLayer as default? Even if I changed it in the config.js , it is not showing as a singlelayer just like the admin template.
import { ModeVariant, ThemeVariant } from ”@/constants”; import { ContentType, MenuType } from ”@/types/types”;
export const DEFAULTS = { appRoot: ”/home/sub”, locale: “en”, themeColor: “theme-purple” as ThemeVariant, themeMode: “system” as ModeVariant, contentType: ContentType.Fluid, leftMenuType: MenuType.SingleLayer, leftMenuWidth: { { primary: 60, secondary: 260 }, { primary: 116, secondary: 260 }, { primary: 280, secondary: 0 }, }, transitionDuration: 150, };
Hi,
It must be a caching issue.
Please clean the local storage and try again. You can find it in Chrome Dev Tools under the Application tab and in the Storage tab in Firefox Dev Tools.
You can also use the incognito mode to verify it is cache related.
Cheers.
Hello,
I recently purchased the following React license:
Gogo – Vite React Admin Dashboard (React 19) https://themeforest.net/item/gogo-react-bootstrap-4-admin-dashboard/22544383After an internal review, we have concluded that using Next.js would be more suitable for our project. Therefore, I would like to kindly ask whether it would be possible to exchange the above license for the following product:
Gogo – Nextjs React Admin Dashboard (React 19) https://themeforest.net/item/piaf-vuejs-admin-dashboard/23160320Please let me know if this exchange is possible and if there are any additional steps required from my side.
I would appreciate it if you could reply to this or contact me at sangkyu@horizonai.ai
Thank you very much for your time and assistance.
Kind regards, Sangkyu Kim
Hi,
There is no mechanism to make a license exchange. Here is how we can solve it:
1- Please create a refund request for the one you don’t want here: https://themeforest.net/refund_requests/new It will arrive us and we will approve it.
2- Then, you can buy the one you want.
Cheers.
Hi Support Team,
I recently purchased your theme from ThemeForest. In the FAQ it says that page designs and UI components in Figma are included with a Standard Plus (or above) license and should be part of the project package.
I can’t find the Figma design files anywhere in the download or documentation.
Could you please let me know:
Where the Figma files are located, or
How I can access them if they’re provided separately?
Thanks for your help.
Best regards,
Hi,
Thanks for the purchase.
There should be a file named gogo-vite-design.fig in downloaded zip. The designs are in there and it is required to be dragged on Figma. Here is a frame that explains it: https://www.figma.com/design/IfNcwqMO9Rzh27ClqB6aon/Prod-Gogo-Next-Vite-Design?node-id=9242-153816&t=1WqKW33KZbq3xYOz-4
I will add it to the FAQ section as well.
Hi Support Team,
I recently purchased your theme from ThemeForest. In the FAQ it says that page designs and UI components in Figma are included with a Standard Plus (or above) license and should be part of the project package.
I can’t find the Figma design files anywhere in the download or documentation.
Could you please let me know:
Where the Figma files are located, or
How I can access them if they’re provided separately?
Thanks for your help.
Best regards, Vasko
I would like to know if I can use the Vite Vue instead react Gogo – Vite React Admin Dashboard (React 19)
Hi there,
Thank you for your interest in Gogo.
I don’t think it is a good idea to use Gogo with Vue since Gogo is built on top of the MUI library, which is deeply dependent on React.
All the best.
hi,
import * as React from “react”; import { IMaskInput } from “react-imask”;
import { Card, CardContent, FormLabel } from ”@mui/material”; import FormControl from ”@mui/material/FormControl”; import Input from ”@mui/material/Input”;
interface CustomProps { onChange: (event: { target: { name: string; value: string } }) => void; name: string; }
const TextMaskCustom = React.forwardRef<HTMLInputElement, CustomProps>(function TextMaskCustom(props, ref) { const { onChange, ...other } = props; return ( <IMaskInput {...other} mask=”(#00) 000-0000” definitions={{ ”#”: /[1-9]/, }} inputRef={ref} onAccept={(value: any) => onChange({ target: { name: props.name, value } })} overwrite /> ); });
export default function TextFieldMask() { const [values, setValues] = React.useState({ textmask: ””, }); } Cheers.
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setValues({
...values,
event.target.value,
});
};
return (
<Card>
<CardContent>
<FormControl className="outlined" variant="standard">
<FormLabel component="label">Phone</FormLabel>
<Input
value={values.textmask}
onChange={handleChange}
name="textmask"
inputComponent={TextMaskCustom as any}
placeholder="(000) 000-0000"
/>
</FormControl>
</CardContent>
</Card>
);
I tried, but the problem exists:
I want to show the mobile no with the country code and flag, just like the react-phone-input-2 library. This works great with Bootstrap styling UI, but not compatible with Material UI
Hi,
You can use the “MUI Tel Input plugin”, which works very well with MUI for phone input. It’s quite similar to “react-phone-input-2” and fully compatible with MUI.
https://viclafouch.github.io/mui-tel-input/HI! How are you today! I hope good. I just bought this template, but it is completely different from the Live Preview:
https://gogo-react.coloredstrategies.com/app/dashboards/defaultThis website shows a different template, other than the one bought.
In the Live Preview on the link, I clicked in Docs, then in Buy Now. Then I bought it, but the one boutght seems the following:
https://gogo-vite.crealeaf.com/dashboards/defaultI dont’t know what have happened.
Could you help me?
Thank you in advance.
Hi there,
Doing great and hope you are as well.
The issue you had is strange. The first link you sent is a very old version, and we should have probably redirected it to the new one. Where did you come by it? All the links in the template detail page are directed to the second and up-to-date link you sent, as far as I know. https://themeforest.net/item/gogo-react-bootstrap-4-admin-dashboard/22544383
The new version you have is much better. It is React 19, while the old one is React 17, and 4 years old. One thing the new version does not have is the applications, and we have been working on it for a while, and we are almost ready to publish it. We made 3 applications: AI Chat, AI Content, and Drive. It should be up in a day or two. We also added 3 more dashboard layouts and improved Figma a lot.
We can send you the old one as well, but it is really old, and it will not even build. The designs are in Photoshop if I remember correctly
If you want that, please send us a message via the form on our profile page so we can send a reply with the template link: https://themeforest.net/user/coloredstrategies
Please let us know how you want to proceed.
Cheers.
Hi! I am great as well.
First of all, thank you for you fast response.
I’m impressed by the quality of you work.
I’ve found the old version template in a blog post with several others templates. It was some kind of review of them.
Unfortunately, I couldn’t find the blog post right now. But I remember googling for “react dashboard template gogo” and I’ve found the following link:
https://www.google.com/url?sa=t&source=web&rct=j&opi=89978449&url=https://gogo-react.coloredstrategies.com/&ved=2ahUKEwiC3Oi_qfmQAxUhD7kGHcatAHwQFnoECB8QAQ&usg=AOvVaw0pUNeNPnTROBQF0_uNUri0The link then sent me to the old version. It all happened yesterday (I’m not able to find the blog post because 1) I searched a lot of templates and 2) I used my computer, at home, unaccessible right now.
That said, yes, please, I want that older version. I found it amazing. The current one is amazing as well, but I am interested in getting some features of the old one (I understand I will have to “make it work” on my own).
I will try to send you me message via the form on my profile.
Thank you so much.
Just replied your email with the link.
Thank you for the details and your understanding. We will do the redirecting to prevent any future problems.
Cheers.
Hello Team, there is small update require i think its missing – Mobile Number input with country code component is missing, can you please check
Hi,
You might use the react-imask plugin. Here is a small example with outlined standard input that should also work with other input stylings:
import * as React from "react";
import { IMaskInput } from "react-imask";
import { Card, CardContent, FormLabel } from "@mui/material";
import FormControl from "@mui/material/FormControl";
import Input from "@mui/material/Input";
interface CustomProps {
onChange: (event: { target: { name: string; value: string } }) => void;
name: string;
}
const TextMaskCustom = React.forwardRef<HTMLInputElement, CustomProps>(function TextMaskCustom(props, ref) {
const { onChange, ...other } = props;
return (
<IMaskInput
{...other}
mask="(#00) 000-0000"
definitions={{
"#": /[1-9]/,
}}
inputRef={ref}
onAccept={(value: any) => onChange({ target: { name: props.name, value } })}
overwrite
/>
);
});
export default function TextFieldMask() {
const [values, setValues] = React.useState({
textmask: "",
});
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setValues({
...values,
[event.target.name]: event.target.value,
});
};
return (
<Card>
<CardContent>
<FormControl className="outlined" variant="standard">
<FormLabel component="label">Phone</FormLabel>
<Input
value={values.textmask}
onChange={handleChange}
name="textmask"
inputComponent={TextMaskCustom as any}
placeholder="(000) 000-0000"
/>
</FormControl>
</CardContent>
</Card>
);
}
Cheers.
Thanks for the update let me check 
meanwhile can you help me what should i add in the
@mui/x-data-grid-pro. license key
Hi,
MUI comes with lots of components in its free plan. You might check out the features on their pricing page and if you don’t use those premium features, you might make the data-grid work with the import { DataGrid } from "@mui/x-data-grid";
Their MUI-X components are mostly available for the Free tier, but advanced features require a license as you can see by expanding the features on the table below the page here: https://mui.com/pricing/
I had the version 5 of the template however now it is version 6, is there a way or a documentation that shows how the migration can be achieved or is there a migration guide or the version is a whole new set and have to rewrite everything?
Hi,
It was a complete rewrite. We switched from CRA to Vite, Bootstrap to MUI and used Tailwind and Typescript. Also moved the design to Figma from Photoshop.
Unfortunately there is no practical way to migrate from the old version.
Thank you for coming back to me, one thing why isn’t the left menu getting closed if clicked outside? I mean for example go to https://gogo-vite.crealeaf.com/dashboards/default and try to click outside you ll see that the left menu isnt closing. To make it work, now click on the empty menu and now if you click outside it starts closing, not sure if this intended.
Is there any feedback regarding this?
Hi,
I am not able to reproduce the issue. I navigated to the link, clicked outside, the menu did not close, and clicked on an empty part of the menu, then clicked outside again, and the menu stayed.
The menu works differently in different resolutions. 1440px and 960px are the breakpoints. Could you share your screen resolution and the browser?
Hi,
What you explained “navigated to the link, clicked outside, the menu did not close, and clicked on an empty part of the menu, then clicked outside again, and the menu stayed.” is exactly my problem, I want that if the left menu is opened and you click outside, it should close it but that it isn’t happening. I have the same result in firefox and chrome, resolution 1792×1120.
Hi,
Now I got it. The menu changes its state based on the screen resolution and by default set to stay open above xl(1440px).
You might increase that value so the menu would stay open when the screen size is bigger. You can change it in layout-context.tsx file by updating secondaryBreakpoint: “xl” to secondaryBreakpoint: “3xl”. 3xl is 1900px, so it will stay open above it.
There is no “always-closed” config for it, but if you want it, you can create a new breakpoint with a huge value and set secondaryBreakpoint value to that. Here are the files that need to change:
- mui-extend.ts: Search for BreakpointOverrides and add "10xl": true;
- types.ts: Search for Screens and add "10xl": string;
- tailwind.config.ts: Search for screens: and add "10xl": "10000px",
- theme-provider.tsx: Search for breakpoints: and add "10xl": 10000,
- layout-context.tsx: Search for secondaryBreakpoint and set it to "10xl".
For a faster solution, you can remove the logic in the use-menu.ts file useScreenEffect with the comment ”// Handle secondary breakpoint changes if configured” and add the below. It should work.
// Handle secondary breakpoint changes if configured
useScreenEffect(secondaryBreakpoint || "2xl", () => {
if (secondaryDefault !== false) {
setSecondaryDefault(false);
}
});
Cheers.
can we use this in next js
Hi,
It can work, but requires some time. The react-router needs to be removed in favor of Nextjs’s own router, and there are also some parts that need to be added or removed to make Nextjs work without issues.
We have a Nextjs version here if you are interested: https://themeforest.net/item/piaf-vuejs-admin-dashboard/23160320
I really love your theme—it’s amazing and has all the features I’m looking for. I’m interested in purchasing it. However, I noticed that it currently doesn’t support RTL (right-to-left) layout, which is important for me because I need users to be able to switch the language from English to Arabic, and have the layout and direction adjust accordingly.
I wanted to ask:
If I purchase the theme, would you be able to support implementing RTL functionality, such as a toggle button to switch directions?
Or, is there a possibility that this feature might be included in a future version of the theme?
Hi,
We are working on the applications section and putting in some work for additional dashboards. After them, we will work on the RTL version.
Cheers.
You finally did it. Perfect.
I wonder if the template I’m going to purchase includes HTML versions of the pages?
Hi,
Unfortunately it is only React.
Cheers.
Dear,
I hope this message finds you well.
I recently purchased your theme, [ Gogo – Vite React Typescript MUI Tailwind Admin Template], and I am very impressed with its quality (Purchase Code: [204998926]).
I am writing to inquire about paid customization services. I have a specific project in mind that requires significant modifications to the theme’s core functionality.
My goal is to transform the theme into a complete B2B booking system for flights, visas, and hotels. This would require, at a minimum:
Customizing the menu structure and appearance. Creating a backend for managing inventory (flights, visas, hotel rooms). Implementing a booking and reservation system for partners (B2B). Integrating user roles and capabilities for different types of clients. This is a complex project, and I understand it falls outside the scope of standard theme support.
Could you please let me know:
If you or your team offer paid customization services for a project of this scale? If yes, what would be the next steps? For example, would you need a more detailed project brief to provide a quotation? If not, could you perhaps recommend a developer or agency familiar with your theme who might be able to undertake this work? Thank you for your time and for creating such a great theme. I look forward to hearing from you.
Best regards,
Hi,
We have sent a reply to your message via email. Please check your inbox for our response from support@crealeaf.com
Best Regards.
and please also add the Chatting module and Chatbot section
Yes, applications and UI blocks are on our list and. Thanks.
Welcome back!! I was waiting for this update since 2022, I feel you guys will update this regularly from now
Hi,
Thank you. We will work on it regularly and make improvements.
Also, we got your edit request for Figma but that file is just for preview.
Please use the gogo-vite-design.fig file that comes with the downloaded theme files. You can use it by going to Figma home screen and dropping it there.
Cheers.
Perfect!! Thank you so much!!
is this product dead?
Hi,
We published an update and included the latest React with Typescript, Tailwind, and MUI.
All the best.