import AboutUs from "./steps/AboutUs";
import BookingScript from "./steps/BookingScript";
import FaqPage from "./steps/Faq";
import GeneralInfo from "./steps/GeneralInfo";
import GoingLive from "./steps/GoingLive";
import HomePage from "./steps/HomePage";
import Services from "./steps/Services";
import Welcome from "./steps/Welcome";

/**
 * Meta-data steps are steps that are not part of the form, but are used to manage the form.
 *
 * @returns {Array<{id: number, title: string, component: React.Component}>}
 */
const MioCommerceOlympusFormSteps = [
  {
    id: 0,
    title: "Welcome to your website builder!",
    timeline_title: "Get Started",
    component: Welcome,
  },
  {
    id: 1,
    title: "General information about your website",
    timeline_title: "Add Logo, General Business and Contact Information",
    component: GeneralInfo,
  },
  {
    id: 2,
    title: "Services",
    timeline_title: "Create Categories and Service pages",
    component: Services,
  },
  {
    id: 3,
    title: "Home page",
    timeline_title: "Enter Your Home Page Content",
    component: HomePage,
  },
  {
    id: 4,
    title: "About us",
    timeline_title: "Enter Your About Us Page Content",
    component: AboutUs,
  },
  {
    id: 5,
    title: "FAQ",
    timeline_title: "Add Frequently Asked Questions and Answers",
    component: FaqPage,
  },
  {
    id: 6,
    title: "Booking Script",
    timeline_title: "Set Up Booking Pages",
    component: BookingScript,
  },
  {
    id: 7,
    title: "Going live",
    timeline_title: "Go Live!",
    component: GoingLive,
  },
];

export default MioCommerceOlympusFormSteps;
