{"version":3,"sources":["app/common/utilities.ts","_metronic/layout/core/LayoutProvider.tsx","_metronic/layout/core/PageData.tsx","assets/ProjectsData.ts","_metronic/partials/content/dropdown/Dropdown2.tsx","assets/InsightData.ts","_metronic/assets/ts/_utils/_ElementStyleUtil.ts","_metronic/assets/ts/_utils/_DataUtil.ts","_metronic/assets/ts/_utils/_TypesHelpers.ts","_metronic/assets/ts/_utils/_DOMEventHandlerUtil.ts","_metronic/assets/ts/_utils/ElementAnimateUtil.ts","_metronic/assets/ts/_utils/DomHelpers.ts","_metronic/assets/ts/_utils/EventHandlerUtil.ts","app/pages/projects/ProjectContent.tsx","app/pages/services/Services.tsx","_metronic/helpers/AssetHelpers.ts","_metronic/helpers/RouterHelpers.ts","_metronic/helpers/components/KTSVG.tsx","_metronic/helpers/dataExamples.ts","_metronic/assets/ts/components/_CookieComponent.ts","_metronic/assets/ts/components/_DrawerComponent.ts","_metronic/assets/ts/components/_FeedbackComponent.ts","_metronic/assets/ts/components/_ImageInputComponent.ts","_metronic/assets/ts/components/_ScrollComponent.ts","_metronic/assets/ts/components/_ScrollTopComponent.ts","_metronic/assets/ts/components/_StepperComponent.ts","_metronic/assets/ts/components/_StickyComponent.ts","_metronic/assets/ts/components/_ToggleComponent.ts","_metronic/assets/ts/components/_PasswordMeterComponent.ts","_metronic/assets/ts/components/_SwapperComponent.ts","_metronic/assets/ts/components/MenuComponent.ts","_metronic/assets/ts/components/SearchComponent.ts","app/modules/auth/components/Registration.tsx","app/modules/auth/components/ForgotPassword.tsx","app/modules/auth/components/Login.tsx","app/modules/auth/__mocks__/usersTableMock.ts","app/modules/auth/Logout.tsx","app/modules/auth/redux/AuthInit.tsx","setup/redux/RootReducer.ts","setup/redux/Store.ts","_metronic/i18n/i18nProvider.tsx","_metronic/layout/components/Content.tsx","_metronic/layout/components/Footer.tsx","_metronic/layout/components/header/MenuItem.tsx","_metronic/layout/components/header/MenuInner.tsx","_metronic/layout/components/header/Header.tsx","_metronic/layout/components/header/page-title/DefaultTitle.tsx","_metronic/layout/components/header/Topbar.tsx","_metronic/layout/components/header/HeaderWrapper.tsx","_metronic/layout/components/ScrollTop.tsx","_metronic/layout/MasterInit.tsx","_metronic/layout/MasterLayout.tsx","app/modules/errors/components/Error500.tsx","app/modules/errors/components/Error404.tsx","app/modules/errors/ErrorsPage.tsx","app/pages/dashboard/components/Banner/Banner.tsx","app/pages/dashboard/components/Projects/Project.tsx","app/pages/dashboard/components/AboutUs/AboutUs.tsx","app/pages/dashboard/components/Clients/Clients.tsx","app/pages/dashboard/components/Insights/items/index.tsx","app/pages/dashboard/components/Insights/Insights.tsx","app/pages/dashboard/DashboardWrapper.tsx","app/pages/MenuTestPage.tsx","app/routing/PrivateRoutes.tsx","app/routing/Routes.tsx","app/App.tsx","setup/axios/MockAxios.ts","app/modules/auth/__mocks__/mockAuth.ts","index.tsx","setup/axios/SetupAxios.ts","_metronic/partials/content/dropdown/Dropdown1.tsx","app/modules/auth/redux/AuthCRUD.ts","_metronic/layout/core/LayoutSetup.ts","_metronic/layout/core/MetronicSplashScreen.tsx","app/modules/auth/redux/AuthRedux.ts","_metronic/i18n/Metronici18n.tsx","_metronic/partials/layout/header-menus/Languages.tsx","_metronic/partials/layout/explore/ExploreMain.tsx","_metronic/partials/layout/drawer-messenger/DrawerMessenger.tsx","_metronic/partials/layout/activity-drawer/ActivityDrawer.tsx","_metronic/partials/content/fallback-view/FallbackView.tsx","_metronic/partials/modals/create-app/Main.tsx","_metronic/partials/modals/invite-users/InviteUsers.tsx","_metronic/partials/modals/upgrade-plan/UpgradePlan.tsx","_metronic/partials/chat/ChatInner.tsx","app/common/components/arrow-navigation/index.tsx","_metronic/layout/core/DefaultLayoutConfig.ts"],"names":["getIdFromPath","path","pos","lastIndexOf","posDot","substring","getUniquePostKeyFromPath","transferTitleToAlias","title","trim","replace","replaceAll","LayoutContext","createContext","config","DefaultLayoutConfig","classes","getEmptyCssClasses","attributes","getEmptyHTMLAttributes","cssVariables","getEmptyCSSVariables","setLayout","disableSplashScreen","splashScreen","document","getElementById","style","setProperty","LayoutProvider","children","useState","LayoutSetup","setConfig","setClasses","setAttributes","setCSSVariables","value","_themeConfig","enableSplashScreen","Array","from","body","classList","forEach","cl","remove","updatePartialConfig","Object","assign","setTimeout","useEffect","Provider","useLayout","useContext","PageDataContext","setPageTitle","_title","setPageBreadcrumbs","_breadcrumbs","setPageDescription","_description","PageDataProvider","pageTitle","pageDescription","pageBreadcrumbs","usePageData","PageTitle","description","breadcrumbs","toString","projects","id","name","alias","keyword","shortDescription","type","logo","thumbnail","background","images","originId","languageCode","Dropdown2","className","href","Insights","uniquePostKey","date","content","refUniquePostKeys","ElementStyleUtil","element","property","important","attributeName","getPropertyValue","attibuteName","removeProperty","DataUtil","instance","key","data","instanceData","store","get","set","newMap","Map","delete","has","result","val","v","k","push","getObjectPropertyValueByKey","obj","map","entries","hasOwnProperty","getUniqueIdWithPrefix","prefix","Math","floor","random","Date","getTime","stringSnakeToCamel","str","m","toUpperCase","DOMEventHandlerUtil","selector","eventName","callBack","eventId","e","targets","querySelectorAll","target","i","length","call","parentElement","addEventListener","funcFromStore","removeEventListener","calee","currentTarget","ElementAnimateUtil","to","duration","update","complete","easings","t","b","c","d","change","start","window","performance","now","requestAnimationFrame","loop","timestamp","time","animationName","animateClasses","split","cssClass","add","one","offset","targetPos","getElementOffset","top","scrollPos","pageYOffset","documentElement","scrollTop","animate","scrollTo","getCSS","el","styleProp","defaultView","ownerDocument","toLowerCase","getComputedStyle","getCSSVariableValue","variableName","hex","getElementActualCss","prop","cache","css","getAttribute","cssText","offsetWidth","offsetHeight","undefined","setAttribute","parseFloat","attributeValue","getElementIndex","parentNode","getElementMatches","p","Element","prototype","f","matches","webkitMatchesSelector","tagName","getClientRects","left","rect","getBoundingClientRect","win","pageXOffset","getElementParents","s","this","item","parents","getHighestZindex","bufferNode","buffer","position","parseInt","isNaN","getScrollTop","scrollingElement","getViewPort","width","innerWidth","height","innerHeight","insertAfterElement","referenceNode","insertBefore","nextSibling","isVisibleElement","throttle","timer","func","delay","getElementChild","childNodes","child","nodeType","getElementChildren","slide","dir","speed","callback","calcHeight","getElementActualHeight","calcPaddingTop","calcPaddingBottom","paddingTop","paddingBottom","display","overflow","slideUp","slideDown","getBreakpoint","breakpoint","getAttributeValueByBreakpoint","incomingAttr","jsonStr","join","matched","JSON","parse","toJSON","resultKey","resultBreakpoint","EventHandlerUtil","metas","handlerId","meta","getEventMetasByName","setEventMetasByName","handerId","fired","getEventsMetaByHandlerId","setEventMetaByNameAndHandlerId","handler","setFiredByNameAndHandlerId","addEvent","removeEvent","on","ProjectContent","intl","useIntl","recordsProject","filter","x","locale","formatMessage","idx","src","alt","ServicesWrapper","isHome","sm","isRight","isCircle","color","xs","md","Title","Text","toAbsoluteUrl","pathname","process","checkIsActive","url","current","getCurrentUrl","indexOf","KTSVG","svgClassName","defaultAlerts","icon","state","defaultLogs","code","message","CookieComponent","cookie","match","RegExp","decodeURIComponent","cookieOptions","options","expires","toUTCString","updatedCookie","encodeURIComponent","optionKey","optionValue","DrawerStore","instanceId","drawerComponentObj","defaultDrawerOptions","overlay","baseClass","overlayClass","direction","DrawerComponent","_element","overlayElement","toggleElement","instanceUid","shown","lastWidth","closeElement","_handlers","togglers","_getOption","closers","preventDefault","_toggle","_hide","_update","String","hasBaseClass","contains","bodyCanvasAttr","attr","optionName","option","trigger","_show","_deleteOverlay","removeAttribute","_createOverlay","createElement","elementZIndex","overlayZindex","append","overlayClassOption","removeChild","_getDirection","_getWidth","toggle","show","hide","isShown","goElement","off","event","drawer","getInstance","hasInstace","elementId","hideAll","getAllInstances","dr","updateAll","handleDismiss","closest","bootstrap","createInstances","initGlobalHandlers","reinitialization","defaultImageInputOptions","defaultImageInputQueires","componentName","instanseQuery","inputQuery","wrapperQuery","cancelQuery","removeQuery","hiddenQuery","ImageInputComponent","_options","_queries","inputElement","wrapperElement","cancelElement","removeElement","hiddenElement","queries","uid","_change","files","reader","FileReader","onload","readAsDataURL","_cancel","_remove","querySelector","handlers","ImageInput","elements","createInsance","defaultScrollOptions","saveState","ScrollComponent","getOption","hasAttribute","getHeightType","getAutoHeight","dependencies","wrappers","len","borderTop","borderBottom","setupHeight","getHeight","heightType","setupState","setupScrollHandler","scrollHandler","cookieId","destroyScrollHandler","resetHeight","heghtType","Function","getElement","scroll","resize","createInstance","defaultScrollTopOptions","ScrollTopComponent","_scroll","_go","go","goTop","defaultStepperOptions","startIndex","animation","animationSpeed","animationNextClass","animationPreviousClass","StepperComponent","steps","btnNext","btnPrev","btnSubmit","totatStepsNumber","passedStepIndex","currentStepIndex","_goTo","index","refreshUI","initHandlers","stepDirection","_getStepDirection","getStepContent","getLastStepIndex","getTotalStepsNumber","isLastStep","isFirstStep","animateClass","isBetweenStep","goto","goNext","getNextStepIndex","goPrev","getPrevStepIndex","goFirst","goLast","getCurrentStepIndex","getPassedStepIndex","destroy","console","log","stepper","defaultStickyOptions","reverse","animationClass","StickyComponent","instanceName","eventTriggerState","lastScrollTop","offsetNum","st","enable","disable","dataStickyAttr","attrValueInStr","attrValue","zindex","widthTarget","targetElement","offsetLeft","sticky","defaultToggleOptions","ToggleComponent","attribute","_isEnabled","_disable","_enable","isEnabled","elementTargetAttr","elementToggleAttr","defaultPasswordMeterOptions","minLength","checkUppercase","checkLowercase","checkDigit","checkChar","scoreHighlightClass","defaultPasswordMeterQueires","visibilityQuery","highlightQuery","PasswordMeterComponent","visibilityElement","highlightElement","score","checkSteps","reset","highlight","check","visitbility","visibleIcon","hiddenIcon","focus","test","count","items","slice","total","checkScore","getCheckScore","getScore","checkLength","checkLowerCase","passwordMeter","SwapperStore","defaultSwapperOptions","mode","defaultSwapperQueires","attrQuery","SwapperComponent","parentSelector","prepend","place","defaultMenuOptions","dropdown","hoverTimeout","accordion","slideSpeed","expand","MenuComponent","triggerElement","_setTriggerElement","_isTriggerElement","_getItemOption","_getItemElement","itemElement","sub","subItem","_getItemParentElement","parentItem","_getItemParentElements","parent","unshift","_getDropdownPopperConfig","placementOption","placement","offsetValue","strategy","modifiers","flipVariations","_getItemChildElement","_getItemChildElements","_getItemSubElement","_getCss","_getItemSubType","_isItemSubShown","_isItemDropdownPermanent","_isItemParentShown","_isItemSubElement","_hasItemSub","_getItemLinkElement","_getItemToggleElement","_showDropdown","hideDropdowns","parentZindex","initDropdownPopper","appendChild","reference","attach","popper","createPopper","_hideDropdown","destroyDropdownPopper","_showAccordion","_hideAccordions","subElement","_hideAccordion","itemsToHide","itemToHide","_reset","removeClass","_destroy","_mouseout","timeout","_mouseover","clearTimeout","_dismiss","itemSubType","_link","_click","click","link","dismiss","mouseover","mouseout","getItemTriggerType","getItemSubType","getItemLinkElement","getItemToggleElement","getItemSubElement","getItemParentElements","isItemSubShown","isItemParentShown","getTriggerElement","isItemDropdownPermanent","hideAccordions","elementMenu","menu","menuData","subMenu","skip","updateDropdowns","forceUpdate","menuItem","menuInstance","menuItems","menuObj","stopPropagation","defaultSearchOptions","keypress","enter","layout","showOnFocus","defaultSearchQueires","SearchComponent","contentElement","formElement","spinnerElement","clearElement","submitElement","toolbarElement","resultsElement","suggestionElement","emptyElement","processing","menuObject","_getElement","getResponsiveFormMode","responsive","blur","charCode","keyCode","search","input","clear","responsiveFormMode","isProcessing","getQuery","getMenu","getFormElement","context","Search","Yup","shape","firstname","min","max","required","email","lastname","password","changepassword","when","is","then","oneOf","acceptTerms","UsersTableMock","Logout","dispatch","useDispatch","auth","logout","location","reload","table","username","accessToken","refreshToken","roles","pic","fullname","occupation","companyName","phone","language","timeZone","website","emailSettings","emailNotification","sendCopyToPersonalEmail","activityRelatesEmail","youHaveNewNotifications","youAreSentADirectMessage","someoneAddsYouAsAsAConnection","uponNewOrder","newMembershipApproval","memberRegistration","updatesFromKeenthemes","newsAboutKeenthemesProductsAndFeatureUpdates","tipsOnGettingMoreOutOfKeen","thingsYouMissedSindeYouLastLoggedIntoKeen","newsAboutStartOnPartnerProductsAndOtherServices","tipsOnStartBusinessProducts","communication","sms","address","addressLine","city","postCode","socialNetworks","linkedIn","facebook","twitter","instagram","connector","connect","props","didRequest","useRef","showSplashScreen","setShowSplashScreen","useSelector","shallowEqual","requestUser","getUserByToken","user","fulfillUser","error","rootSaga","rootReducer","combineReducers","all","sagaMiddleware","createSagaMiddleware","middleware","getDefaultMiddleware","immutableCheck","serializableCheck","thunk","configureStore","reducer","devTools","enhancers","reduxBatch","persistor","persistStore","run","allMessages","de","deMessages","es","vi","viMessages","en","enMessages","fr","ja","zh","I18nProvider","useLang","messages","Content","useLocation","clsx","iconName","linkIcon","linkAboutUs","inforCompany","contactCompany","Footer","padding","marginTop","cate","getFullYear","MenuItem","fontIcon","hasArrow","hasBullet","active","MenuInner","Header","DefaultTitle","breadCrumbs","isSeparator","languages","lang","flag","Topbar","currentLanguage","find","onChange","setLanguage","defaultValue","HeaderWrapper","header","aside","headerMenu","ScrollTop","isFirstRun","reInitialization","stickyHeader","updateHeaderSticky","MasterInit","MasterLayout","Error500","Error404","ErrorsPage","history","useHistory","backgroundImage","exact","onClick","servicesData","serviceId","serviceName","BannerWrapper","autoPlay","muted","preload","gradient","ProjectsWrapper","controls","AboutUsWrapper","ClientsWrapper","dots","infinite","rows","slidesToShow","slidesToScroll","arrows","settings","slidesToclick","initialSlide","Swipe","Item","img","InsightsWrapper","currentLang","sizeLeft","setSizeLeft","sizeRight","setSizeRight","insightData","setInsightData","highlightInsight","setHighlightInsight","normalInsight","setNormalInsight","dashboardInsigt","sort","a","ins","shift","handleResize","Row","Col","lg","DashboardPage","Services","DashboardWrapper","MenuTestPage","PrivateRoutes","BuilderPageWrapper","lazy","AboutWrapper","ProjectsPageWrapper","ProjectDetailPage","ProductDesignServiceWrapper","SoftwareDevelopmentService","ERPService","CareersPageWrapper","ProfilePage","WizardsPage","AccountPage","WidgetsPage","ChatPage","Contact","fallback","component","Routes","App","basename","Helmet","rel","axios","mock","MockAdapter","delayResponse","generateUserId","ids","onPost","LOGIN_URL","reply","REGISTER_URL","REQUEST_PASSWORD_URL","onGet","GET_USER_BY_ACCESSTOKEN_URL","Authorization","headers","startsWith","mockAuth","_redux","interceptors","request","use","getState","err","Promise","reject","Chart","register","registerables","ReactDOM","render","loading","Dropdown1","defaultChecked","API_URL","login","post","requestPassword","LAYOUT_CONFIG_KEY","getLayout","ls","localStorage","getItem","er","headerContainer","headerMobile","asideMenu","asideToggle","toolbar","toolbarContainer","contentContainer","footerContainer","sidebar","main","class","fixed","desktop","tabletAndMobile","tabletAndMobileMode","typeOptions","layouts","bodyStyles","heightAndTabletMobileMode","responsiveBreakpoint","responsiveTarget","theme","minimized","hoverable","darkSkinEnabled","initLayout","initHeader","initPageTitle","initToolbar","initContent","initAside","initFooter","footer","initAsideMenu","fieldsToUpdate","updatedConfig","initCSSClasses","initCSSVariables","initHTMLAttributes","isLoaded","initConfig","setItem","stringify","MetronicSplashScreenContext","LayoutSplashScreen","visible","setCount","prev","saga","actionTypes","initialAuthState","persistReducer","storage","whitelist","action","payload","actions","setUser","takeLatest","loginSaga","put","registerSaga","userRequested","I18N_CONFIG_KEY","REACT_APP_I18N_CONFIG_KEY","initialState","selectedLang","I18nContext","MetronicI18nProvider","getConfig","ExploreMain","DrawerMessenger","ActivityDrawer","FallbackView","inits","appName","category","framework","dbName","dbType","nameOnCard","cardNumber","cardExpiryMonth","cardExpiryYear","cardCvv","saveCard","createAppSchema","label","Main","stepperRef","currentSchema","setCurrentSchema","initValues","prevStep","ref","validationSchema","initialValues","onSubmit","values","resetForm","noValidate","placeholder","as","InviteUsers","avatar","access","charAt","plans","subTitle","priceMonth","priceAnnual","default","custom","features","supported","UpgradePlan","currentState","setCurrentState","selected","setSelected","plan","checked","feature","ChatInner","isDrawer","ArrowNavigation","primaryColor","loader","scrolltop","menuIcon","megaMenu","minimize","toolbar1","toolbar2","toolbar3","toolbar4","toolbar5"],"mappings":"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","file":"static/js/main.7700bd73.chunk.js","sourcesContent":["export function getIdFromPath(path: string) {\r\n  if (path !== null && path !== '') {\r\n    const pos = path.lastIndexOf('-')\r\n    const posDot = path.lastIndexOf('.html')\r\n    const id = path.substring(pos + 1, posDot)\r\n    return id\r\n  }\r\n}\r\n\r\nexport function getUniquePostKeyFromPath(path: string) {\r\n  if (path !== null && path !== '') {\r\n    const pos = path.lastIndexOf('_')\r\n    const posDot = path.lastIndexOf('.html')\r\n    const id = path.substring(pos + 1, posDot)\r\n    return id\r\n  }\r\n}\r\n\r\nexport function transferTitleToAlias(title?: string) {\r\n  if (!title) return ''\r\n  const newTitle = removeVietnameseTones(title.trim())\r\n\r\n  return newTitle.trim().replaceAll(' ', '-')\r\n}\r\n\r\nfunction removeVietnameseTones(str: string) {\r\n  str = str.replace(/à|á|ạ|ả|ã|â|ầ|ấ|ậ|ẩ|ẫ|ă|ằ|ắ|ặ|ẳ|ẵ/g, 'a')\r\n  str = str.replace(/è|é|ẹ|ẻ|ẽ|ê|ề|ế|ệ|ể|ễ/g, 'e')\r\n  str = str.replace(/ì|í|ị|ỉ|ĩ/g, 'i')\r\n  str = str.replace(/ò|ó|ọ|ỏ|õ|ô|ồ|ố|ộ|ổ|ỗ|ơ|ờ|ớ|ợ|ở|ỡ/g, 'o')\r\n  str = str.replace(/ù|ú|ụ|ủ|ũ|ư|ừ|ứ|ự|ử|ữ/g, 'u')\r\n  str = str.replace(/ỳ|ý|ỵ|ỷ|ỹ/g, 'y')\r\n  str = str.replace(/đ/g, 'd')\r\n  str = str.replace(/À|Á|Ạ|Ả|Ã|Â|Ầ|Ấ|Ậ|Ẩ|Ẫ|Ă|Ằ|Ắ|Ặ|Ẳ|Ẵ/g, 'A')\r\n  str = str.replace(/È|É|Ẹ|Ẻ|Ẽ|Ê|Ề|Ế|Ệ|Ể|Ễ/g, 'E')\r\n  str = str.replace(/Ì|Í|Ị|Ỉ|Ĩ/g, 'I')\r\n  str = str.replace(/Ò|Ó|Ọ|Ỏ|Õ|Ô|Ồ|Ố|Ộ|Ổ|Ỗ|Ơ|Ờ|Ớ|Ợ|Ở|Ỡ/g, 'O')\r\n  str = str.replace(/Ù|Ú|Ụ|Ủ|Ũ|Ư|Ừ|Ứ|Ự|Ử|Ữ/g, 'U')\r\n  str = str.replace(/Ỳ|Ý|Ỵ|Ỷ|Ỹ/g, 'Y')\r\n  str = str.replace(/Đ/g, 'D')\r\n  // Some system encode vietnamese combining accent as individual utf-8 characters\r\n  // Một vài bộ encode coi các dấu mũ, dấu chữ như một kí tự riêng biệt nên thêm hai dòng này\r\n  str = str.replace(/\\u0300|\\u0301|\\u0303|\\u0309|\\u0323/g, '') // ̀ ́ ̃ ̉ ̣  huyền, sắc, ngã, hỏi, nặng\r\n  str = str.replace(/\\u02C6|\\u0306|\\u031B/g, '') // ˆ ̆ ̛  Â, Ê, Ă, Ơ, Ư\r\n  // Remove extra spaces\r\n  // Bỏ các khoảng trắng liền nhau\r\n  str = str.replace(/ + /g, ' ')\r\n  str = str.trim()\r\n  // Remove punctuations\r\n  // Bỏ dấu câu, kí tự đặc biệt\r\n  str = str.replace(\r\n    /!|@|%|\\^|\\*|\\(|\\)|\\+|=|<|>|\\?|\\/|,|\\.|:|;|'|\"|&|#|\\[|\\]|~|\\$|_|`|-|{|}|\\||\\\\/g,\r\n    ' '\r\n  )\r\n  return str\r\n}\r\n","import React, {createContext, useContext, useState, useEffect} from 'react'\r\nimport {DefaultLayoutConfig} from './DefaultLayoutConfig'\r\nimport {\r\n  getEmptyCssClasses,\r\n  getEmptyCSSVariables,\r\n  getEmptyHTMLAttributes,\r\n  LayoutSetup,\r\n} from './LayoutSetup'\r\nimport {\r\n  ILayout,\r\n  ILayoutCSSVariables,\r\n  ILayoutCSSClasses,\r\n  ILayoutHTMLAttributes,\r\n} from './LayoutModels'\r\n\r\nexport interface LayoutContextModel {\r\n  config: ILayout\r\n  classes: ILayoutCSSClasses\r\n  attributes: ILayoutHTMLAttributes\r\n  cssVariables: ILayoutCSSVariables\r\n  setLayout: (config: LayoutSetup) => void\r\n}\r\n\r\nconst LayoutContext = createContext<LayoutContextModel>({\r\n  config: DefaultLayoutConfig,\r\n  classes: getEmptyCssClasses(),\r\n  attributes: getEmptyHTMLAttributes(),\r\n  cssVariables: getEmptyCSSVariables(),\r\n  setLayout: (config: LayoutSetup) => {},\r\n})\r\n\r\nconst enableSplashScreen = () => {\r\n  const splashScreen = document.getElementById('splash-screen')\r\n  if (splashScreen) {\r\n    splashScreen.style.setProperty('display', 'flex')\r\n  }\r\n}\r\n\r\nconst disableSplashScreen = () => {\r\n  const splashScreen = document.getElementById('splash-screen')\r\n  if (splashScreen) {\r\n    splashScreen.style.setProperty('display', 'none')\r\n  }\r\n}\r\n\r\nconst LayoutProvider: React.FC = ({children}) => {\r\n  const [config, setConfig] = useState(LayoutSetup.config)\r\n  const [classes, setClasses] = useState(LayoutSetup.classes)\r\n  const [attributes, setAttributes] = useState(LayoutSetup.attributes)\r\n  const [cssVariables, setCSSVariables] = useState(LayoutSetup.cssVariables)\r\n  const setLayout = (_themeConfig: Partial<ILayout>) => {\r\n    enableSplashScreen()\r\n    const bodyClasses = Array.from(document.body.classList)\r\n    bodyClasses.forEach((cl) => document.body.classList.remove(cl))\r\n    LayoutSetup.updatePartialConfig(_themeConfig)\r\n    setConfig(Object.assign({}, LayoutSetup.config))\r\n    setClasses(LayoutSetup.classes)\r\n    setAttributes(LayoutSetup.attributes)\r\n    setCSSVariables(LayoutSetup.cssVariables)\r\n    setTimeout(() => {\r\n      disableSplashScreen()\r\n    }, 500)\r\n  }\r\n  const value: LayoutContextModel = {\r\n    config,\r\n    classes,\r\n    attributes,\r\n    cssVariables,\r\n    setLayout,\r\n  }\r\n\r\n  useEffect(() => {\r\n    disableSplashScreen()\r\n  }, [])\r\n\r\n  return <LayoutContext.Provider value={value}>{children}</LayoutContext.Provider>\r\n}\r\n\r\nexport {LayoutContext, LayoutProvider}\r\n\r\nexport function useLayout() {\r\n  return useContext(LayoutContext)\r\n}\r\n","/* eslint-disable react-hooks/exhaustive-deps */\r\nimport React, {FC, createContext, useContext, useEffect, useState} from 'react'\r\n\r\nexport interface PageLink {\r\n  title: string\r\n  path: string\r\n  isActive: boolean\r\n  isSeparator?: boolean\r\n}\r\n\r\nexport interface PageDataContextModel {\r\n  pageTitle?: string\r\n  setPageTitle: (_title: string) => void\r\n  pageDescription?: string\r\n  setPageDescription: (_description: string) => void\r\n  pageBreadcrumbs?: Array<PageLink>\r\n  setPageBreadcrumbs: (_breadcrumbs: Array<PageLink>) => void\r\n}\r\n\r\nconst PageDataContext = createContext<PageDataContextModel>({\r\n  setPageTitle: (_title: string) => {},\r\n  setPageBreadcrumbs: (_breadcrumbs: Array<PageLink>) => {},\r\n  setPageDescription: (_description: string) => {},\r\n})\r\n\r\nconst PageDataProvider: React.FC = ({children}) => {\r\n  const [pageTitle, setPageTitle] = useState<string>('')\r\n  const [pageDescription, setPageDescription] = useState<string>('')\r\n  const [pageBreadcrumbs, setPageBreadcrumbs] = useState<Array<PageLink>>([])\r\n  const value: PageDataContextModel = {\r\n    pageTitle,\r\n    setPageTitle,\r\n    pageDescription,\r\n    setPageDescription,\r\n    pageBreadcrumbs,\r\n    setPageBreadcrumbs,\r\n  }\r\n  return <PageDataContext.Provider value={value}>{children}</PageDataContext.Provider>\r\n}\r\n\r\nfunction usePageData() {\r\n  return useContext(PageDataContext)\r\n}\r\n\r\ntype Props = {\r\n  description?: string\r\n  breadcrumbs?: Array<PageLink>\r\n}\r\n\r\nconst PageTitle: FC<Props> = ({children, description, breadcrumbs}) => {\r\n  const {setPageTitle, setPageDescription, setPageBreadcrumbs} = usePageData()\r\n  useEffect(() => {\r\n    if (children) {\r\n      setPageTitle(children.toString())\r\n    }\r\n    return () => {\r\n      setPageTitle('')\r\n    }\r\n  }, [children])\r\n\r\n  useEffect(() => {\r\n    if (description) {\r\n      setPageDescription(description)\r\n    }\r\n    return () => {\r\n      setPageDescription('')\r\n    }\r\n  }, [description])\r\n\r\n  useEffect(() => {\r\n    if (breadcrumbs) {\r\n      setPageBreadcrumbs(breadcrumbs)\r\n    }\r\n    return () => {\r\n      setPageBreadcrumbs([])\r\n    }\r\n  }, [breadcrumbs])\r\n\r\n  return <></>\r\n}\r\n\r\nconst PageDescription: React.FC = ({children}) => {\r\n  const {setPageDescription} = usePageData()\r\n  useEffect(() => {\r\n    if (children) {\r\n      setPageDescription(children.toString())\r\n    }\r\n    return () => {\r\n      setPageDescription('')\r\n    }\r\n  }, [children])\r\n  return <></>\r\n}\r\n\r\nexport {PageDescription, PageTitle, PageDataProvider, usePageData}\r\n","export interface IProject {\r\n    id: number;\r\n    name: string;\r\n    alias: string;\r\n    keyword: string;\r\n    shortDescription: string;\r\n    type: string;\r\n    logo: string;\r\n    thumbnail: string;\r\n    background: string;\r\n    images: string[];\r\n    originId: number;\r\n    languageCode: string;\r\n};\r\n\r\nexport const projects = [\r\n    {\r\n        id: 1,\r\n        name: \"123Bay Vietnam\",\r\n        alias: \"123bay-vietnam\",\r\n        keyword: \"An agent specializing in providing cheap and reputable flight booking services | 123Bay\",\r\n        shortDescription: \"123Bay is proud to be one of the agents providing the service of booking cheap airline tickets online and providing the most dedicated customer support.\",\r\n        type: \"Flight booking service\",\r\n        logo: \"/media/images/logo/logo-123bay.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/123bay-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/123bay.png\", \"/media/images/projects/123bay-contact.png\"],\r\n        originId: 2,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 2,\r\n        name: \"123Bay Việt Nam\",\r\n        alias: \"123bay-vietnam\",\r\n        keyword: \"Đại lý chuyên cung cấp dịch vụ đặt vé máy bay giá rẻ, uy tín | 123Bay\",\r\n        shortDescription: \"123Bay tự hào là một trong những đại lý cung cấp dịch vụ đặt mua vé máy bay giá rẻ trực tuyến và hỗ trợ khách hàng tận tình nhất.\",\r\n        type: \"Dịch vụ đặt vé máy bay\",\r\n        logo: \"/media/images/logo/logo-123bay.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/123bay-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/123bay.png\", \"/media/images/projects/123bay-contact.png\"],\r\n        originId: 1,\r\n        languageCode: \"vi\"\r\n    },\r\n    {\r\n        id: 3,\r\n        name: \"Property24 Vietnam\",\r\n        alias: \"property24-vietnam\",\r\n        keyword: \"Buy, sell, rent apartments, offices | Real estate information channel | Property24\",\r\n        shortDescription: \"We develop a website based on modern technology platforms, in order to connect all users such as investors, consultants, landlords, brokers to access information sources. about buying, selling, renting real estate and trends in the market quickly, simply and effectively.\",\r\n        type: \"Real Estate Services\",\r\n        logo: \"/media/images/logo/logo-property24.vn.svg\",\r\n        thumbnail: \"/media/images/projects/thumb/property24-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/property24.jpg\", \"/media/images/projects/property24-admin.png\"],\r\n        originId: 4,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 4,\r\n        name: \"Property24 Việt Nam\",\r\n        alias: \"property24-vietnam\",\r\n        keyword: \"Mua bán, cho thuê căn hộ, văn phòng | Kênh thông tin bất động sản | Property24\",\r\n        shortDescription: \"Chúng tôi phát triển trang web dựa trên những nền tảng công nghệ hiện đại, nhằm kết nối tất cả người dùng như nhà đầu tư, tư vấn, chủ nhà, môi giới tiếp cận nguồn thông tin về mua bán, cho thuê bất động sản và xu hướng về thị trường một cách nhanh chóng, đơn giản và hiệu quả.\",\r\n        type: \"Dịch vụ bất động sản\",\r\n        logo: \"/media/images/logo/logo-property24.vn.svg\",\r\n        thumbnail: \"/media/images/projects/thumb/property24-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/property24.jpg\", \"/media/images/projects/property24-admin.png\"],\r\n        originId: 3,\r\n        languageCode: \"vi\"\r\n    },\r\n    {\r\n        id: 5,\r\n        name: \"Bidding for drugs\",\r\n        alias: \"bidding-for-drugs\",\r\n        keyword: \"Bidding for drugs, medical supplies, chemicals and biologicals for hospital testing\",\r\n        shortDescription: \"Military Hospital 121 is one of the hospitals that are using a separate on-demand service to bid for drugs, medical supplies, chemicals and biologicals for testing for Military Region 9.\",\r\n        type: \"Bidding Service\",\r\n        logo: \"/media/images/logo/logo-benhvienquany121.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/dau-thau-truc-tuyen-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/dau-thau-truc-tuyen.png\", \"/media/images/projects/dau-thau-truc-tuyen-pm-khach-hang.png\", \"/media/images/projects/dau-thau-truc-tuyen-pm-quan-ly.png\"],\r\n        originId: 6,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 6,\r\n        name: \"Đấu thầu thuốc, vật tư y tế\",\r\n        alias: \"dau-thau-thuoc-vat-tu-y-te\",\r\n        keyword: \"Đấu thầu thuốc, vật tư y tế, hoá chất sinh phẩm xét nghiệm cho bệnh viện\",\r\n        shortDescription: \"Bệnh viện quân y 121 là một trong những bệnh viện đang sử dụng dịch vụ theo yêu cầu riêng biệt dùng để đấu thầu thuốc, vật tư y tế, hoá chất sinh phẩm xét nghiệm cho quân khu 9.\",\r\n        type: \"Dịch vụ đấu thầu\",\r\n        logo: \"/media/images/logo/logo-benhvienquany121.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/dau-thau-truc-tuyen-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/dau-thau-truc-tuyen.png\", \"/media/images/projects/dau-thau-truc-tuyen-pm-khach-hang.png\", \"/media/images/projects/dau-thau-truc-tuyen-pm-quan-ly.png\"],\r\n        originId: 5,\r\n        languageCode: \"vi\"\r\n    },\r\n    {\r\n        id: 7,\r\n        name: \"Viet Chuyen SG Technology\",\r\n        alias: \"viet-chuyen-sg-technology\",\r\n        keyword: \"Providing information technology system infrastructure products and solutions\",\r\n        shortDescription: \"Viet Chuyen SG is a professional supplier in Vietnam of IT system infrastructure product solutions including: CCTV equipment, uninterruptible power equipment (UPS), lightning protection equipment, transmission equipment telecommunications, CCTV systems, Structured cabling systems, network equipment for smart buildings, Data centers and large systems.\",\r\n        type: \"IT equipment supply service\",\r\n        logo: \"/media/images/logo/logo-vietchuyen.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/viet-chuyen-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/viet-chuyen.png\"],\r\n        originId: 8,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 8,\r\n        name: \"Công nghệ Việt Chuyên SG\",\r\n        alias: \"cong-nghe-viet-chuyen-sg\",\r\n        keyword: \"Cung cấp các giải pháp và sản phẩm cơ sở hạ tầng hệ thống công nghệ thông tin\",\r\n        shortDescription: \"Việt Chuyên SG là nhà cung cấp chuyên nghiệp tại Việt Nam về các giải pháp sản phẩm cơ sở hạ tầng hệ thống CNTT bao gồm: thiết bị CCTV, thiết bị nguồn liên tục (UPS), thiết bị chống sét, thiết bị truyền dẫn viễn thông, hệ thống CCTV, hệ thống Cáp cấu trúc, thiết bị mạng cho các cao ốc thông minh, Trung tâm dữ liệu và các hệ thống lớn.\",\r\n        type: \"Dịch vụ cung cấp thiết bị CNTT\",\r\n        logo: \"/media/images/logo/logo-vietchuyen.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/viet-chuyen-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/viet-chuyen.png\"],\r\n        originId: 7,\r\n        languageCode: \"vi\"\r\n    },\r\n    {\r\n        id: 9,\r\n        name: \"People's Procuratorate\",\r\n        alias: \"peoples-procuratorate\",\r\n        keyword: \"Display information, news, manage receipt of complaints, denunciations, suggestions, recommendations, reflections, requests.\",\r\n        shortDescription: \"We build a web system to display information, news, manage and receive complaints, denunciations, suggestions, recommendations, reflections, requests.\",\r\n        type: \"Application Web Service\",\r\n        logo: \"/media/images/logo/logo-vksndcm.gov.vn-removebg-preview.png\",\r\n        thumbnail: \"/media/images/projects/thumb/vien-kiem-sat-nhan-dan-ca-mau-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/vien-kiem-sat-nhan-dan-ca-mau.png\"],\r\n        originId: 10,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 10,\r\n        name: \"Viện Kiểm Sát Nhân Dân\",\r\n        alias: \"vien-kiem-sat-nhan-dan\",\r\n        keyword: \"Hiển thị thông tin, tin tức, quản lý tiếp nhận đơn khiếu nại, tố cáo, đề nghị, kiến nghị, phản ánh, yêu cầu.\",\r\n        shortDescription: \"Chúng tôi xây dựng hệ thống web hiển thị thông tin, tin tức, quản lý tiếp nhận đơn khiếu nại, tố cáo, đề nghị, kiến nghị, phản ánh, yêu cầu.\",\r\n        type: \"Dịch vụ web ứng dụng\",\r\n        logo: \"/media/images/logo/logo-vksndcm.gov.vn-removebg-preview.png\",\r\n        thumbnail: \"/media/images/projects/thumb/vien-kiem-sat-nhan-dan-ca-mau-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/vien-kiem-sat-nhan-dan-ca-mau.png\"],\r\n        originId: 9,\r\n        languageCode: \"vi\"\r\n    },\r\n    {\r\n        id: 11,\r\n        name: \"Pham Ngoc Thach College\",\r\n        alias: \"pham-ngoc-thach-college\",\r\n        keyword: \"Manage information about timetable, exam schedule, test scores, study results, manage library of images, videos, study materials.\",\r\n        shortDescription: \"We build a web system to manage information about timetables, exam schedules, test scores, study results, image library management, videos, learning materials.\",\r\n        type: \"Application Web Service\",\r\n        logo: \"/media/images/logo/logo-phamngocthachct.edu.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/pham-ngoc-thach-can-tho-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/pham-ngoc-thach-can-tho.png\", \"/media/images/projects/pham-ngoc-thach-can-tho-admin.png\"],\r\n        originId: 12,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 12,\r\n        name: \"Cao Đẳng Phạm Ngọc Thạch\",\r\n        alias: \"cao-dang-pham-ngoc-thach\",\r\n        keyword: \"Quản lý thông tin về thời khoá biểu, lịch thi, điểm thi, kết quả học tập, quản lý thư viện hình ảnh, video, tài liệu học tập.\",\r\n        shortDescription: \"Chúng tôi xây dựng hệ thống web quản lý thông tin về thời khoá biểu, lịch thi, điểm thi, kết quả học tập, quản lý thư viện hình ảnh, video, tài liệu học tập.\",\r\n        type: \"Dịch vụ web ứng dụng\",\r\n        logo: \"/media/images/logo/logo-phamngocthachct.edu.vn.png\",\r\n        thumbnail: \"/media/images/projects/thumb/pham-ngoc-thach-can-tho-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/pham-ngoc-thach-can-tho.png\", \"/media/images/projects/pham-ngoc-thach-can-tho-admin.png\"],\r\n        originId: 11,\r\n        languageCode: \"vi\"\r\n    },\r\n    {\r\n        id: 13,\r\n        name: \"Electronic invoice solution\",\r\n        alias: \"electronic-invoice-solution\",\r\n        keyword: \"Manage invoice templates, monthly, quarterly and yearly statistical reports\",\r\n        shortDescription: \"The electronic invoice solution is one of the solutions to be processed quickly, conveniently and accurately when it has been linked and coordinated with software units that have invoicing information such as: ERP, Software restaurant software - sales, Hospital, accounting software,...\",\r\n        type: \"Electronic invoice\",\r\n        logo: \"/media/images/logo/logo-minvoice.png\",\r\n        thumbnail: \"/media/images/projects/thumb/minvoice-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/hoa-don-dien-tu-dashboard.png\", \"/media/images/projects/hoa-don-dien-tu-login.png\", \"/media/images/projects/hoa-don-dien-tu-vat-01.png\"],\r\n        originId: 14,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 14,\r\n        name: \"Giải pháp hoá đơn điện tử\",\r\n        alias: \"giai-phap-hoa-don-dien-tu\",\r\n        keyword: \"Quản lý các mẫu hoá đơn, báo cáo thống kê theo tháng, quý, năm\",\r\n        shortDescription: \"Giải pháp hóa đơn điện tử là một trong những giải pháp được xử lý nhanh chóng, thuận tiện và chính xác khi đã liên kết và phối hợp với các đơn vị phần mềm có thông tin xuất hóa đơn như: ERP, Phần mềm nhà hàng – bán hàng, Bệnh viện, Phần mềm kế toán,...\",\r\n        type: \"Hóa đơn điện tử\",\r\n        logo: \"/media/images/logo/logo-minvoice.png\",\r\n        thumbnail: \"/media/images/projects/thumb/minvoice-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/hoa-don-dien-tu-dashboard.png\", \"/media/images/projects/hoa-don-dien-tu-login.png\", \"/media/images/projects/hoa-don-dien-tu-vat-01.png\"],\r\n        originId: 13,\r\n        languageCode: \"vi\"\r\n    },\r\n    {\r\n        id: 15,\r\n        name: \"Electronic Contract Solution\",\r\n        alias: \"electronic-contract-solution\",\r\n        keyword: \"Manage contract packages, transactions, statistical reports\",\r\n        shortDescription: \"The electronic contract solution is one of the solutions that can be implemented quickly, conveniently and securely when partners need to sign contracts with each other\",\r\n        type: \"Electronic Contract\",\r\n        logo: \"/media/images/logo/logo-mcontract.png\",\r\n        thumbnail: \"/media/images/projects/thumb/hop-dong-dien-tu-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/hop-dong-dien-tu-ds-donvi.png\",\"/media/images/projects/hop-dong-dien-tu-ds-baocao.png\",\"/media/images/projects/hop-dong-dien-tu-ds-giaodich.png\"],\r\n        originId: 16,\r\n        languageCode: \"en\"\r\n    },\r\n    {\r\n        id: 16,\r\n        name: \"Giải pháp hợp đồng điện tử\",\r\n        alias: \"giai-phap-hop-dong-dien-tu\",\r\n        keyword: \"Quản lý các gói hợp đồng, giao dịch, báo cáo thống kê\",\r\n        shortDescription: \"Giải pháp hợp đồng điện tử là một trong những giải pháp được thực hiện nhanh chóng, thuận tiện và bảo mật khi các đối tác cần ký kết hợp đồng với nhau\",\r\n        type: \"Hợp đồng điện tử\",\r\n        logo: \"/media/images/logo/logo-mcontract.png\",\r\n        thumbnail: \"/media/images/projects/thumb/hop-dong-dien-tu-thumb.png\",\r\n        background: \"/media/images/projects/property24-bg.png\",\r\n        images: [\"/media/images/projects/hop-dong-dien-tu-ds-donvi.png\",\"/media/images/projects/hop-dong-dien-tu-ds-baocao.png\",\"/media/images/projects/hop-dong-dien-tu-ds-giaodich.png\"],\r\n        originId: 15,\r\n        languageCode: \"vi\"\r\n    }\r\n];\r\n\r\nexport default projects;\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport {FC} from 'react'\r\n\r\nconst Dropdown2: FC = () => {\r\n  return (\r\n    <div\r\n      className='menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-bold w-200px'\r\n      data-kt-menu='true'\r\n    >\r\n      <div className='menu-item px-3'>\r\n        <div className='menu-content fs-6 text-dark fw-bolder px-3 py-4'>Quick Actions</div>\r\n      </div>\r\n\r\n      <div className='separator mb-3 opacity-75'></div>\r\n\r\n      <div className='menu-item px-3'>\r\n        <a href='#' className='menu-link px-3'>\r\n          New Ticket\r\n        </a>\r\n      </div>\r\n\r\n      <div className='menu-item px-3'>\r\n        <a href='#' className='menu-link px-3'>\r\n          New Customer\r\n        </a>\r\n      </div>\r\n\r\n      <div\r\n        className='menu-item px-3'\r\n        data-kt-menu-trigger='hover'\r\n        data-kt-menu-placement='right-start'\r\n        data-kt-menu-flip='left-start, top'\r\n      >\r\n        <a href='#' className='menu-link px-3'>\r\n          <span className='menu-title'>New Group</span>\r\n          <span className='menu-arrow'></span>\r\n        </a>\r\n\r\n        <div className='menu-sub menu-sub-dropdown w-175px py-4'>\r\n          <div className='menu-item px-3'>\r\n            <a href='#' className='menu-link px-3'>\r\n              Admin Group\r\n            </a>\r\n          </div>\r\n\r\n          <div className='menu-item px-3'>\r\n            <a href='#' className='menu-link px-3'>\r\n              Staff Group\r\n            </a>\r\n          </div>\r\n\r\n          <div className='menu-item px-3'>\r\n            <a href='#' className='menu-link px-3'>\r\n              Member Group\r\n            </a>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <div className='menu-item px-3'>\r\n        <a href='#' className='menu-link px-3'>\r\n          New Contact\r\n        </a>\r\n      </div>\r\n\r\n      <div className='separator mt-3 opacity-75'></div>\r\n\r\n      <div className='menu-item px-3'>\r\n        <div className='menu-content px-3 py-3'>\r\n          <a className='btn btn-primary  btn-sm px-4' href='#'>\r\n            Generate Reports\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {Dropdown2}\r\n","export interface IInsight {\r\n  uniquePostKey: string\r\n  id: number\r\n  type?: string\r\n  thumbnail: string\r\n  date: string\r\n  title?: string\r\n  name?: string\r\n  shortdDescription?: string\r\n  content?: string\r\n  languageCode?: string\r\n  keyword?: string\r\n  isHightlight?: boolean\r\n  refUniquePostKeys?: any\r\n}\r\n\r\nexport interface ISlider {\r\n  id: number\r\n  image: string\r\n  title: string\r\n  desc?: string\r\n}\r\n\r\nexport const Insights: IInsight[] = [\r\n  {\r\n    uniquePostKey: '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n    id: 1,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/slider-1.jpg',\r\n    date: '01/11/2021',\r\n    title: 'Công nghệ đã và đang thay đổi cách vận hành doanh nghiệp như thế nào?',\r\n    content:\r\n      '<i><h2>Những thay đổi về công nghệ trong cách vận hành doanh nghiệp</h2></i><p>Mặc dù không có nhiều thay đổi đáng chú ý trước đó nhưng trong suốt năm 2020, công nghệ đã phát triển, đột biến và thích nghi nhanh đến mức ai trong chúng ta cũng đều bị cuốn theo làn sóng tiến bộ ấy dù đã sẵn sàng hay chưa. Bởi vậy, công nghệ cũng đã thay đổi hoạt động kinh doanh và cách vận hành của nhiều doanh nghiệp, tác động trực tiếp đến: Cách giao tiếp và chia sẻ thông tin; Môi trường kinh doanh trên thiết bị di động; Remote Working; AI; Chuyển đổi số;...</p><h3>(1) Cách giao tiếp và chia sẻ thông tin</h3><p>Giao tiếp và chia sẻ thông tin rất quan trọng đối với doanh nghiệp. Với các ứng dụng: Slack, Zoom, Microsoft Teams hay các nền tảng truyền thông xã hội, chatbots,... công việc sẽ được thực hiện nhanh, dễ dàng và hiệu quả hơn.</p><p>Ngoài ra, nhờ khả năng theo dõi các cuộc trò chuyện giữa người mua - người bán cùng khả năng “đào sâu” thông tin khách hàng, công nghệ không chỉ giúp doanh nghiệp phân tích hành vi để từ đó thấu hiểu và nâng cao trải nghiệm cho khách hàng mà còn hỗ trợ doanh nghiệp tạo ra những thông điệp được “cá nhân hóa” dành riêng cho các chiến dịch truyền thông của mình.</p><h3>(2) Ưu tiên môi trường kinh doanh trên thiết bị di động</h3><p>Với sự nổi lên của Thế hệ Millennials, ngày càng có nhiều người sử dụng điện thoại để mua, bán, tìm kiếm các doanh nghiệp địa phương và chia sẻ kinh nghiệm bán lẻ của họ với bạn bè, người quen, khách hàng tiềm năng hay thậm chí là với những người lạ trên Instagram mỗi ngày.</p></p>Với sự nổi lên của Thế hệ Millennials, ngày càng có nhiều người sử dụng điện thoại để mua, bán, tìm kiếm các doanh nghiệp địa phương và chia sẻ kinh nghiệm bán lẻ của họ với bạn bè, người quen, khách hàng tiềm năng hay thậm chí là với những người lạ trên Instagram mỗi ngày.</p><h3>(3) Làm việc từ xa</h3><p>Covid-19 đã thúc đẩy mô hình “work from home”, vì vậy các doanh nghiệp phải nhanh chóng đảm bảo nhân viên có quyền truy cập vào công nghệ và cơ sở hạ tầng phù hợp để thuận lợi xử lý công việc từ xa cùng nhau.</p><p>Chia sẻ về vấn đề này, Sara Sutton - Người sáng lập và CEO của FlexJobs, cho biết: “Các công ty thuộc mọi loại hình (tư nhân, công cộng, phi lợi nhuận) hoặc công ty khởi nghiệp đã nhận ra những lợi ích mấu chốt của việc tích hợp làm việc từ xa vào chiến lược kinh doanh của họ nhờ sự hỗ trợ của công nghệ. Đặc biệt, đối với vấn đề nhân sự, từ những nhân viên trong một thị trường lao động eo hẹp, công nghệ đã giúp chúng ta hoàn toàn có thể kỳ vọng về nguồn nhân lực chất lượng hơn nữa trong tương lai”.</p><h3>(4) Ứng dụng AI</h3><p>Ứng dụng AI đã thay đổi quy trình kinh doanh trong hầu hết mọi ngành, trở thành một chiến lược cấp thiết đối với những doanh nghiệp muốn duy trì lợi thế cạnh tranh. Có rất nhiều thứ mà AI có thể làm từ việc xử lý nhanh chóng một lượng lớn dữ liệu đến bảo mật, CRM và thậm chí cả lĩnh vực tài chính và bất động sản, vì vậy AI sẽ giúp giảm bớt khối lượng công việc của con người, đưa hiệu suất làm việc tăng cao, duy trì điều kiện thuận lợi cho quá trình chuyển đổi số.</p><h3>(5) Chuyển đổi số</h3><p>Chuyển đổi số đang diễn ra với tốc độ nhanh chóng và góp phần lớn vào quá trình thúc đẩy sự thay đổi cơ bản về cách tổ chức hoạt động, tối ưu hóa nguồn lực nội bộ và mang lại giá trị cho khách hàng trong các doanh nghiệp.</p><p>Phân tích sự thay đổi trong cách vận hành doanh nghiệp nhờ hỗ trợ của công nghệ, chúng ta có một số những giải pháp công nghệ đã được tung ra trên thị trường tiêu biểu như: Ứng dụng văn phòng ảo Gather Town; Game dành riêng cho các lập trình viên do Microsoft và Marvel hợp tác triển khai;... Với Gather Town, đây là ứng dụng cho phép người dùng thiết lập không gian làm việc trực tuyến phù hợp với nhu cầu và sở thích cá nhân, chúng ta có thể chọn tạo hình đại diện cho nhân vật của mình, tự do di chuyển, đến thăm các văn phòng ảo khác và tương tác với các vật dụng như tivi, loa phát thanh tương tự ngoài đời thực. Đồng thời, Gather Town cũng là một ứng dụng họp trực tuyến không chỉ đảm bảo các tính năng cơ bản (gọi video, chia sẻ màn hình, bảng ghi chú,...) mà còn có nhiều tính năng đặc biệt khác như: Người dùng có thể vào không gian riêng và chọn chế độ không gián đoạn (Quiet Mode) khi muốn tập trung làm việc; Có nhiều tính năng giải trí vui nhộn và các tựa boardgame đình đám để các nhóm chơi cùng nhau sau thời gian làm việc mệt mỏi; Trưởng nhóm có thể yêu cầu thành viên hiển thị “online” và bật mic để luôn sẵn sàng trao đổi công việc;... Vì vậy, chỉ sau hơn một năm ra mắt, Gather Town đã thu hút được hơn 4 triệu người dùng, trở thành một lựa chọn mới cho các sự kiện trực tuyến thay vì Zoom hay Google Meet như hiện nay.</p><p>Với trò chơi được Microsoft và Marvel hợp tác triển khai để “đào tạo” các lập trình viên tài năng, các bạn có thể tìm hiểu thêm tại: “<a href=\"https://www.marketing-interactive.com/microsoft-and-marvel-play-on-shang-chi-hype-to-train-fans-coding\" target=\"blank\">Microsoft and Marvel play on Shang-Chi hype to train fans coding - Ong Li Ping</a>”.</p><h2>Kết luận:</h2><p>Các tác động của công nghệ không chỉ giúp doanh nghiệp cải thiện hiệu quả trong quy trình làm việc mà còn mở ra cơ hội tuyển dụng được nguồn nhân sự chất lượng hơn nhờ tính linh hoạt trong cách thức chia sẻ, xử lý công việc cùng nhau. Và trong tương lai, công nghệ chắc chắn vẫn sẽ tiếp tục là yếu tố có ảnh hưởng lớn đến cách vận hành doanh nghiệp, vì vậy, hãy luôn cập nhật kịp thời để chủ động thích nghi, tránh trường hợp bị dồn vào chân tường, buộc phải thay đổi.</p><h4 style=\\'font-style: italic;\\'>Tác giả: Việt Tương Tác - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n    id: 2,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/slider-1.jpg',\r\n    date: '01/11/2021',\r\n    title: 'How has technology changed the way businesses are run?',\r\n    content:\r\n      '<i><h2>Technological changes in the way businesses are run</h2></i><p>Technological changes in the way businesses are run</p><h3>(1) How to communicate and share information</h3><p>Communication and sharing information is important for businesses. With applications: Slack, Zoom, Microsoft Teams or social media platforms, chatbots,... The work will be done faster, easier and more efficiently. </p><p>In addition, thanks to the ability to track conversations between buyers and sellers and the ability to \"deepen\" customer information, technology not only helps businesses analyze behavior to understand and enhance the customer experience, but also supports businesses to create \"personalized\" messages dedicated to their communication campaigns.</p><h3>(2) Prioritizing the business environment on mobile devices</h3><p>With the rise of Millennials, more and more people are using their phones to buy, sell, search for local businesses, and share their retail experiences with friends, acquaintances, prospects, or even strangers on Instagram every day.</p><p>Understanding this, the technology that has been applied increases the ease of keeping a human connection. We can communicate the news to colleagues, employees via text/video or immediately send promotional emails to the right customers when they are shopping at nearby stores thanks to the development of technology that has been combined almost seamlessly with communication software to help us gather information right here. Real time through a \"hyper-real\" website. </p><h3>(3) Working remotely</h3><p>Covid-19 has promoted a \"work from home\" model, so businesses must quickly ensure employees have access to the right technology and infrastructure to facilitate remote work handling together.</p><p>Sara Sutton, founder and CEO of FlexJobs, said: \"Companies of all types (private, public, non-profit) or startups have realized the key benefits of integrating remote work into their business strategy thanks to the support of technology. In particular, when it comes to human resources, from employees in a tight labor market, technology has made it possible to fully expect more quality human resources in the future.\"</p><h3>(4) AI application</h3><p>AI application has changed business processes in almost every industry, becoming an urgent strategy for businesses that want to maintain a competitive advantage. There are many things that AI can do from rapidly processing large amounts of data to security, CRM and even the financial and real estate sectors, so AI will help reduce human workloads, bringing productivity to soaring,  maintain favorable conditions for digital transformation.</p><h3>(5) Digital transformation</h3><p>Digital transformation is happening at a rapid pace and contributes greatly to the process of driving fundamental change in the way organizations operate, optimizing internal resources, and delivering value to customers in businesses.</p><p>Analyzing the change in the way businesses operate thanks to the support of technology, we have a number of technology solutions that have been launched in the typical market such as: Gather Town virtual office application; The game is exclusively for developers developed by Microsoft and Marvel; With Gather Town, this is an application that allows users to set up online workspaces to suit their needs and personal preferences, we can choose to create avatars for our characters, freely move, visit other virtual offices and interact with items such as televisions,  The loudspeaker is similar in real life. At the same time, Gather Town is also an online meeting application that not only ensures the basic features (video calling, screen sharing, note board,...) but also many other special features such as: Users can enter their own space and choose a quiet mode when they want to focus on work; There are many fun entertainment features and popular boardgame titles for teams to play together after a tiring working time; Team leader can ask members to display \"online\" and turn on the mic to always be ready to exchange jobs; So, after just over a year of launch, Gather Town has attracted more than 4 million users, becoming a new choice for online events instead of Zoom or Google Meet as it is today. </p><p>Conclude: “<a href=\\'https://www.marketing-interactive.com/microsoft-and-marvel-play-on-shang-chi-hype-to-train-fans-coding\\' target=\\'blank\\'>Microsoft and Marvel play on Shang-Chi hype to train fans coding - Ong Li Ping</a>”.</p><h2>Conclude:</h2><p>The impact of technology not only helps businesses improve efficiency in the workflow but also opens up opportunities to recruit more quality human resources thanks to the flexibility in the way they share and handle work together. And in the future, technology will definitely continue to be a factor that has a great influence on how businesses operate, so always update in time to proactively adapt, avoid the case of being cornered, forced to change.</p><h4 style=\\'font-style: italic;\\'>Author: Việt Tương Tác - spiderum</h4>',\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n    id: 3,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/ky-nguyen-doi-moi-1.jpg',\r\n    date: '29/05/2021',\r\n    title: 'Kỷ nguyên đổi mới và ngành IT Việt Nam hiện tại',\r\n    content:\r\n      \"<i><h2>Mở đầu Bài viết này dành cho các bạn đang tìm hiểu về ngành IT, có ý muốn theo đuổi sự nghiệp trong tương lai. Cung cấp cho bạn...</h2></i><img src='/media/images/insights/ky-nguyen-doi-moi-1.jpg'/><h3>Mở đầu</h3><p>Bài viết này dành cho các bạn đang tìm hiểu về ngành IT, có ý muốn theo đuổi sự nghiệp trong tương lai. Cung cấp cho bạn cái nhìn tổng quan nhất về ngành IT tại Việt Nam cũng như các vị trí công việc, xu hướng chung, mức lương và con đường sự nghiệp tương lai.</p><p>Theo báo cáo thị trường năm 2020, IT vẫn đang là một trong những ngành nghề đang phát triển mạnh. Mọi người thường biết tới IT là ngành nghề “hái ra tiền” hay công việc nhẹ nhàng nhưng lương lại cao ngất. Liệu điều đấy có thật sự đúng? Hãy cùng tìm hiểu ngay sau đây.</p><h3>IT – Là gì</h3><p> Information Technology – Công nghệ thông tin. Hiểu một cách đơn giản, IT là ngành sử dụng máy tính và phần mềm máy tính để chuyển đổi, lưu trữ, bảo vệ, xử lý, truyền và thu thập thông tin. Mục đích của ngành IT là phát triển khả năng sửa chữa, tạo mới và sử dụng hệ thống các thiết bị và máy tính bao gồm phần cứng, phần mềm để cung cấp các giải pháp công nghệ xử lý thông tin, xử lý yêu cầu của một cá nhân hay tổ chức.</p><h3>IT – Công việc làm gì</h3><p>Ngành IT là một nhóm những ngành nghề, vị trí công việc đa dạng. Còn tùy thuộc vào mô hình công ty mà những vị trí trong thực tế cũng có sự chồng chéo lẫn nhau. Tuy nhiên cũng có thể nói tới những vị trí và công việc điển hình sau:</p><h4>1. Kỹ sư phần mềm (Software Engineer)</h4><p>  1.1 Web Developer: Frontend, Backend, Fullstack Developer</p><p>  1.2 Mobile Developer: Android, IOS, React Native, Flutter Developer</p><p>  1.3 Software Business Analyst (BA)</p><p>  1.4 Software Architect</p><p>  1.5 AI Engineer</p><p>  1.6 Embedded Software Engineer</p><p>  1.7 Game Developer</p><h4>2. BẢO ĐẢM CHẤT LƯỢNG (QUALITY ASSURANCE)</h4><p>  2.1 QA Engineer</p><p>  2.2 QC Engineer</p><p>  2.3 Software Tester</p><h4>3. KẾT NỐI (COMMUNICATOR)</h4><p>  3.1 Bridge Software Engineer (BrSE)</p><p>  3.2 IT Comtor</p><h4>4. QUẢN LÝ (MANAGEMENT)</h4><p>  4.1 Project Manager (PM)</p><p>  4.2 Product OwnerScrum Master</p><p>  4.3 Chief Technology Officer (CTO)</p><p>  4.4 Team LeaderTechnical Leader</p><h4>5. HẠ TẦNG (SYSTEM INFRASTRUCTURE)</h4><p>  5.1 System Administrator</p><p>  5.2 DevOpsNetwork Engineer</p><h4>6. BẢO MẬT (CYBERSECURITY)</h4><p>  6.1 Security Analyst</p><p>  6.2 Security Engineer</p><p>  6.3 Security Architect</p><p>  6.4 Penetration Tester (Ethical Hacker)</p><h4>7. THIẾT KẾ (DESIGN)</h4><p>  7.1 UI Designer</p><p>  7.2 UX Designer</p><p>  7.3 Game Artist</p><p>  7.4 Game Designer</p><p>  7.5 Graphic Designer</p><h4>8. CÁC VỊ TRÍ KHÁC</h4><p> 8.1 IT Helpdesk</p><p>  8.2 Hardware Engineer</p><p>  Công việc trong ngành IT đa dạng là thế nhưng vẫn không ít người suy nghĩ nó thật khô khan, tẻ nhạt. Ngành IT vẫn có những công việc đòi hỏi tính sáng tạo, tỉ mỉ cao như desgin hay yêu cầu cao về kỹ năng lãnh đạo và giao tiếp con người và vân vân... Mình sẽ phân tích sâu hơn về những vị trí công việc này vào những bài viết sau.</p><h3>IT – Tình hình tại Việt Nam</h3><h4>1. Xu hướng chung</h4><p>Dịch vụ có ứng dụng CNTT ở Việt Nam vẫn đang phát triển không ngừng, chưa có dấu hiệu dừng lại. Hàng năm vẫn có hàng trăm dự án thuộc ngành ảnh hưởng trực tiếp tới cuộc sống con người, thay đổi cách mọi người sống và làm việc. Dự đoán những năm tiếp theo, IT vẫn là một ngành dẫn đầu mọi xu thế xã hội. Các dịch vụ vẫn đang phát triển tại Việt Nam có thể kể đến như:</p><p>Thương mại điện tử (E-Commerce) : Sendo, Lazada, Shopee, Tiki,...</p><p>Công nghệ tài chính: Momo, Moca, ViettelPay, AirPay,...</p><p>Dịch vụ vận chuyển: Grab, Go-Viet, Be, Now,...</p><p>Business Process Outsourcing (BPO): FPT, Expertrans, Mắt Bão, ...</p><p>Vận chuyển hàng hoá: Giaohangnhanh, Giaohangtietkiem, Grab, ...</p><p>Xuất bản phần mềm: Fsoft, Tinh Vân, KMS, ...</p><h4>2. Tình hình nhân lực</h4><p>Những năm gần đây, nhân lực ngành IT đang thu hút rất nhiều bạn trẻ quan tâm bởi ngành có cơ hội việc làm tốt và mức lương thu nhập nhìn chung có nhỉnh hơn so với phần còn lại của thị trường.</p><p>Nhu cầu tuyển dụng trong ngành CNTT năm 2019 tăng gần 2,5 lần so với năm 2018, dự báo năm 2020 sẽ tiếp tục tăng (số lượng nhân sự tuyển dụng cao gấp 1,6 lần năm 2019). Theo các số liệu về thị trường CNTT, năm 2020, Việt Nam cần hơn 400.000 nhân lực và dự kiến năm 2021 là 500.000. Hiện tại, mỗi năm các cơ sở đào tạo ra khoảng 50.000 nhân sự cho ngành, nhưng chỉ 30% số đó đáp ứng đủ kỳ vọng của doanh nghiệp. Bởi lẽ các bạn trẻ tốt nghiệp đại học vẫn chưa có đủ cho mình các kỹ năng mềm: teamwork, giao tiếp, quản lý thời gian,... Kỹ năng chuyên môn vẫn đang ở mức nền tảng, chưa phải là thứ mà doanh nghiệp đang cần. Do đó thị trường nhân lực ngành IT đang rơi vào tình trạng “cung không đủ cầu”. Điều đó cũng có nghĩa sân chơi chỉ dành cho người có trí hướng học hỏi, không ngừng cải thiện kỹ năng từ mềm cho tới chuyên môn.</p><h4>3. Mức lương</h4><p>Mức lương được trả theo năng lực và số năm kinh nghiệm mà bạn có đồng thời phản ánh giá trị mà bạn mang lại cho công ty. Sân chơi này công bằng cho những người có năng lực thật sự. Phía dưới là mức lương trung bình các công ty trả cho các vị trí bạn đảm nhiệm, mang tính chất tham khảo.</p><img src='/media/images/insights/ky-nguyen-doi-moi-2.png'/><p><p/><h3>IT - Con đường phát triển</h3><h4>1. Làm việc tại công ty - Fulltime</h4><p>Bạn sẽ làm việc toàn thời gian tại một công ty và nhận mức lương với vị trí của bạn. Hầu hết con đường là chọn một công ty để gắn bó lâu dài và thăng tiến. Đôi khi cũng có thể nhảy việc, đổi công ty để được mức lương, vị trí cao hơn và khi đến tuổi bạn sẽ nghỉ hưu. Khi theo con đường này, bạn sẽ được nhận một công việc ổn định, sáng đi chiều về cuối tháng lấy lương. Ngoài ra bạn còn được hưởng nhiều ưu đãi từ công ty, bạn cũng có thể chọn công ty ở Việt Nam hoặc tìm việc ở những công ty nước ngoài, làm việc tại nước ngoài cũng hết sức đơn giản. Con đường này khá phổ biến và gần như là mặc định cho mọi lập trình viên.</p><p> Nếu ưa phần mạo hiểm và  hơn, bạn có thể vào làm việc tại những công ty startup. Ở đó bạn sẽ không học được những quy trình làm việc chặt chẽ như ở những công ty lớn nhưng bạn sẽ được tiếp xúc với mọi phần của công đoạn tạo ra một sản phẩm, từ lên ý tưởng cho tới quảng cáo, tiếp thị đến tay người dùng. Bạn sẽ học được nhiều hơn nhưng áp lực cũng cũng thế mà nhiều thêm.</p><h4>2. Làm việc tự do – Freelancer</h4><p>Nếu bạn ưa thích sự tự do, không gò bó thời gian làm việc thì lựa chọn này cũng rất đáng cân nhắc. Freelancer – lính đánh thuê, thuê đâu đánh đó. Công việc của bạn là tự tìm kiếm khách hàng cho mình, giúp họ làm ra sản phẩm mong muốn. Khách hàng cũng có thể là những công ty phần mềm cần thuê thêm nhân lực. Đánh đổi cho sự tự do về thời gian đó là cả một quá trình xây dựng uy tín bản thân, kĩ năng chuyên môn thuộc hàng “biết tuốt” thì mới có cơ hội phát triển. Từ con đường làm freelancer cho tới con đường startup dưới đây cũng thật gần.</p><h4>3. Khởi nghiệp - Startup</h4><p>Startup các công ty công nghệ ở Việt Nam cũng đang là xu hướng của các bạn trẻ hiện nay. Tự tạo một công ty mang sắc màu, sứ mạng của bản thân, mang lại giá trị cho cộng đồng. Tuy nhiên startup có cả trăm câu chuyện thành công nhưng cũng có hàng ngàn câu chuyện thất bại của rất rất nhiều người. Khởi nghiệp thành công cần nhiều kĩ năng giỏi từ chuyên môn cho tới quản lý, giao tiếp,...Không nhiều người có thể chuẩn bị tốt được những kĩ năng đấy và cho dù có vậy, họ cũng sẽ phải đối mặt với những áp lực từ công việc, tài chính, quản lý nhân sự,... và vô vàn những điều cần phải xử lý, làm việc không quản ngày đêm là hiển nhiên. Vì thế các bạn trẻ không chuẩn bị tốt mà lao vào khởi nghiệp thì chỉ có nước đi tong.</p><h3>IT – Giấc mơ có dành cho bạn</h3><p>Để có thể theo ngành IT, đam mê là điều kiện tiên quyết bạn cần phải có. Niềm  đam mê, thích thú với những công nghệ mới, tò mò về thế giới số sẽ giúp bạn học những kiến thức mới với sự say mê thật sự, kiến thức vì thế cũng dễ tiếp thu, nó còn giúp bạn kiên trì học hỏi từng ngày, không bỏ cuộc giữa chừng bởi khi bạn dừng học, kiến thức sẽ nhanh bị lỗi thời, tương lai không xa bạn sẽ bị đào thải khỏi thị trường. Xin đừng nhầm lẫn giữa “Ấn tượng” và “Đam mê”. Nhiều bạn trẻ có những câu hỏi dạng như “Em có đam mê nhưng không biết gì về IT thì có theo được không?” Lúc này bạn chỉ bị ấn tượng và thích thú về những gì IT đem lại, không phải đam mê. Tai hại biết bao với những bạn theo IT chỉ vì thấy nó hot, mọi người ồ ạt học theo nhưng rồi chỉ còn phân nửa có thể trụ lại. Vậy nên, hãy học thử những kiến thức về ngành trong vòng 3 tháng, nếu sau 3 tháng này bạn vẫn giữ cho mình sự say mê thích thú thì mạnh dạn dấn thân vào ngành nhé.</p><h3>Một số câu hỏi thường gặp:</h3><h4>1. Bằng cấp có quan trọng không? </h4><p>Bằng đại học nói chung chỉ có giá trị chứng minh với nhà tuyển dụng bạn đã có học, có nỗ lực kiên trì để hoàn thành chương trình đại học và sẵn sàng kiếm một công việc fulltime. Vậy thôi, điều quyết định bạn có được tuyển dụng hay không phụ thuộc vào năng lực của bản thân.</p><h4>2. Không giỏi Toán có học IT được không?</h4><p>IT nói riêng và cũng như các ngành khoa học khác nói chung, tất cả đều dùng đến toán. Tuy nhiên mức độ sử dụng cũng mỗi khác. Làm việc trong ngành phần mềm, toán đa phần là cộng trừ nhân chia nhưng khi tới các ngành nặng về học thuật như AI, Machine Learning ,... thì lại cần rất rất nhiều kiến thức về toán</p><h4>3. Nên học IT ở đâu</h4><p>Lựa chọn đầu tiên bạn nên nghĩ tới là trường đại học. Kiến thức tại trường sẽ giúp bạn có nền tảng vững chắc sau này để tự học những công nghệ mới. Tiếp theo là các trung tâm dạy nghề và các khóa học online. Kiến thức được giảng dạy ở đây chủ yếu phục vụ nhu cầu TRƯỚC MẮT của doanh nghiệp, học xong có thể đi làm ngay</p><h4>4. Điều gì là quan trọng nhất khi học về IT</h4><p>Khi học IT, kĩ năng quan trọng nhất chính là giải quyết vấn đề - Problem Solving. Suy cho cùng, ngôn ngữ lập trình chỉ là công cụ, kĩ năng làm chủ công cụ mới quan trọng hơn cả.</p><h5>5. Học trái ngành có thể theo học IT?</h5><p>Có, bạn hoàn toàn có thể. Những kiến thức về ngành đều có sẵn ở trên mạng. Các khóa học online, các trung tâm giảng dạy chỉ cần bạn kiên trì học tập, khi học xong bạn hoàn toàn đủ sức để đi làm.</p><h3>KẾT</h3><p>Ngành IT vẫn đang là một ngành mới tại Việt Nam, có nhiều sự thay đổi qua các năm và dĩ nhiên thay đổi để phát triển hơn. Qua bài viết, hi vọng bạn sẽ có cho mình những hiểu biết sơ bộ về ngành IT cũng như lựa chọn cho mình con đường phù hợp với năng lực, sở thích của bản thân trong tương lai. Chúc các bạn thành công.</p><p>Các số liệu được tổng hợp từ: <a href='https://topdev.vn/page/bao-cao-it-viet-nam' target='blank'>Báo cáo thị trường IT 2020</a></p><h4 style='font-style: italic;'>Tác giả: Top Tips For Developer - spiderum</h4>\",\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n    id: 4,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/ky-nguyen-doi-moi-1.jpg',\r\n    date: '29/05/2021',\r\n    title: \"The current era of innovation and Vietnam's IT industry\",\r\n    content:\r\n      \"<i><h2>At the beginning of this article for those who are learning about IT, wishing to pursue a career in the future. Give it to you...</i></h2><img src='/media/images/insights/ky-nguyen-doi-moi-1.jpg'/><h3>Begin</h3><p>This article is for those who are learning about IT, intending to pursue a career in the future. Give you the best overview of the IT industry in Vietnam as well as job positions, general trends, salaries and future career paths.</p><p>According to the 2020 market report, IT is still one of the thriving industries. People often know it as a 'money-making' profession or light work but high salaries. Is that really true? Let's find out later.</p><h3>IT - What is it</h3><p> Information Technology - Information Technology. Simply put, IT is the industry that uses computers and computer software to convert, store, protect, process, transmit and collect information. The purpose of the IT industry is to develop the ability to repair, create and use systems of devices and computers including hardware and software to provide information processing technology solutions, processing requests of an individual or organization.</p><h3>IT - What to do</h3><p>It industry is a diverse group of professions and job positions. Depending on the company model, the positions in practice also overlap. However, it can also be said that the following typical positions and jobs:</p><h4>1. Software Engineer</h4><p>  1.1 Web Developer: Frontend, Backend, Fullstack Developer</p><p>  1.2 Mobile Developer: Android, IOS, React Native, Flutter Developer</p><p>  1.3 Software Business Analyst (BA)</p><p>  1.4 Software Architect</p><p>  1.5 AI Engineer</p><p>  1.6 Embedded Software Engineer</p><p>  1.7 Game Developer</p><h4>2. QUALITY ASSURANCE</h4><p>  2.1 QA Engineer</p><p>  2.2 QC Engineer</p><p>  2.3 Software Tester</p><h4>3. CONNECTION  (COMMUNICATOR)</h4><p>  3.1  Bridge Software Engineer (BrSE)</p><p>  3.2 IT Comtor</p><h4>4. MANAGEMENT</h4><p>  4.1 Project Manager (PM)</p><p>  4.2 Product OwnerScrum Master</p><p>  4.3 Chief Technology Officer (CTO)</p><p>  4.4 Team LeaderTechnical Leader</p><h4>5. SYSTEM INFRASTRUCTURE</h4><p>  5.1 System Administrator</p><p>  5.2 DevOpsNetwork Engineer</p><h4>6. CYBERSECURITY</h4><p>  6.1 Security Analyst</p><p>  6.2 Security Engineer</p><p>  6.3 Security Architect</p><p>  6.4 Penetration Tester (Ethical Hacker)</p><h4>7. DESIGN</h4><p>  7.1 UI Designer</p><p>  7.2 UX Designer</p><p>  7.3 Game Artist</p><p>  7.4 Game Designer</p><p>  7.5 Graphic Designer</p><h4>8. OTHER POSITIONS</h4><p>  8.1 IT Helpdesk</p><p>  8.2 Hardware Engineer</p><p>  The work in the IT industry is diverse but still many people think it is dry, tedious. The IT industry still has jobs that require creativity, highly meticulous like desgin or high requirements for leadership and human communication skills and so on. I will analyze these positions in the following articles.</p><h3>IT - The situation in Vietnam</h3><h4>1. General trends</h4><p>It application services in Vietnam are still growing constantly, showing no signs of stopping. Every year, hundreds of industry projects directly impact people's lives, changing the way people live and work. Predicting the next years, IT will remain a leading industry in all social trends. Services that are still developing in Vietnam can be mentioned as:</p><p>E-Commerce: Sendo, Lazada, Shopee, Tiki,...</p><p>Financial technology: Momo, Moca, ViettelPay, AirPay,...</p><p>Shipping services: Grab, Go-Viet, Be, Now,...</p><p>Business Process Outsourcing (BPO): FPT, Expertrans, Mắt Bão, ...</p><p>Freight: Giaohangnhanh, Giaohangtietkiem, Grab, ...</p><p>Software publishing: Fsoft, Tinh Van, KMS, ...</p><h4>2. Human resource situation</h4><p>In recent years, IT workers are attracting a lot of young people interested because the industry has good job opportunities and the overall income is slightly higher than the rest of the market.</p><p>Recruitment demand in the IT industry in 2019 increased by nearly 2.5 times compared to 2018, forecasting that 2020 will continue to increase (the number of recruits is 1.6 times higher than in 2019). According to IT market data, in 2020, Vietnam needs more than 400,000 human resources and is expected to be 500,000 in 2021. Currently, each year the institutions produce about 50,000 employees for the industry, but only 30% of them meet the expectations of the business. Because young college graduates still do not have enough soft skills: teamwork, communication, time management,... Professional skills are still at the foundation level, not something that businesses need. Therefore, the IT human resources market is in a state of 'insufficient supply and demand'. It also means that the playground is only for people with learning orientation, constantly improving skills from soft to professional.</p><h4>3. Salary</h4><p>The salary paid according to the competence and the number of years of experience you have simultaneously reflects the value you bring to the company. This playground is fair to those who have real competence. Below is the average salary companies pay for the positions you take, which are of a reference nature.</p><img src='/media/images/insights/ky-nguyen-doi-moi-2.png'/><p></p><h3>IT - The Path of Development</h3><h4>1. Working at the company  - Fulltime</h4><p>You will work full-time at a company and receive a salary with your position. Most of the way is to choose a company for long-term engagement and promotion. Sometimes you can jump jobs, change jobs for higher salaries, positions, and when you reach the age you'll retire. When following this path, you will be given a stable job, in the morning to the end of the month to get a salary. In addition, you also enjoy many incentives from the company, you can also choose a company in Vietnam or find a job in foreign companies, working abroad is also very simple. This path is quite common and almost the default for every programmer.</p><p> If you prefer the risk and more, you can work at startups. There you will not learn the same rigorous workflows as in large companies, but you will be exposed to every part of the process of creating a product, from ideation to advertising, marketing to users. You'll learn more, but so will the pressure.</p><h4>2. Freelancer</h4><p>If you prefer freedom, not limited working time, this option is also worth considering. Freelancer - mercenaries, hire somewhere to fight. Your job is to find customers for yourself, helping them make the desired product. Customers may also be software companies that need to hire more people. The trade-off for freedom of time is a process of building self-reputation, professional skills in the 'know all' to have the opportunity to develop. From the freelancer to the startup path below is also very close.</p><h4>3. Start-up - Startup</h4><p>Start-ups of technology companies in Vietnam are also a trend of young people today. Create a company with its own colors, mission, bringing value to the community. However, startups have hundreds of success stories but there are also thousands of failure stories of a lot of people. Successful start-ups require many good skills from expertise to management, communication,... Not many people are able to prepare those skills well and even so, they will face pressures from work, finance, human resource management,... And countless things that need to be handled, working without managing day and night is obvious. Therefore, young people are not well prepared but rushing to start a business, only tong move.</p><h3>IT – is a dream for you.</h3><p>To be able to follow the IT industry, passion is a prerequisite you need to have. Passion, interest in new technologies, curiosity about the digital world will help you learn new knowledge with real passion, knowledge is also receptive, it also helps you persevere to learn every day, not give up in the middle because when you stop studying,  Knowledge will quickly become obsolete, in the not too distant future you will be eliminated from the market. Please don't confuse 'impression' and 'passion.' Many young people have questions like 'Do you have a passion but do not know anything about IT?' At this point you are just impressed and interested in what IT has to offer, not passion. How harmful it is for those who follow IT just because it is hot, people massively learn but then only half can stay. So, try the knowledge of the industry within 3 months, if after these 3 months you still keep yourself passionate, boldly enter the industry.</p><h3>Some frequently asked questions:</h3><h4>1. Does a degree matter?</h4><p>A college degree is generally only valid to prove to an employer you have studied, have a persistent effort to complete an undergraduate program, and are willing to get a full-time job. What determines whether or not you are hired depends on your abilities.</p><h4>2. Can you not be good at math, do you study IT?</h4><p>It in particular and, like other sciences in general, all use mathematics. However, the level of use is also different. Working in software, mathematics is mostly plus and minus multiplied but when coming to academic-heavy industries such as AI, Machine Learning ,... You need a lot of knowledge about math.</p><h4>3. Where to study IT</h4><p>The first option you should think about is college. Knowledge at the school will help you have a solid foundation later on to learn new technologies on your own. This is followed by vocational centers and online courses. The knowledge taught here mainly serves the immediate needs of businesses, after finishing school can go to work immediately.</p><h4>4. What is most important when learning about IT</h4><p>When learning IT, the most important skill is problem solving. After all, programming language is just a tool, the skill of mastering the new tool is more important.</p><h5>5. Can you study IT?</h5><p>Yes, you absolutely can. Knowledge of the industry is available online. Online courses, teaching centers just need you to persevere in learning, when you finish studying you are fully qualified to go to work.</p><h3>PLAIT</h3><p>It industry is still a new industry in Vietnam, there are many changes over the years and of course change to develop more. Through the article, hopefully you will have a preliminary understanding of the IT industry as well as choose for yourself the right path for your abilities and interests in the future. I wish you success.</p><p>Figures compiled from: <a href='https://topdev.vn/page/bao-cao-it-viet-nam' target='blank'>IT Market Report 2020</a></p><h4 style='font-style: italic;'>Author: Top Tips For Developer - spiderum</h4>\",\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n    id: 5,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/top-trends-fas-1.jpeg',\r\n    date: '13/11/2021',\r\n    title: 'Top xu hướng trọng điểm trong công nghệ thời trang',\r\n    content:\r\n      '<i><h2>Gần cuối năm 2019 đến hiện tại ngày hôm nay, đại dịch đã đến và tàn phá khóc lịch trên toàn cầu, cướp đi rất nhiều tính mạng con người, và dẫn đến cuộc khủng hoảng kinh tế toàn cầu nói chung và Việt Nam nói chung.</h2></i><p>Gần cuối năm 2019 đến hiện tại ngày hôm nay, đại dịch đã đến và tàn phá khóc lịch trên toàn cầu, cướp đi rất nhiều tính mạng con người, và dẫn đến cuộc khủng hoảng kinh tế toàn cầu nói chung và Việt Nam nói riêng. Và <a href=\"https://dimensio.vn/gioi-thieu/\" target=\"blank\">Dimensio</a> cũng không thể tránh khỏi những sự kiện thiên nga đen này. Nhưng nó đem đến cho chúng ta nhiều bài học quý giá để đúc kết được kinh nghiệm. Đầu năm 2021 đến hiện nay, việc đưa công nghệ vào vận hành đã tăng lên trong ngành <b>thời trang gắn kết với công nghệ</b>. Những công nghệ này ngày càng được nhà bán lẻ lựa chọn làm mũi nhọn, giúp các nhà cung cấp khẳng định được sự uy tín, minh bạch, tạo ra 1 môi trường mua sắm lành mạnh và an toàn cho khách hàng giúp. Những lựa chọn ưu tiên thay thế việc mua sắm trực tiếp:  mua sắm trực tuyến, thanh toán di động, đề xuất dựa trên AI, gương dùng thử ảo và quét cơ thể 3D sẽ đem lại tác động lâu dài đến trải nghiệm mua sắm, cả trực tuyến và ngoại tuyến, và sẽ trở thành một phần thiết yếu của ngành bán lẻ trong thời gian tới.</p><h2 style=\"text-align: center;\">Các xu hướng mũi nhọn trong công nghệ thời trang</h2><h3>Kỹ Thuật Digital Fit</h3><p>Shopping áo quần trực tuyến sẽ có 1 số cản trả vì  lý do như kích cỡ, màu sắc, cảm giác, v.v. Để tối ưu hóa giảm khoảng cách giữa trải nghiệm mua sắm trực tuyến và ngoại tuyến, những nhà buôn bán bây giờ đang tận dụng việc tiêu dùng khoa học định cỡ để giúp người dùng để tìm áo quần vừa vặn vẹo thích hợp với họ lúc mua tìm trực tuyến. Công nghệ này đã góp phần quan trọng làm giảm tỷ lệ trả hàng của những sản phẩm trên thương mại điện tử do vấn đề định cỡ vốn là 1 trong các thách thức to nhất đối mang những nhà bán buôn.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/top-trends-fas-1.jpeg\" /></div><p><b>Digital Fit</b> đang được dùng dưới dạng máy quét thân thể bằng điện thoại di động. Máy quét cơ thể 3D là áp dụng dựa trên trang bị di động được tích hợp trong trang web và ứng dụng di động của những nhà bán lẽ. Công nghệ này cho phép khách hàng thử quần áo trên ảnh đại diện ảo của họ và xem các tùy chọn khác nhau. người mua dùng điện thoại di động chụp ảnh phần đông cơ thể của họ, sau đó phân phối số đo và tạo hình đại diện công nghệ số của họ. Trên những hình đại diện này, các bạn mang thể thử áo xống, kiểm tra độ vừa vặn vẹo và kích thước.</p><h3>Phòng thử đồ ảo</h3><p>Lúc nhu cầu “không tiếp xúc” đang trở thành hết sức quan trọng hiện giờ, kỹ thuật này ban sơ được giới thiệu để hạn chế thời gian thử đồ, giúp người mua chẳng phải xếp hàng dài và bên cạnh đó giúp gia tăng trải nghiệm tại shop thời trang.</p><p>Kỹ thuật được cài đặt trong một ki-ốt bên trong shop cho phép thử áo quần ảo. mang rộng rãi biến thể khác nhau mà các nhà bán sỉ sở hữu thể tuyển lựa. Một trong số đấy là việc tạo hình đại diện 3D để thử áo quần và hai là sử dụng AR để chồng xống áo lên hình ảnh đề đạt của người dùng.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/top-trends-fas-2.jpeg\" /></div><p></p><p>Trong kỹ thuật AR, những sản phẩm may mặc sở hữu dạng hình của người đứng trước gương và cho phép quý khách thấy được hình trạng của áo quần. Terxtronic, với hội sở tại Mumbai, là một trong  các dịch vụ Phòng thử đồ ảo AR. Công nghệ TryOn cho phép người dùng thử hàng may mặc. Phần mềm được tích hợp vào các gương ảo được đặt trong cửa hàng và cho phép quý khách áp xống áo lên hình ảnh phản ảnh của họ. Khoa học này cũng sở hữu thể nắm bắt đi lại của người mua, cho phép họ thử các tùy chọn khác nhau bằng cách thức tiêu dùng đi lại vuốt và vẫy tay thuần tuý. một số nhà cung cấp giải pháp hỗ trợ những nhà bán lẻ trong ngành này là Textronic, TryNDBuy và Zugara.</p><h3>Thanh toán bằng di động</h3><p>Để hạn chế tiếp xúc, các bạn giảm thiểu trả tiền bằng tiền mặt. Dù rằng phần đông các bạn thích thanh toán bằng thẻ, nhưng phổ quát kỹ thuật khác như tự thanh toán, trả tiền bằng di động và công  nghệ scan&go sẽ được áp dụng đa dạng hơn lâu dài sắp.</p><h3>Công nghệ Scan&go</h3><p>Cho phép quý khách vào shop, lấy sản phẩm của họ, quét mã QR, trả tiền bằng những phương thức khác nhau bao gồm tín dụng, ghi nợ, Apple Pay, Google Pay, PayPal và rời đi mà không cần đứng đợi trong hàng của quầy thanh toán. 1 trong các doanh nghiệp ứng dụng công nghệ này là Decathlon- nhà bán buôn đồ thể thao, người đã đưa ra giải pháp tự trả tiền di động trên khắp những shop của mình ở Hà Lan.</p><p>Người dùng tới thăm cửa, mua sắm muốn thanh toán nhanh cần  xuống Decathlon Scan & Go để trả tiền bằng cách quét mã QR của sản phẩm. Việc cài đặt được thực hành sở hữu sự cộng tác của công ty của Anh, MishiPay. Nó cũng vô hiệu hóa các thẻ bảo mật RFID gắn trên hàng may mặc để người mua có thể ra về mà ko cần phải xếp hàng. 1 số tổ chức hỗ trợ là Perpule, AIMagnifi và Wizcart.</p><p>Đề xuất, tư vấn chăm sóc khách hàng trực tuyến</p><p>Hiện tại các nhà bán sỉ đang chuyển dần từ ngoại tuyến sang trực tuyến, sự cạnh tranh càng ngày càng gia tăng lúc những shop ngoại tuyến có lợi thế về sự tương tác trực tiếp giữa khách hàng và nhân viên đưa ra những gợi ý về phong cách.</p><p>Công cụ này dựa trên việc tích hợp AI vào kênh trực tuyến của nhãn hiệu để đưa ra những đề xuất cho người mua dựa trên lịch sử bán hàng và hoàn trả trước đấy. Nó cũng gợi ý cho người dùng những sản phẩm và kích thước thích hợp mang họ nhất.</p><p>Ví dụ: lúc mua tậu trên Myntra, nó trông thấy nhãn hàng được kiếm tìm và truy vấn cập phổ quát nhất, song song cung ứng cho khách hàng các thương lượng về nhãn hiệu ấy. Nó cũng giúp khách hàng   lưu những thông báo chi tiết như người nào đã mua sản phẩm và sau ấy sẽ hỏi họ trong lần tìm mua tiếp theo về sản phẩm. Dựa trên câu giải đáp, nó sẽ đề xuất kích thước của sản phẩm thích hợp cho họ.</p><p>những doanh nghiệp nức tiếng trong việc triển khai kỹ thuật này là Vue.ai và Recombee.</p><h3>Thương mại điện tử</h3><p>những nhà bán buôn đang tiếp cận người mua qua phổ biến nền tảng khác nhau như MXH, ứng dụng di động và thị trường. Sự đổi thay sở thích của người mua sang mua mua trực tuyến với thể dẫn đến sự thay đổi vĩnh viễn trong 1 số ít trường hợp vì các lý do như sự dễ dàng, rộng rãi tuyển lựa sản phẩm và các chương trình giảm giá. bởi vậy, các nhà bán lẻ cũng nên đầu cơ vào các trang thương mại điện tử, nâng cao cường sự hiện diện của họ trên những trang bán hàng trực tuyến.</p><h3>Bộ sưu tập ảo và biểu diễn phong cách mang mô hình 3D</h3><p>Việc giảm thiểu chuyển động và đóng cửa ở phổ thông đất nước đã xúc tiến những nhà bán sỉ và nhãn hiệu chuyển sang nền tảng khoa học số. Trước ấy định nghĩa về trình diễn bắt mắt ảo và phân tích bộ sưu tập ảo đang ở giai đoạn ý tưởng và chưa với phổ thông ứng dụng hiện giờ, hầu hết các kiến trúc sư đã dùng khoa học số để công ty 1 buổi trình diễn cá tính. công nghệ này cho phép giới thiệu phổ biến bộ sưu tập cho khách hàng với việc hạn chế giá tiền của 1 buổi biểu diễn bắt mắt thực tại. Hơn nữa, lúc xu thế hiện tại là quan tâm phổ biến hơn tới tính vững bền, yếu tố công nghệ đang trở thành mũi nhọn quan trọng. Và sự lựa chọn tính năng áp dụng công nghệ này sẽ trở thành một chọn lựa bền vững hơn cho những buổi biểu diễn phong cách truyền thống.</p><h3>Thương mại bằng hình ảnh và giọng nói</h3><p>Tìm kiếm bằng hình ảnh, dùng hình ảnh như ảnh chụp màn hình, hình ảnh trên internet hoặc ảnh chụp để tìm kiếm sản phẩm trực tuyến. các nền móng kiếm tìm trực quan cấp độ tăng tiêu dùng trí tuệ nhân tạo (AI) để hiểu hình ảnh và hiển thị kết quả như vậy. Tỉ dụ, một người mua tìm có thể chỉ cần nhấp vào ảnh của sản phẩm họ muốn, dùng nó để đưa vào kiếm tìm của họ và kết quả sẽ trả về những sản phẩm như vậy sở hữu sẵn. Cách kiếm tìm có thể giúp họ ngay thức thì tìm thấy đúng sản phẩm họ đang kiếm tìm và cắt giảm thời kì kiếm tìm từ khóa phù hợp.</p><p>Việc dùng công nghệ này cung cấp tốt hơn cho những người mua ko kiên cố về từ khóa chuẩn xác để tìm kiếm sản phẩm. ViSenze và Pixyle.ai là số ít các doanh nghiệp đang giúp các nhà bán lẻ tận dụng việc dùng thương mại trực quan dựa trên người nào.</p><p>Và Dimensio xin dừng bút tại đây. Và mong bài viết này giúp cho các đọc giả có thêm nhiều góc nhìn hay về sự gắn kết giữa công nghệ và thời trang.</p><h4 style=\"font-style: italic;\">Tác giả: dimensio - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n    id: 6,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/top-trends-fas-1.jpeg',\r\n    date: '13/11/2021',\r\n    title: 'Top trends in fashion technology',\r\n    content:\r\n      \"<i><h2>Near the end of 2019 to today, the pandemic has come and devastated the global calendar, claimed a lot of human lives, and led to the global economic crisis in general and Vietnam in general.</h2></i><p>Near the end of 2019 to today, the pandemic has come and devastated the global calendar, taking a lot of human lives, and leading to the global economic crisis in general and Vietnam in particular. And <a href='https://dimensio.vn/gioi-thieu/' target='blank'>Dimensio</a> couldn't avoid these black swan events. But it gives us many valuable lessons to gain experience. In early 2021, the introduction of technology into operation has increased in <b>the fashion industry associated with technology</b>. These technologies are increasingly chosen by retailers as the spearhead, helping suppliers to affirm credibility, transparency, creating a healthy and safe shopping environment for customers to help. Alternatives to in-person shopping: online shopping, mobile payments, AI-based recommendations, virtual trial mirrors and 3D body scans will have a lasting impact on the shopping experience, both online and offline, and will become an essential part of the retail industry in the near future.</p><h2 style='text-align: center;'>Key trends in fashion technology</h2><h3>Digital Fit Technique</h3><p>Online clothing shopping will have some pay-per-view barriers for reasons such as size, color, feel, etc. To optimize reducing the gap between the online and offline shopping experience, merchants are now taking advantage of sizing science to help users find clothes that fit them when buying online. This technology has contributed to reducing the return rate of products on e-commerce due to the problem of sizing which is one of the biggest challenges for wholesalers.</p><div style='text-align: center;'><img src='/media/images/insights/top-trends-fas-1.jpeg'/></div><p><b>Digital Fit</b> is being used as a cell phone body scanner. 3D body scanners are mobile-based applications built into the websites and mobile apps of vendors. The technology allows customers to try on clothes on their virtual profile pictures and see different options. Buyers use mobile phones to take pictures of the majority of their bodies, then distribute measurements and create their digital avatars. On these avatars, you can try on the coat, check the fit and size.</p><h3>Virtual fitting room</h3><p>When the need for 'contactless' is becoming very important now, this technique was originally introduced to limit the time to try on clothes, help buyers not have to queue long and besides help increase the experience at the fashion shop.</p><p>The technique is installed in a kiosk inside the shop that allows for trying on virtual clothes. There are many different variations that wholesalers can choose from. One of them is the creation of a 3D avatar to try on clothes and the other is to use AR to stack the shirt on the image of the user.</p><div style='text-align: center;'><img src='/media/images/insights/top-trends-fas-2.jpeg' /></div><p></p><p>In AR technology, garments possess the shape of the person standing in front of the mirror and allow you to see the shape of the clothes. Terxtronic, with its headquarters in Mumbai, is one of the AR Virtual Apparel Test Room services. TryOn technology allows users to try on garments. The software is integrated into the virtual mirrors placed in the store and allows you to apply your shirt to their reflection. This science can also capture buyer travel, allowing them to try different options by consumer-commuter swipes and waving purely. Some of the solution providers supporting retailers in this industry are Textronic, TryNDBuy and Zugara.</p><h3>Mobile payments</h3><p>To limit your exposure, minimize cash payments. Although most of you prefer to pay by card, other techniques such as self-payment, mobile payment and scan&go technology will be applied more diversely in the long run.</p><h3>Scan&go technology</h3><p>Allows you to enter the store, grab their products, scan QR codes, pay by various methods including credit, debit, Apple Pay, Google Pay, PayPal and leave without waiting in the checkout line. One of the businesses that uses the technology is Decathlon, a sportswear wholesaler who has come up with mobile self-pay solutions across its stores in the Netherlands.</p><p>Users visiting the door, shopping want to pay quickly need to down Decathlon Scan & Go to pay by scanning the QR code of the product. The installation is practiced in partnership with the British company, MishiPay. It also disables RFID security tags mounted on garments so buyers can leave without having to queue. Some of the supporting organizations are Perpule, AIMagnifi and Wizcart.</p><p>Online customer care proposals and advice</p><p>Now that wholesalers are moving from offline to online, competition is growing as offline stores have the advantage of face-to-face interaction between customers and employees offering stylistiful suggestions.</p><p>The tool relies on integrating AI into a brand's online channel to make recommendations to buyers based on previous sales and refund history. It also suggests to users the most suitable products and sizes that carry their surnames.</p><p>For example, when buying on Myntra, it sees the most searched and universally queried brand, while providing customers with negotiations about that brand. It also helps customers save detailed notifications such as who bought the product and then asks them on the next purchase about the product. Based on the answer, it will suggest the size of the product suitable for them.</p><p>The companies that are well known for implementing this technique are Vue.ai and Recombee.</p><h3>E-commerce</h3><p>Wholesalers are reaching buyers through various platforms such as social media, mobile apps and markets. A change in buyer preferences to online purchases can lead to a permanent change in a small number of cases for reasons such as the ease, widespread selection of products, and discounts. Therefore, retailers should also speculate on e-commerce sites, enhancing their presence on online sales sites.</p><h3>Virtual collections and stylish performances with 3D models</h3><p>The reduction of movement and closures in the country has led wholesalers and brands to move to digital science. Previously, the definition of virtual eye-catching performance and virtual collection analysis was at the idea stage and not with the current universal application, most architects used digital science to give the company a personality show. This technology allows the popular introduction of the collection to customers with the price restriction of an eye-catching performance. Moreover, at the current trend of more common concern for sustainability, the technology factor is becoming an important spearhead. And the choice of this technology will become a more sustainable option for traditional style performances.</p><h3>Commercial by image and voice</h3><p>Search by image, use images such as screenshots, internet images, or snapshots to search for products online. The platform seeks visual levels of increased artificial intelligence (AI) consumption to understand images and display such results. For example, a buyer may simply click on a photo of the product they want, use it to include it in their search, and the results will return such products. A search can help them stay awake, find the right product they're looking for and cut down on the time it takes to find the right keywords.</p><p>The use of this technology provides better for buyers who are not solid about the correct keywords to search for products. ViSenze and Pixyle.ai are the few businesses that are helping retailers take advantage of the use of intuitive trade based on who.</p><p>And Dimensio please stop writing here. And hopefully this article helps readers have more good perspectives on the connection between technology and fashion.</p><h4 style='font-style: italic;'>Author: dimensio - spiderum</h4>\",\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    id: 7,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/intersting-app-for-season-1.png',\r\n    date: '28/08/2021',\r\n    title: 'Các ứng dụng/ website học tập, làm việc và phát triển bản thân thú vị cho mùa dịch',\r\n    content:\r\n      '<i><h2>Để việc ở nhà trở nên bớt đơn điệu</h2></i><p><b>WFH – hay Work From Home</b> đã là một cụm từ quá quen thuộc của chúng ta những ngày này. Dưới đây mình muốn giới thiệu với mọi người một số ứng dụng, website mà mình đã sử dụng để giúp cho việc làm việc ở nhà để tạo bầu không khí học tập và làm việc hứng thú và hiệu quả hơn, cũng như có thể nâng cao sức khỏe thể chất, tinh thần và phát triển bản thân.</p><h3>1. <a href=\"https://imissmycafe.com/\" target=\"blank\">I Miss My Cafe</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-1.png\" /><p></p></div><p><b>I miss my café</b> là một quán café ảo mà ở đây, bạn có thể tự customize được mọi thứ. Từ tiếng mưa, tiếng người pha chế, tiếng người trò chuyện, tiếng máy xay café. Bên cạnh đó, I miss my café cũng liên kết với spotify và bạn có thể thưởng thức luôn tiếng nhạc hòa cùng những âm thanh khác khá dễ chịu. Tuy nhiên playlist của I miss my café hình như chỉ có một và chưa được update thường xuyên nên đây là điểm trừ duy nhất đối với mình.</p><h3>2. <a href=\"https://soundofcolleagues.com/\" target=\"blank\">Sound of colleagues</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-2.png\" /><p></p></div><p>Với các bạn đi làm văn phòng thì website giả lập này là một lựa chọn khá thú vị để vơi đi nỗi nhớ đồng nghiệp. <b>The Sound of Colleagues</b> có thể cho người dùng lựa chọn tiếng máy café, tiếng điện thoại, tiếng gõ bàn phím, hay máy in giống với những gì mà chúng ta vẫn thường nghe thấy ở công sở.</p><p>Mọi người cũng có thể ghé I Miss The Office: <a href=\"https://imisstheoffice.eu/\" target=\"blank\">https://imisstheoffice.eu/</a>. Tuy nhiên cá nhân mình thích và thường sử dụng The Sound of Colleagues nhiều hơn vì cảm giác chân thực hơn, các âm thanh cũng dễ điều chỉnh hơn.</p><h3>3. <a href=\"https://magenta.github.io/lofi-player/\" target=\"blank\">Lofi player</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-3.png\" /><p></p></div><p>Với các fan nhạc Lofi, đây là một website khá thú vị vì bạn cũng có thể tự mix một bản lofi theo ý của mình.</p><p>Với giao diện đồ họa dạng pixel tái hiện lại một căn phòng, bạn có thể nhấn vào các đồ vật trong phòng để bật/ tắt âm thanh của chúng trên nền beat sẵn có để tạo một bản lofi mà mình thích. Bạn cũng có thể chỉnh tone, volume, tempo và các hiệu ứng của nhạc cụ, tiếng TV, tiếng mưa,….</p><h3>4. <a href=\"https://pomofocus.io/\" target=\"blank\"> Pomodoro</a></h3><p>Pomodoro là phương pháp tăng hiệu suất làm việc khá phổ biến với công thức làm/ học một task trong 25’, sau đó nghỉ 5’ và tiếp tục làm sang task tiếp theo. Với công cụ này, bạn có thể kiểm soát được thời gian làm việc của mình, tập trung hơn vì có đồng hồ đếm ngược, cũng như luôn được nhắc nhở vận động, nghỉ ngơi khi làm, tránh việc làm việc ảnh hưởng đến sức khỏe.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-4.png\" /><p></p></div><h3>5. <a href=\"https://fitonapp.com/\" target=\"blank\">FitOn</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-5.png\" /><p></p></div><p>FitOn là một ứng dụng hướng dẫn các bài tập yoga, cardio, pilates,….với các trainer uy tín và hoàn toàn miễn phí. Các bài tập của FitOn có ghi rõ ràng thời gian tập luyện phù hợp với nhu cầu, thời gian, cường độ, hay dụng cụ mà bạn muốn. FitOn theo dõi việc tập luyện của bạn và trao tặng các huy hiệu tương ứng với cường độ luyện tập. Bên cạnh đó, FitOn còn đưa ra các lời khuyên ăn uống rất lành mạnh và khoa học, tuy nhiên tính năng này có yêu cầu trả phí. FitOn hiện có trên các hệ điều hành Android và iOS.</p><h3>6. <a href=\"https://insighttimer.com/\" target=\"blank\">Insight Timer</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-6.png\" /><p></p></div><p><b>Insight Timer</b> là nền tảng chăm sóc và cải thiện sức khỏe tâm lý, tinh thần với các bài học, bài nghe podcast, nhạc, các sự kiện live và bài viết về thiền, giấc ngủ, yoga,….giúp bạn nuôi dưỡng sự bình yên bên trong. Hầu hết các bài học, bài nghe và nhạc, hay hướng dẫn thiền đều miễn phí, giúp bạn cải thiện các vấn đề tâm lý như rối loạn lo âu, trầm cảm, mất ngủ….<b>Insight Timer</b> hiện có website và ứng dụng trên điện thoại.</p><h4 style=\"font-style: italic;\">Tác giả: Ly Duong - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    id: 8,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/intersting-app-for-season-1.png',\r\n    date: '28/08/2021',\r\n    title: 'Interesting apps/websites for the season',\r\n    content:\r\n      '<i><h2>To make it less monotonous at home.</h2></i><p><b>WFH - or Work From Home</b> - has been a familiar phrase for us these days. Below I would like to introduce to people some of the applications and websites that I have used to help work from home to create a more exciting and productive learning and working atmosphere, as well as be able to improve physical, mental and self-development.</p><h3>1. <a href=\"https://imissmycafe.com/\" target=\"blank\">I Miss My Cafe</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-1.png\" /><p></p></div><p><b>I miss my café</b> is a virtual café where you can customize everything yourself. From the sound of rain, the sound of bartenders, the sound of people talking, the sound of coffee grinders. Besides, I miss my café is also associated with spotify and you can always enjoy the music mixed with other sounds quite pleasant. However, the playlist of I miss my café seems to have only one and has not been updated regularly so this is the only minus point for me.</p>2. <a href=\"https://soundofcolleagues.com/\" target=\"blank\">Sound of colleagues</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-2.png\" /><p></p></div><p>For you who go to work in the office, this simulated website is a pretty interesting option to relieve the nostalgia of colleagues. <b>The Sound of Colleagues</b> can give users a choice of coffee machines, phone calls, keyboard typing, or printers that are similar to what we often hear at work.</p><p>You can also visit I Miss The Office:<a href=\"https://imisstheoffice.eu/\" target=\"blank\">https://imisstheoffice.eu/</a>. However, I personally like and often use The Sound of Colleagues more because it feels more authentic, the sound is also easier to adjust.</p><h3>3. <a href=\"https://magenta.github.io/lofi-player/\" target=\"blank\">Lofi player</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-3.png\" /><p></p></div><p>For Lofi fans, this is an interesting website because you can also mix a lofi at your disposal.</p><p>With a pixel graphical interface that recreates a room, you can tap on the objects in the room to turn their sound on/off on an existing beat background to create a lofi that you like. You can also adjust the tone, volume, tempo and effects of musical instruments, TV, rain,....</p><h3>4. <a href=\"https://pomofocus.io/\" target=\"blank\"> Pomodoro</a></h3><p>Pomodoro is a fairly common method of increasing performance with a 25\\'s one task, then a 5\\' break and moving on to the next task. With this tool, you can control your work time, focus more because there is a countdown clock, as well as always be reminded to exercise, rest when working, avoid work affecting health.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-4.png\" /><p></p></div><h3>5. <a href=\"https://fitonapp.com/\" target=\"blank\">FitOn</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-5.png\" /><p></p></div><p>FitOn is an app that guides yoga, cardio, pilates,.... with reputable trainers and is completely free. FitOn exercises clearly state the workout time to suit your needs, time, intensity, or equipment. FitOn monitors your workouts and awards badges that correspond to the intensity of your workout. FitOn also offers very healthy and scientific eating advice, but this feature requires a fee. FitOn is available on Android and iOS operating systems.</p><h3>6. <a href=\"https://insighttimer.com/\" target=\"blank\">Insight Timer</a></h3><div style=\"text-align: center;\"><img src=\"/media/images/insights/intersting-app-for-season-6.png\" /><p></p></div><p><b>Insight Timer</b> is a platform for caring for and improving mental and mental health with lessons, podcast listening, music, live events and articles about meditation, sleep, yoga,....our you cultivate inner peace. Most lessons, listening and music, or meditation tutorials are free, helping you improve psychological problems such as anxiety disorders, depression, insomnia, etc. <b>Insight Timer</b> now has a website and app on your phone.</p><h4 style=\"font-style: italic;\">Author: Ly Duong - spiderum</h4>',\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '80a9e1f3-f2b5-4f9d-b276-8aa2bdd5e9a6',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '74a4bc92-58d0-41cc-8a29-7d7f38cde68e',\r\n    id: 9,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/online-payment.png',\r\n    date: '25/09/2021',\r\n    title: 'Bạn đã từng thiết kế một hệ thống thanh toán online cho ứng dụng của mình',\r\n    content:\r\n      '<i><h2>Khi bạn làm một ứng dụng nào đó, có những lúc bạn sẽ gặp phải những nghiệp vụ liên quan đến thanh toán. Khi này bạn cần phải đưa ra...</h2></i><p>Khi bạn làm một ứng dụng nào đó, có những lúc bạn sẽ gặp phải những nghiệp vụ liên quan đến thanh toán. Khi này bạn cần phải đưa ra một số giải pháp cho các cổng thanh toán bên ngoài rồi tích hợp vào hệ thống của bạn.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/online-payment.png\" /><p></p></div><p>Việc chuyển tiền giữa người sử dụng hệ thống và ứng dụng của bạn sẽ hình thành những giao dịch. Những giao dịch này có thể thông qua bằng một số cách cơ bản như sau:</p><p>– Giao dịch chuyển khoản ngân hàng, đây có lẽ là cách đơn giản nhất, bạn để lại số tài khoản và khách hàng sẽ chuyển khoản cho bạn. Sau khi nhận được tiền thì bạn mới xử lý quy trình trên hệ thống của bạn. Tuy nhiên với cách này thì một hai giao dịch trong năm mười phút thì okay nhưng mà nhiều giao dịch thì bạn không thể xử lý kịp và không thể tích hợp một cách tự động quy trình của bạn mà buộc phải gây gián đoạn quá trình thanh toán và bắt người dùng phải chờ xử lý.</p><p>– Giao dịch thông qua tiền mà bạn định nghĩa, hay còn gọi là tiền ảo do hệ thống bạn quy định như xu hay coin hay điểm sau đó đến một ngưỡng thanh toán nào đó thì có thể quy đổi qua tiền mặt thông qua hình thức chuyển khoản giao dịch thật.</p><p>Ở dạng này thì bạn có thể gặp đâu đó ở Momo, VinID, ShareCode,…</p><p>– Giao dịch thông qua bên thứ ba chuyển nhượng quyền thanh toán, ví dụ hệ thống của bạn sẽ cùng một đơn vị tiền của một bên thứ ba nào đó, bạn chỉ quan tâm đến việc quy đổi giao dịch của hệ thống sang cho bên thứ ba, việc thanh toán sẽ nằm ở phía bên họ. Người dùng và kể bạn là chủ ứng dụng cũng phải tự rút tiền hoặc nạp tiền thông qua kênh này, họ sẽ ăn một phần trăm nhất định.</p><p>Ở dạng này bạn có thể biết đến một số kênh như Ngân lượng, Palpal,…</p><p>– Giao dịch cổng thanh toán trực tuyến ngân hàng với hình thức trung gian, việc thanh toán này thì hệ thống của bạn dường như sẽ làm việc và xử lý thông tin với ngân hàng hay tài khoản của khách hàng. Tuy nhiên sẽ có một bên trung gian nào đó tổ chức giao dịch giữa người dùng và ngân hàng, số tiền thanh toán của người dùng cuối cùng được tổng hợp và đổ về tài khoản gốc của bạn mà bên thứ trung gian này chỉ có mục đích quản lý và tổ chức giao dịch chứ không nắm giữ số tiền thực trong tài khoản của bạn. Khi này bên trung gian sẽ tính theo lượng giao dịch hoặc theo thời gian sử dụng tùy từng bên</p><p>Ở dạng này phải kể đến Mpos, Momo, Vn-pay, Zalo pay, 123 pay, Air pay,…</p><p>Để lựa chọn được loại hình giao dịch nào thì sẽ phải tùy vào hình thức, nghiệp vụ thương mại điện tử của bạn. Đôi khi còn tùy vào giai đoạn phát triển hệ thống nữa. Từ thô sơ đến chuyên nghiệp. Ngoài ra bạn còn quan tâm đến chi phí vận hành để giao dịch cho bên thứ ba hay trung gian cũng là một chi phí không hề nhỏ.</p><p>Nếu bạn tự xây dựng hệ thống thanh toán và chọn hai hình thức giao dịch đầu thì bạn cũng cần phải quan tâm đến luật pháp liên quan đến trách nhiệm và nghĩa vụ khi thực hiện giao dịch. Bên cạnh đó bạn còn phải chịu trách nhiệm thuế má hay những tình huống lừa đảo, mất mát phát sinh nữa.</p><p>Nếu bạn chọn việc sử dụng hệ thống bên thứ ba hay cổng thanh toán điện tử trung gian thì ngoài việc lựa chọn hình giao dịch thì bạn còn phải quan tâm đến những tiêu chí sau:</p><p>– Khả năng tương thích: Khi tích hợp với hệ thống của bạn bạn cần hiểu rõ nền tảng công nghệ cũng như cách thức tích hợp, các lỗi xử lý và các trường hợp ngoại lệ, những trường hợp xấu nhất khi tiền của khách hàng sẽ đi đâu và về đâu. Bên nào sẽ chịu trách nhiệm khi gặp sự cố.</p><p>– Khả năng bảo mật: Một khi đã dính đến tiền và thông tin tài khoản của khách hàng, mọi thứ phải được đảm bảo và chắc chắn, rủi ro thấp nhất có thể. Đừng để uy tín và thương hiệu của bạn bị mất đi và có thể bạn sẽ ôm một khối nợ khổng lồ nếu một ngày hệ thống của bạn khiến cho bao khách hàng mất mát.</p><p>– Phí dịch vụ: Tất nhiên rồi, chẳng có hệ thống hay cổng thanh toán trực tiếp nào làm giúp bạn mà không lấy phí cả, mỗi hệ thống đều có. Mỗi bên có một cách tính và chi phí khác nhau nên việc bạn cần làm là phải hạch toán từng mức chi phí và những thứ phát sinh rồi hãy quyết định lựa chọn bên nào nhé!</p><p>– Khả năng tùy biến: Thanh toán thì thực sự có rất nhiều loại và đa dạng, việc lựa chọn đơn vị nào thì bạn cũng nên cân nhắc khả năng tùy biến của hệ thống bên họ. Ví dụ như quét mã QR, nhập thẻ ATM, nhập thẻ visa, debit, thanh toán qua card điện thoại…</p><p>Hiện tại thì những ứng dụng thương mại điện tử dần đã và đang bùng nổ trong thời đại 4.0 rồi. Vậy nên nếu bạn muốn xây dựng một ứng dụng hay một trang web mà có thể tích hợp được các hình thức thanh toán online để giải quyết được vấn đề quy trình trong hệ thống của bạn thì thật là một lợi thế.</p><p>Ngoài lề một chút là có một số hình thức COD, một hình thức thanh toán khi nhận hàng không nằm trong danh mục mà mình đã nêu. Tuy nhiên bạn có thể cân nhắc vì rất nhiều hệ thống cũng đã sử dụng cách này, nhưng nó không phải là một cách tối ưu do có rất nhiều rủi ro cũng như một số nghiệp vụ chỉ thanh toán một phía không trao đổi hàng hóa thì rất khó để sử dụng cách này. Ngày xưa thì có đã có hình thức biến thể kiểu như ship card mã thẻ thanh toán cho khách hàng sau đó nhập mã vào hệ thống của bạn. Bạn cũng có thể xem tham khảo qua.</p><p>Trên đây là một số cách mà mình biết khi xây dựng cũng như tích hợp hệ thống thanh toán vào ứng dụng của bạn. Bạn còn biết hình thức nào thì có thể bổ sung giúp mình nhé! Bài viết sau mình sẽ đi cụ thể hơn vào một hình thức thanh toán mà mình đã từng làm đó là Vn-pay. Đón đọc nhé!</p><h4 style=\"font-style: italic;\">Tác giả: Ntech - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '2a2b2e74-ec50-4e2c-b660-42d3b5156732',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '74a4bc92-58d0-41cc-8a29-7d7f38cde68e',\r\n    id: 10,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/online-payment.png',\r\n    date: '25/09/2021',\r\n    title: 'Have you ever designed an online payment system for your app?',\r\n    content:\r\n      \"<i><h2>When you do an app, there are times when you will encounter payment-related business. At this point you need to come up with...</h2></i><p>When you do an app, there are times when you will encounter payment-related business. At this point you need to come up with some solutions for external payment gateways and then integrate into your system.</p><div style=\\\"text-align: center;\\\"><img src=\\\"/media/images/insights/online-payment.png\\\" /><p></p></div><p>The transfer of funds between the users of the system and your application will form transactions. These transactions can be passed in some basic ways as follows:</p><p>Bank transfers, this is probably the simplest way, you leave your account number and the customer will transfer to you. After receiving the money, you process the process on your system. However, in this way, one or two transactions in five or ten minutes is okay but many transactions you can not handle in time and can not automatically integrate your process but are forced to interrupt the payment process and force users to wait for processing.</p><p>– Trading through the money that you define, also known as virtual currency regulated by your system such as coins or coins or points then to a certain payment threshold can be converted through cash through the form of real transaction transfer. In this form, you can meet somewhere in Momo, VinID, ShareCode,...</p><p>Transactions through a third party transfer the right to pay, for example your system will be the same unit of money of a third party, you are only interested in converting the transaction of the system to a third party, the payment will be on their side. Users and you as app owners must also withdraw or top up through this channel, they will eat a certain percentage. In this form you can know some channels such as Budget, Palpal,...</p><p>– Banking online payment gateway transactions in the form of intermediaries, this payment, your system seems to work and process information with the bank or customer's account. However, there will be an intermediary that organizes transactions between the user and the bank, the final user payment amount is aggregated and poured into your original account, which the intermediary only intends to manage and organize the transaction, not hold the real amount in your account. At this time, the intermediary will calculate the number of transactions or according to the time of use depending on the party In this form must be mpos, Momo, Vn-pay, Zalo pay, 123 pay, Air pay,...</p><p>To choose what type of transaction, it will have to depend on your form and e-commerce business. Sometimes it depends on the stage of system development. From rudimentary to professional. In addition, you are also interested in operating costs to transact for third parties or intermediaries is also a small cost.</p><p>If you build your own payment system and choose the first two forms of trading then you also need to pay attention to the law regarding responsibilities and obligations when making transactions. Besides, you are also liable for taxes or fraudulent situations, losses arise.</p><p>If you choose to use a third-party system or an intermediary electronic payment gateway, in addition to choosing the transaction form, you must pay attention to the following criteria:</p><p>Compatibility: When integrating with your system you need to understand the technology platform as well as how integration, handling errors and exceptions, the worst cases when customer money will go and where. Which party will be responsible in the event of a problem.</p><p>Security: Once the client's money and account information are involved, everything must be guaranteed and sure, the lowest possible risk. Don't let your reputation and brand lose and you'll probably hold a huge amount of debt if one day your system causes so many customers to lose.</p><p>Of course, there is no direct payment system or gateway that helps you without charge, each system has. Each party has a different way of calculating and costing so what you need to do is to account for each cost and what arises and then decide which side to choose!</p><p>– Customizability: Payment is really a lot of types and variety, the choice of which unit you should also consider the customization of the system with them. For example, scanning QR codes, entering ATM cards, entering visa cards, debit, paying via phone card ...</p><p>Currently, e-commerce applications have been booming in the 4.0 era. So if you want to build an app or website that can integrate online payment forms to solve the process problem in your system, that's an advantage.</p><p>On the sidelines a bit, there are some forms of COD, a form of payment when receiving goods that are not in the list that I have stated. However, you can consider because a lot of systems have also used this method, but it is not an optimal way because there are a lot of risks as well as some businesses that only pay one side without exchanging goods are difficult to use this way. In the old days, there was a variation like shipping a payment card card to customers and then entering the code into your system. You can also check it out.</p><p>Here are some ways I know when building and integrating your payment system into your app. You know what form you can take to help yourself! The following article will go more specifically into a form of payment that I used to do that is Vn-pay. Read it!</p><h4 style='font-style: italic;'>Author: Ntech - spiderum</h4>\",\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '2a2b2e74-ec50-4e2c-b660-42d3b5156732',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '2a2b2e74-ec50-4e2c-b660-42d3b5156732',\r\n    id: 11,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/tech-race-marketing.jpg',\r\n    date: '11/01/2021',\r\n    title: 'Chạy đua công nghệ chỉ để Marketing',\r\n    content:\r\n      '<i><h2>Cái giá của danh hiệu người dẫn đầu là nỗi sợ bị lật ngôi, nhiều chục tỷ USD được đầu tư vào R&D để tạo ra những công nghệ đột phá...</h2></i><p>Cái giá của danh hiệu người dẫn đầu là nỗi sợ bị lật ngôi, nhiều chục tỷ USD được đầu tư vào R&D để tạo ra những công nghệ đột phá nhưng… ít hiệu quả, chỉ với mục đích giữ được vị thế của mình.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/tech-race-marketing.jpg\" /><p></p></div><h3><b>Những đột phá công nghệ... vô dụng</b></h3><p>Tháng 4 năm 2019, Samsung ra mắt Galaxy S10 5G - chiếc điện thoại thông minh đầu tiên trên Thế Giới tích hợp công nghệ 5G, đưa họ cùng với Hàn Quốc lên vị trí dẫn đầu trong cuộc đua biểu tượng cho cách mạng 4.0 với giá trị 12 ngàn tỷ USD này.</p><p>Mọi con mắt đổ dồn lên Apple, xem câu trả lời từ ông vua smartphone là gì. Nhưng, Apple đã làm những fan trung thành của họ tiu nghỉu khi lặn mất tăm nguyên năm, trong bối cảnh những hãng điện thoại Trung và Hàn lần lượt cho ra mắt phiên bản 5G của mình - Huawei mate 20 X 5G, Xiaomi Mi Mix 3 5G, Oppo Reno 5G, Oneplus 7 Pro 5G, v.v..</p><p>Mãi đến 15/09/2020, Táo Khuyết mới giới thiệu Iphone 12 tích hợp 5G. Apple thời Tim Cook tuy không duy trì được truyền thống đi tiên phong như thời của Steve Job, nhưng vẫn luôn đảm bảo được chất lượng hàng đầu thị trường. Nên dù ra mắt rất trễ, công nghệ 5G của Apple hẳn phải có cái gì rất đáng mong đợi.</p><p>Tuy nhiên, mọi chú ý và kỳ vọng được đồn thổi trước sự kiện ra mắt Iphone 12, thì sau đó đột nhiên lặn mất tăm. Không còn ai nhắc đến xem 5G của Apple có gì khác so với Samsung. Đơn giản bởi vì: 5G ở thời điểm hiện tại hoàn toàn vô dụng với người dùng phổ thông.</p><p>Ban đầu sức mạnh của 5G được kỳ vọng sẽ làm thay đổi hệ thống giao thông tự động, các dây chuyền sản xuất, hay ứng dụng quân sự, trong tương lai khoảng vài chục năm nữa. Việc tích hợp 5G vào điện thoại phổ thông ở thời điểm này - khi mạng lưới mạng 5G còn chưa hoàn thiện - nghe rất là phi lý.</p><p>Việc các hãng công nghệ chạy theo những đột phá thời thượng nhưng không có ứng dụng thực tế xảy ra đã quá thường xuyên. Từ tai thỏ đến giọt nước đến camera ẩn, từ màn hình gập ngang đến gập dọc, từ nhận diện khuôn mặt đến vân tay trước màn hình - trào lưu này nối tiếp trào lưu kia, mẫu điện thoại này nối tiếp mẫu điện thoại kia, một cuộc chạy đua vũ trang công nghệ thứ thiệt.</p><p>Một trào lưu chạy đua công nghệ khác là AI và Blockchain cũng khó hiểu không kém. Có một thời gian mà startup nào, phần mềm và ứng dụng nào cũng dán mác AI và Blockchain, như một cách để nâng cao giá trị.</p><p>Hãng tin De Correspondent của Hà Lan cho chạy tít “Blockchain - giải pháp tuyệt vời cho hầu như không một cái gì cả”, khi mọi giải pháp blockchain hiện giờ đều có thể được giải quyết bằng công nghệ phi-blockchain, mà còn hiệu quả hơn nhiều.</p><p>Và nếu phi-blockchain hiệu quả hơn blockchain thì tích hợp blockchain vào ứng dụng để làm gì?</p><h3>Vị thế người dẫn đầu</h3><p>Mọi cuộc chạy đua công nghệ đều nhằm hướng tới một ngôi vương - “người dẫn đầu”. Có lẽ không cần nói thì ai cũng thấy được cái hào quang của vị thế này, đặc biệt là trong thị trường hoàn hảo như công nghệ.</p><p>Theo lý thuyết kinh tế học cổ điển, một thị trường hoàn hảo là khi nó minh bạch về thông tin và xuyên suốt về lưu thông. Tất cả thị trường hiện nay, ví dụ như nhà đất (rất mập mờ về thông tin) hay thực phẩm (khó khăn trong lưu thông), đều là không hoàn hảo, nên cạnh tranh chưa được đẩy lên mức tối đa.</p><p>Riêng thị trường công nghệ cao, mọi thứ dường như rất hoàn hảo: thông tin dồi dào, đa chiều và dễ tiếp cận, lưu thông thì xuyên suốt, đặc biệt là công nghệ thông tin - ứng dụng, phần mềm, hệ điều hành.</p><p>Trong thị trường hoàn hảo, mọi quyền lực đều nằm trong tay khách hàng, tất nhiên họ sẽ chỉ chọn những thương hiệu tốt nhất.</p><p>Các hãng phải chứng minh được mình là thương hiệu tốt nhất. Nhiều thị trường công nghệ cao mang tính chất “được ăn cả, ngã về không”: Hệ điều hành máy tính - Windows chiếm 87.6%, Trình duyệt trên máy tính - Chrome chiếm 70% (theo Statista).</p><p>Đối với điện thoại thông minh, thì từng một thời không ai có thể vượt qua được Iphone. Tuy nhiên, các nhà sản xuất điện thoại khác đã tìm ra cách.</p><p>Đối với điện thoại thông minh, thì từng một thời không ai có thể vượt qua được Iphone. Tuy nhiên, các nhà sản xuất điện thoại khác đã tìm ra cách.</p><p>Mỗi hãng chọn cho mình một ngách để dẫn đầu: Nhắc đến Sony là nhắc đến chụp hình, nhắc đến Samsung là nhắc đến công nghệ mới, nhắc đến Oppo là nhắc đến selfie v.v.. Chưa biết sự thật có đúng như lời đồn không, nhưng nhờ những niềm tin thế này mà thị trường smartphone đang cân bằng hơn bao giờ hết. Tất nhiên, để duy trì hình ảnh này, các hãng không được phép tiếc tiền mà đầu tư vào R&D.</p><p>Điều tương tự xảy ra với AI và Blockchain - nếu không tích hợp công nghệ tiên tiến nhất, hứa hẹn mang lại giải pháp tốt nhất, thì ai sẽ đầu tư cho startup? Bitcoin là một ví dụ về sức mạnh của marketing, mặc dù không một chuyên gia nào công nhận rằng đồng tiền điện tử này có thể thay thế được ngân hàng.</p><p>Một mặt trái của thị trường hoàn hảo là đẩy các hãng vào những cuộc đua không cần thiết, chỉ để chứng tỏ mình đang dẫn đầu.</p><h3>Cái giá phải trả</h3><p>Ngôi vương người dẫn đầu luôn đi kèm với một cái giá rất đắt. Đó là nỗi sợ bị truất ngôi, mà hậu quả không chỉ là mất thị phần, có khi còn là chìm vào quên lãng và phá sản.</p><p>Hãy nhớ lại trường hợp của BlackBerry - “Nếu anh là ông trùm bảo mật, nhưng giờ không còn nữa, thì lý do nào để tôi mua anh?” và Yahoo - “Nếu anh từng là ông trùm tin tức và kết nối, nhưng giờ không còn nữa, thì lý do nào để tôi sử dụng anh?”</p><p>Đầu tư vào R&D để chứng minh vị thế dẫn đầu là chiến lược sống còn. Theo báo cáo của PwC năm 2018, các hãng công nghệ Mỹ, dẫn đầu là Amazon (tổng 22.62 tỷ USD) và Google (tổng 16.23 tỷ USD), chi $5 cho R&D trên mỗi $1 chi cho R&D của các hãng công nghệ Trung Quốc, để duy trì vị thế.</p><p>Đầu tư vào R&D để chứng minh vị thế dẫn đầu là chiến lược sống còn. Theo báo cáo của PwC năm 2018, các hãng công nghệ Mỹ, dẫn đầu là Amazon (tổng 22.62 tỷ USD) và Google (tổng 16.23 tỷ USD), chi $5 cho R&D trên mỗi $1 chi cho R&D của các hãng công nghệ Trung Quốc, để duy trì vị thế.</p><i><p style=\"text-align: right;\">- Hoàng Phi, đã được đăng trên Báo diễn đàn doanh nghiệp (báo in)</p></i><h4 style=\\'font-style: italic;\\'>Tác giả: Surphi28 - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      '74a4bc92-58d0-41cc-8a29-7d7f38cde68e',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '782574c3-236f-451a-bf09-47e3091279bc',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '2a2b2e74-ec50-4e2c-b660-42d3b5156732',\r\n    id: 12,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/tech-race-marketing.jpg',\r\n    date: '11/01/2021',\r\n    title: 'Chạy đua công nghệ chỉ để Marketing',\r\n    content:\r\n      \"<i><h2>The price of the title of leader is the fear of being overturned, tens of billions of dollars invested in R&D to create breakthrough technologies...</h2></i><p>The price of the title of leader is the fear of being toppled, tens of billions of dollars invested in R&D to create breakthrough technologies but... It's less effective, just for the purpose of keeping your position.</p><div style='text-align: center;'><img src='/media/images/insights/tech-race-marketing.jpg' /><p></p></div><h3><b>Technological breakthroughs ... useless</b></h3><p>In April 2019, Samsung launched the Galaxy S10 5G – the world's first smartphone with 5G technology integrated, putting it together with South Korea at the forefront of the iconic race for the $12 trillion 4.0 revolution.</p><p>All eyes are on Apple, seeing what the answer from the smartphone king is. But, Apple has made its loyal fans grumph when diving for a whole year, in the context of Chinese and Korean phone companies launching their 5G versions - Huawei mate 20 X 5G, Xiaomi Mi Mix 3 5G, Oppo Reno 5G, Oneplus 7 Pro 5G, etc.</p><p>It wasn't until September 15, 2020 that Apple introduced the 5G-integrated iPhone 12. Tim Cook's Apple has not maintained the pioneering tradition of Steve Job, but has always ensured market-leading quality. So even if it's a late launch, Apple's 5G technology must have something to look forward to.</p><p>However, all the attention and expectations were rumored before the launch of the iPhone 12, then suddenly dived. No one mentions how Apple's 5G is different from Samsung's. Simply because: 5G at the moment is completely useless for ordinary users.</p><p>The power of 5G was originally expected to change automated transportation systems, production lines, or military applications, in the future in a few decades. Integrating 5G into a popular phone at this point - when the 5G network is not yet complete - sounds absurd.</p><p>The practice of tech companies chasing trendy breakthroughs but no practical applications has happened too often. From rabbit ears to water droplets to hidden cameras, from horizontal folding to vertical folding screens, from facial recognition to fingerprints in front of the screen – this trend after another, this model follows the other, a real technology arms race.</p><p>Another trend of technology racing is AI and blockchain are equally confusing. There was a time when every startup, software, and application labeled AI and Blockchain, as a way to enhance value.</p><p>Dutch news agency De Correspondent ran the headline \\\"Blockchain – a great solution for almost nothing,\\\" as every blockchain solution can now be solved using non-blockchain technology, but is also much more efficient.</p><p>And if non-blockchain is more efficient than blockchain, what is the use of blockchain integrated into the application?</p><h3>Leading position</h3><p>Every technology race is aimed at a \\\"leader\\\" crown. Perhaps without saying, everyone can see the aura of this position, especially in a perfect market such as technology.</p><p>According to classical economic theory, a perfect market is when it is transparent about information and throughout circulation. All markets today, such as housing (very vague about information) or food (difficulty in circulation), are imperfect, so competition has not been pushed to the maximum.</p><p>Especially in the high-tech market, everything seems perfect: information is abundant, multidii way and accessible, circulating throughout, especially information technology - applications, software, operating systems.</p><p>In the perfect market, every power is in the hands of the customer, of course they will only choose the best brands.</p><p>Companies have to prove themselves to be the best brand. Many high-tech markets are \\\"eaten, falling to zero\\\": Computer operating system - Windows accounted for 87.6%, Browser on computers - Chrome accounted for 70% (according to Statista).</p><p>For smartphones, no one ever surpassed the iPhone. However, other phone manufacturers have found a way.</p><p>Each company chooses for itself a niche to lead: Referring to Sony is referring to photography, referring to Samsung is referring to new technology, oppo is referring to selfies, etc. It is not known if the truth is true as rumored, but thanks to such beliefs, the smartphone market is more balanced than ever. Of course, to maintain this image, companies are not allowed to regret the money but invest in R&D.</p><p>The same goes for AI and Blockchain – without integrating the most advanced technology, which promises to bring the best solution, then who will invest in startups? Bitcoin is an example of the power of marketing, although no expert has recognized that the cryptocurrency can replace banks.</p><p>One downside of the perfect market is pushing companies into unnecessary races, just to prove they're leading.</p><h3>The price to pay.</h3><p>The leading throne always comes at a very high price. It is the fear of dethroning, the consequence of which is not only the loss of market share, sometimes even sinking into oblivion and bankruptcy.</p><p>Recall the case of BlackBerry - \\\"If you're a security mogul, but now that I'm gone, then what's the reason I bought you?\\\" and Yahoo - \\\"If you used to be a news and networking mogul, but now there's no more, then what's the reason for me to use you?\\\"</p><p>Investing in R&D to prove that leading is a survival strategy. According to a 2018 PwC report, U.S. tech companies, led by Amazon ($22.62 billion) and Google ($16.23 billion) total, spend $5 on R&D for every $1 spent on R&D by Chinese tech firms to maintain their positions.</p><p>5G does not have a worthy practical application, 6G has been started by big companies such as Apple, Intel, Google, creating another war. It's hard to say whether these studies will become practical solutions, maybe yes, maybe not, but what's even more important is... Brand position in the marketing market.</p><i><p style=\\\"text-align: right;\\\">- Hoang Phi, which has been published in the Business Forum Newspaper (printed newspaper)</p></i><h4 style='font-style: italic;'>Author: Surphi28 - spiderum</h4>\",\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      '74a4bc92-58d0-41cc-8a29-7d7f38cde68e',\r\n      '3d5b3278-9f24-4f91-b57a-e981614fba9c',\r\n      '782574c3-236f-451a-bf09-47e3091279bc',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '782574c3-236f-451a-bf09-47e3091279bc',\r\n    id: 13,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/tech-design-db.jpg',\r\n    date: '26/10/2020',\r\n    title: 'Chọn công nghệ nào khi xử lý dữ liệu ?',\r\n    content:\r\n      '<i><h2>Hiện nay, tôi thấy nhiều người, nhiều doanh nghiệp luôn \"nổ\" rằng mình xử lý dữ liệu lớn, xử lý dữ liệu với các công nghệ hàng đầu....</h2></i><p>Hiện nay, tôi thấy nhiều người, nhiều doanh nghiệp luôn \"nổ\" rằng mình xử lý dữ liệu lớn, xử lý dữ liệu với các công nghệ hàng đầu. Trong khi, dữ liệu lớn như nào, lớn bao nhiêu, tốc độ tăng trưởng dữ liệu là bao nhiêu thì không thấy nói.</p><p>Công nghệ tốt khi nó được sử dụng đúng chỗ, đúng cách. Đừng lấy dao mổ trâu ra để thịt gà</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/tech-design-db.jpg\" /><p></p></div><p>Thôi nói vui vậy thôi chứ công việc của sale là phải thế mà :D :D</p><p>Vào chủ đề chính, Chúng ta nên chọn những công cụ nào để phân tích hay bóc ta dữ liệu từ dữ liệu thô.</p><p>Công nghệ đầu tiên ai cũng nghĩ tới đó là Hadoop</p><h3>#1. Hadoop</h3><i><h4>1.1. Giới thiệu</h4></i><p>Ngắn gọn mà nói thì Hadoop gồm có 2 phần chính là HDFS - hệ thống lưu trữ file phân tán và Map-Reduce - Một hệ thống dựa trên YARN dành cho việc xử lý song song lượng lớn các tập dữ liệu. <a href=\"https://www.noron.vn/post/hadoop-1-tong-quan-ve-hadoop-efstdzvdbu9\" target=\"blank\">Các bạn có thể đọc chi tiết tại đây</a></p><div style=\"text-align: center;\"><img src=\"/media/images/insights/tech-design-db-1.png\" /><p></p></div><i><h4>1.2. Khi nào thì nên dùng</h4></i><p>- Khi bạn muốn lưu trữ dữ liệu một cách an toàn mà không muốn phải sử dụng RAID.</p><p>- Khi bạn đang thiết kế hệ thống xử lý phân tán mà bạn có thể query dữ liệu từ 1 server mà dữ liệu không có trên đó.</p><p>- Khi bạn muốn xử lý mọi thứ trên file thay vì CSDL truyền thống :D</p><p>- Khi bạn muốn có một hệ thống lưu trữ vừa tiết kiệm về chi phí lại có thể mở rộng theo chiều ngang mà không sợ server đã hết slot cắm ổ cứng.</p><p>Hadoop có dùng để tính toán được không ? Câu trả lời là Có. Bạn có thể dùng MapReduce để tính toán nhưng giờ đây người ta đã ít dùng đi vì <b>chậm</b> vì tốc độ tính toán phụ thuộc và tốc độc đọc ghi của ổ cứng và việc code nó khá  <b>phức tạp</b> phải định nghĩa hay code map như nào và reduce như nào.</p><p>Để giải quyết 2 vấn đề đó thì Spark được sinh ra.</p><h3>#2. Spark</h3><i><h4>2.1. Giới thiệu</h4></i><p>Spark là một framework tính toán phân tán hay nói cách khác Spark là một framework giúp bạn tính toán song song trên nhiều máy/server.</p><i><h4>2.2. Khi nào nên dùng</h4></i><p>- Khi bạn có dữ liệu hàng chục GB trở lên.</p><p>- Khi bạn phải join, sum,... cả trăm triệu hay cả tỉ bản ghi.</p><p>- Khi bạn muốn áp dụng các thuật toán ML cùng với dữ liệu lớn của bạn.</p><p>- Khi bạn có nhiều RAM</p><p>- Khi nghiệp vụ tính toán của bạn phức tạp.</p><p>Còn đối với dữ liệu chỉ có vài GB hay nghiệp vụ đơn giản ví dụ như đếm số dòng hay đếm số user thì tôi khuyên bạn không nên dùng vì nó phức tạp không cần thiết mà khéo khi lại còn chậm. Thay vào đó, khi bạn xử lý dữ liệu nhỏ hay tầm trung thì t khuyên bạn nên sử dụng AWK.</p><h3>#3. AWK</h3><i><h4>3.1. Giới thiệu</h4></i><p>Awk là một ngôn ngữ lập trình hỗ trợ thao tác dễ dàng đối với kiểu dữ liệu có cấu trúc và tạo ra những kết quả được định dạng. Nó được đặt tên bằng cách viết tắt các chữ cái đầu tiên của các tác giả: Aho, Weinberger và Kernighan.</p><p>AWK được tính hợp sẵn trong các hệ điều hành unix và linux nên chúng ta không cần cài đặt mà vẫn sử dụng bình thường. Rất tiện lợi phải không nào.</p><i><h4>3.2. Khi nào nên sử dùng</h4></i><p>Đơn giản thôi khi dữ liệu < vài chục GB và nghiệp vụ của bạn không quá phức tạp.</p><p>Vd: Bạn có file user.txt:</p><p>id1|abc<br/>id2|cdx<br/>.............</p><p>Bạn cần đếm xem trong file user.txt có tất cả bao nhiêu user (không được lặp) thì bạn có thể chạy câu lệnh đơn giản sau:</p><p>more user.txt | awk -F \"|\" \\'{print $1}\\' | sort -u | wc -l</p><p>Chỉ sau vài giây hoặc ít hơn bạn đã có kết quả thay vì bạn cài đặt spark và rồi viết một câu spark sql dài ngoằng rồi đợi load file rồi đợi tính toán rồi đợi collect dữ liệu (nếu bạn muốn kết quả là một dạng số - hay biến nguyên thủy thay vì dạng RDD).</p><p>Chỉ sau vài giây hoặc ít hơn bạn đã có kết quả thay vì bạn cài đặt spark và rồi viết một câu spark sql dài ngoằng rồi đợi load file rồi đợi tính toán rồi đợi collect dữ liệu (nếu bạn muốn kết quả là một dạng số - hay biến nguyên thủy thay vì dạng RDD).</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/tech-design-db-2.png\" /><p></p></div><p>Còn nếu bạn vẫn thích hay quen \"hard core\" hay nghiệp vụ của bạn cũng khá phức tạp thì bạn có tham khảo Pandas</p><h3>#4. Pandas</h3><i><h4>4.1. Giới thiệu</h4></i><p>Về cơ bản thì Pandas có cách code khá giống với Spark. Bạn nào quen dùng Spark thì dùng Pandas cũng thế dễ dàng hơn.</p><p>Về tổ chức dữ liệu thì Padas sẽ query của gần như sql và dữ liệu được tổ chức thành dạng bảng với tên gọi là data frame.</p><i><h4>4.2. Khi nào nên dùng</h4></i><p>- Khi file bạn ở tầm trung trở xuống.</p><p>- Số bản ghi không quá nhiều.</p><p>- Nghiệp vụ phức tạp.</p><p>- Không cần xử lý song song và phân tán.</p><p>- Khi server bạn khỏe :D</p><p>Trên đây là 4 công cụ tôi hay dùng để xử lý dữ liệu. Tùy vào độ lớn, sự phức tạp của bài toán mà tôi chọn lấy một công cụ xử lý. À tất nhiên ngoài 4 công cụ này ra thì còn nhiều nữa nhưng tạm thời dừng ở những thứ phổ biến này thôi. Tôi hi vọng bài viết này sẽ giúp cho các bạn chọn lựa được công cụ phù hợp với bài toán của mình tránh tình trạng dùng dao mổ trâu để giết gà như tôi đã từng mắc phải :D</p><h4 style=\\'font-style: italic;\\'>Tác giả: Đức Thắng - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      '2a2b2e74-ec50-4e2c-b660-42d3b5156732',\r\n      '74a4bc92-58d0-41cc-8a29-7d7f38cde68e',\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: '782574c3-236f-451a-bf09-47e3091279bc',\r\n    id: 14,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/tech-design-db.jpg',\r\n    date: '26/10/2020',\r\n    title: 'What technology to choose when processing data?',\r\n    content:\r\n      '<i><h2>Currently, I see many people, many businesses always \"explode\" that they handle big data, process data with leading technologies.</h2></i><p>Nowadays, I see many people, many businesses always \"explode\" that they process big data, process data with leading technologies. While, how big the data is, how big it is, how much data growth is, it\\'s not said.</p><p>Technology is good when it\\'s used in the right place, in the right way. Don\\'t take out a buffalo scalpel to get chicken.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/tech-design-db.jpg\" /><p></p></div><p>Stop saying it\\'s fun, but the sale\\'s job is to :D :D</p><p>On the main topic, we should choose which tools to analyze or extract data from raw data.</p><p>The first technology everyone thought of was Hadoop.</p><h3>#1. Hadoop</h3><i><h4>1.1. Introduction</h4></i><p>In short, Hadoop consists of two main parts: HDFS , a distributed file storage system, and Map-Reduce, a YARN-based system for the parallel processing of large amounts of data sets. <a href=\"https://www.noron.vn/post/hadoop-1-tong-quan-ve-hadoop-efstdzvdbu9\" target=\"blank\">You can read the details here.</a></p><div style=\"text-align: center;\"><img src=\"/media/images/insights/tech-design-db-1.png\" /><p></p></div><i><h4>1.2. When to use</h4></i><p>When you want to store data securely without having to use RAID.</p><p>When you are designing a distributed processing system, you can query data from a server that the data is not on.</p><p>- When you want to process everything on the file instead of the traditional database :D</p><p>- When you want a storage system that is both cost-saving and can expand horizontally without fear of the server running out of hard drive slots.</p><p>Can Hadoop be used for calculation? The answer is yes.  You can use MapReduce to calculate but now people have less use because it is slow because the computing speed depends and the read-write speed of the hard drive and how to code it quite complex to define or code map and how to reduce.</p><p>To solve those two problems, Spark was born.</p><h3>#2. Spark</h3><i><h4>2.1. Introduction</h4></i><p>Spark is a distributed computing framework or in other words Spark is a framework that helps you calculate in parallel on multiple servers.</p><i><h4>2.2. When to use</h4></i><p>- When you have data of tens of GB or more.</p><p>When you have to join, sum,... Hundreds of millions or billions of records.</p><p>When you want to apply ML algorithms along with your big data.</p><p>When you have a lot of RAM.</p><p>When your calculations are complicated.</p><p>As for data with only a few GB or simple business such as counting lines or counting the number of users, I recommend not using it because it is unnecessarily complicated but skillful when it is still slow. Instead, when you process small or mid-range data, it\\'s recommended to use AWK.</p><h3>#3. AWK</h3><i><h4>3.1. Introduction</h4></i><p>Awk is a programming language that supports easy operation of structured data types and produces formatted results. It is named by abbreviating the first letters of the authors: Aho, Weinberger and Kernighan.</p><p>AWK is available in unix and linux operating systems so we do not need to install and still use normally. It\\'s very convenient, isn\\'t it?</p><i><h4>3.2. When to use</h4></i><p>It\\'s simple when the data < a few tens of GB and your business isn\\'t too complicated.</p><p>For example, you have a user file.txt:</p><p>id1|abc<br/>id2|cdx<br/>.............</p><p>You need to count how many users there are in the user file.txt there are all the users (not repeated), you can run the following simple statement:</p><p> more user.txt | awk -F \"|\" \\'{print $1}\\' | sort -u | wc -l</p><p>After just a few seconds or less you get the result instead of you installing spark and then write a long spark sql sentence and then wait for the load file and wait for the calculation and then collect the data (if you want the result to be some kind of number - or primitive variable instead of RDD).</p><p>That\\'s just a little bit of knowledge about a few basic shell command lines that you can handle small files very quickly and then need a big framework :D</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/tech-design-db-2.png\" /><p></p></div><p>If you still like or know \"hard core\" or your business is also quite complicated, you have a reference to Pandas</p><h3>#4. Pandas</h3><i><h4>4.1. Introduction</h4></i><p>Pandas basically code quite similar to Spark. Anyone who is used to Spark is easier to use Pandas.</p><p>Pandas basically code quite similar to Spark. Anyone who is used to Spark is easier to use Pandas.</p><i><h4>4.2. When to use</h4></i><p>- When your file is in the mid-range or below.</p><p>- The number of records is not too much.</p><p>- Complex business.</p><p>- No need for parallel and scattered processing.</p><p>- When the server is \"strong\" :D</p><p>Here are four tools I use to process data. Depending on the magnitude, the complexity of the problem that I choose to take a processing tool. Well, of course, there are many more of these four tools, but for the time being, it\\'s just these popular things. I hope this article will help you choose the right tool for your problem to avoid using a buffalo scalpel to kill chickens like I did :D</p><h4 style=\\'font-style: italic;\\'>Author: Duc Thang - spiderum</h4>',\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      '2a2b2e74-ec50-4e2c-b660-42d3b5156732',\r\n      '74a4bc92-58d0-41cc-8a29-7d7f38cde68e',\r\n      '31106c94-068c-4ea8-9f12-0d3222831b66',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: 'fa53e091-1f16-43d8-9b07-f69c0868b516',\r\n    id: 15,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/facebook-leason.jpeg',\r\n    date: '05/10/2021',\r\n    title: 'Facebook tạch và bài học làm phần mềm tin cậy',\r\n    content:\r\n      '<i><h2>Ai cũng biết, để bắt đầu một tuần làm việc hiệu quả thì ai cũng vào Facebook để cuộn chuột một tiếng. Sáng nay, như thường lệ, 10h...</h2></i><p>Ai cũng biết, để bắt đầu một tuần làm việc hiệu quả thì ai cũng vào Facebook để cuộn chuột một tiếng. Sáng nay, như thường lệ, 10h sáng mình định vào nhưng Facebook.com đã tạch. Mình bèn nhắn ông bạn làm đấy hỏi thăm xem có cần vay tiền mua thẻ cào điện thoại để các bạn liên lạc với nhau bằng tin nhắn SMS không. Trong năm 2020, tập đoàn Facebook thu nhập 32 tỷ đô, vậy mỗi ngày họ thu được 100 triệu đô. Tạch một nửa ngày không ai vào được (cho rằng nó không ảnh hưởng đến uy tín gì hết) là đi tong 50 triệu đô. Cho rằng thu nhập của người Việt là 500 đô la một tháng, số tiền này đủ để nuôi sống 100 ngàn người trong một tháng. Lỗi gây ra như vậy là một lỗi rất, rất, rất đắt tiền.</p><p>Mình nhớ hôm nọ bố mình cũng có lần gọi điện hỏi tại sao cái máy tính Chromebook tự nhiên không cho bố login vào tài khoản và báo sai mật khẩu. Sau khi giúp bố 2-3 tiếng thì mình đi đến kết luận có một lỗi gì đó phía cái Chromebook chứ không phải tại bố mình và phải xóa đi làm lại. Tiếc rằng tất cả các tài liệu download trên máy tính đó phải xóa hết vì chiếc máy này được thiết kế để lưu dữ liệu đã mã hóa. Nếu chiếc máy báo sai mật khẩu thì không tài thánh nào lấy được dữ liệu ra. Sau đó vài ngày thì mình đọc được một bài về lỗi này: <a href=\"https://www.androidpolice.com/2021/07/20/a-new-chrome-os-91-update-is-breaking-chromebooks-like-a-bull-in-a-china-shop/\" target=\"blank\">Một kỹ sư nào đó viết thiếu một dấu \"&\" khi cần viết \"&&\"</a>. Tiếc rằng lúc đó mình không biết. Đó cũng là một lỗi rất đắt tiền.</p><p>Ngày xưa, thời còn mới vào đại học mình có quản trị một diễn đàn. Thường để thêm tính năng mới, hoặc chuyển cái này thành cái kia để nâng cao hiệu năng, mình phải khóa cái diễn đàn lại để tiến hành thay đổi, xong rồi sẽ mở lại. Việc này thường mình làm vào đêm. Thường mình chỉ dự định mỗi lần mất một hai tiếng đồng hồ nhưng sự thật diễn đàn phải khóa suốt đêm và mình thức suốt đêm vì lỗi lên lỗi xuống. Một tính năng mới ra lò là phải theo dõi và sửa lỗi mất vài ngày, mọi người réo tên, thì mới có thể bình ổn được. Lúc bấy giờ mình tự hỏi làm sao mà người ta có thể làm được những phần mềm, website ổn định 24/7 được.</p><p>Công việc mà mình làm giờ (lái Ta-xi) có một từ để chỉ những lỗi nào làm cho xe không khởi động được phải cẩu đi, hoặc đang đi trên đường không chạy được nữa, gọi là Vehicle-off-the-Road (VoR). Đó là một trong những lỗi tồi tệ nhất của các loại tồi tệ. Rất hiếm khi chuyện này xảy ra, nhưng nếu xảy ra thì người được phân công tìm hiểu lỗi này thì phải bỏ tất cả các việc mình đang làm để tìm hiểu và giải quyết VoR ngay lập tức. Sau khi tìm hiểu xong thì sẽ xem việc gì xảy ra để dẫn đến tình trạng như vậy.</p><p>Các vấn đề tồi tệ xảy ra đều có thể quy lỗi cho một dòng code sai mà một kỹ sư nào đó code vào một lúc nào đó. Suy nghĩ của người bình thường là nếu ai gây ra lỗi đắt tiền vậy, ảnh hưởng tới nhiều khách hàng như vậy, thì sẽ bị đuổi việc, kỷ luật vân vân. Nhưng trái lại, thường cách giải quyết của một tổ chức có sự điều hành tốt hoàn toàn ngược lại: Họ sẽ tìm hiểu tổ chức của họ đã làm gì để lỗi lớn như vậy mà lại để vào tay một người. Sự thật là việc kỷ luật nặng người gây ra lỗi không làm cho người ta ít mắc lỗi hơn. Không ai cố gắng làm ra lỗi và không ai tránh khỏi làm ra lỗi. Vấn đề là quy trình làm sao để cho ai làm ra lỗi như vậy thì ta tìm ra trước khi nó gây ra hậu quả. Quy trình càng tốt thì khả năng đó càng ít xảy ra, và để cải tiến hiệu năng thì phải cải tiến quy trình, chứ không phải cải tiến việc truy cứu trách nhiệm hay tăng hình phạt với người gây lỗi. Quy trình đó có thể là ở chỗ phải có người kiểm tra code của mình trước khi thay đổi, phải chạy thử, phải có quy trình kiểm tra chất lượng, phải đánh giá được khả năng xấu nhất có thể xảy ra, phải có phương án B, phải xây dựng tính cẩn trọng, và nhiều kỹ năng khác mà tổ chức phải vạch ra cho mỗi cá nhân.</p><p>Một phần mềm hay dự án hiện đại là kết quả của rất nhiều cá nhân hợp tác với nhau. Một trang web, hệ điều hành, phần mềm ứng dụng đều là kết quả làm việc của hàng ngàn người qua rất nhiều thời gian. Số lượng lỗi thường lũy tiến với số lượng code và người làm, cái gì càng phức tạp, càng nhiều người làm thì khả năng hiểu lầm giữa các cá nhân với nhau càng lớn, khả năng lỗi tiềm ẩn càng lớn. Thế mà con người ta vẫn làm được những dự án phức tạp tưởng đến mức không thể.</p><p>Con người đã làm được những việc như phóng xe tự hành lên sao Hỏa - người trên Trái đất sẽ bị lag với những gì đang diễn ra trên sao Hỏa khoảng 20 phút, không có tài thánh nào nhanh tay cứu được một lỗi trên tàu vũ trụ ở sao Hỏa.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/facebook-leason.jpeg\" /><p></p></div><p>Sắp tới người ta sẽ phóng kính viễn vọng James Webb lên không trung, là kết quả của thiết kế nghiên cứu từ năm 1996 tới nay của rất nhiều người. Chiếc kính viễn vọng này có một tấm phản quang kích thước gói gọn trong đầu tên lửa kích thước 5x16m, nhưng khi lên đến quỹ đạo, nó tự bung ra với kích thước 14x21m. Việc này diễn ra hoàn toàn tự động, phải làm việc được 100% trên một môi trường vô cùng lạ lẫm khắc nghiệt mà chưa bao giờ ta được trực tiếp thử nghiệm cả. Nếu chỉ có một lỗi sai, nó sẽ làm tiêu tan 10 tỷ đô la và 25 năm làm việc miệt mài của bao nhiêu người giỏi nhất của các loại giỏi trên khắp thế giới. Ai dám nghĩ mình sẽ dám tham gia vào những việc đó thôi, đã là rất phi thường. Chiếc kính viễn vọng này là minh chứng cho sự thông thái siêu thường của con người khi người ta kết hợp lại với nhau.</p><p>Khi mình làm việc code diễn đàn những năm đầu đại học, chạy một cái diễn đàn lỗi lên xuống, mình không thể nào tưởng tượng nổi tới một lúc nào đó mình sẽ tham gia vào những việc mà ta làm nhất định phải trơn tru. Tới giờ, mình cảm thấy diễm phúc của những gì mình đang làm là sự tự tin vào việc mình có thể được làm những việc đòi hỏi sự chính xác tin cậy cao độ, vì sự mất mát khi ta mắc lỗi là rất lớn. Bí quyết đó chắc chắn không phải là cách nghĩ đi phạt, đi cấm, đi kiểm duyệt, đi đổ lỗi. Vì tất cả những hình thức đó sẽ một phần ngăn cản người ta làm được việc. Một phần bí quyết đó là sự trung dung bình tĩnh để có những quy trình làm người tham gia ít mắc lỗi hơn, và nếu có cá nhân nào mắc lỗi thì ảnh hưởng xấu được giảm thiểu.</p><p>Và khi ta làm tất cả điều đó rồi mà vẫn có lỗi, thì nhận lỗi, xin lỗi, sửa lỗi, rồi đi tiếp. Như Facebook hôm nay.</p><h4 style=\\'font-style: italic;\\'>Tác giả: Curly Rae Braces - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      'e8388136-980a-4235-baeb-06e759345678',\r\n      '782574c3-236f-451a-bf09-47e3091279bc',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: 'fa53e091-1f16-43d8-9b07-f69c0868b516',\r\n    id: 16,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/facebook-leason.jpeg',\r\n    date: '05/10/2021',\r\n    title: 'Facebook and lessons in making software reliable',\r\n    content:\r\n      \"<i><h2>Everyone knows that to start a productive week, everyone takes to Facebook to scroll the mouse for an hour. This morning, as usual, 10 a.m.</h2></i><p>Everyone knows that to start a productive week, everyone takes to Facebook to scroll the mouse for an hour. This morning, as usual, I was going to go in at 10 a.m., but Facebook.com was gone. I texted my friend to ask if I needed to borrow money to buy a phone scratch card for you to contact each other by SMS. In 2020, Facebook will make $32 billion, so it's $100 million a day. Half a day no one gets in (believing it doesn't affect credibility at all) is going to $50 million. Given that vietnamese income is $500 a month, this amount is enough to feed 100,000 people in a month. Such an error is a very, very, very expensive error.</p><p>I remember my dad calling the other day asking why his Chromebook computer naturally didn't let him login into his account and misrepresess his password. After giving my dad 2-3 hours, I came to the conclusion that there was a mistake on the Chromebook and not my father and had to delete it again and again. Unfortunately, all the downloaded documents on that computer have to be deleted because this machine is designed to save encrypted data. If the machine is wrong in its password, no talent can get the data out. A few days later, I read an article about this error: <a href=\\\"https://www.androidpolice.com/2021/07/20/a-new-chrome-os-91-update-is-breaking-chromebooks-like-a-bull-in-a-china-shop/\\\" target=\\\"blank\\\">An engineer missed a \\\"&\\\" sign when it needed to be written \\\"&&\\\"</a>. I'm sorry I didn't know at the time. It's also a very expensive mistake.</p><p>In the old days, when I was in college, I had a forum. Often to add new features, or turn one to the other to improve performance, I have to lock the forum to make changes, then I will open again. This usually works at night. Normally I only plan to take an hour or two at a time but the truth is the forum has to be locked throughout the night and I stay up all night because of the error up and down. A new feature is to monitor and fix the error that takes a few days, people shout their names, to be able to stabilize. At that time, I wondered how people could make stable software and websites 24/7.</p><p>The work I do now (driving Ta-xi) has a word for what makes the car fail to start having to be hosped, or is on the road no longer running, called Vehicle-off-the-Road (VoR). It's one of the worst mistakes of all kinds. It's very rare that this happens, but if it happens, the person assigned to find out about this error must give up all the work he is doing to learn and solve VoR immediately. Once you've done that, we'll see what happens to lead to this situation.</p><p>Bad problems can be blamed on a wrong line of code that an engineer code at some point. The ordinary person's thinking is that if someone made such an expensive mistake, affecting so many customers, he would be fired, disciplined and so on. But on the contrary, often the solution of a well-run organization is quite the opposite: They will find out what their organization has done to make such a big mistake and put it in the hands of a person. The truth is that severely disciplining the person who makes the mistake doesn't make people make fewer mistakes. No one tries to make a mistake and no one avoids making mistakes. The problem is that the process of making such an error is found before it causes consequences. The better the process, the less likely that is to happen, and to improve performance, it is important to improve the process, not to improve the prosecution of responsibility or increase penalties for the person who makes the mistake. That process may be that someone must check their code before changing, test, have a quality check process, evaluate the worst possible possibility, have a plan B, build caution, and many other skills that the organization must outline for each individual.</p><p>A modern software or project is the result of a lot of individuals working together. A website, operating system, application software are the result of thousands of people over a lot of time. The number of errors is often progressive with the number of code and the person doing it, the more complex what is done, the greater the likelihood of interpersonal misunderstandings, the greater the likelihood of potential errors. People still do projects that are so complex that they can't.</p><p>Humans have done things like launch rovers to Mars – people on Earth will lag with what's going on on Mars for about 20 minutes, no talent can quickly save a bug on a mars spacecraft. </p><div style=\\\"text-align: center;\\\"><img src=\\\"/media/images/insights/facebook-leason.jpeg\\\" /><p></p></div><p>The James Webb Telescope will be launched into the air, the result of a 1996 research design by many people. The telescope has a 5x16m-sized reflector encapsulated in the rocket's head, but when it reaches orbit, it deploys itself at a size of 14x21m. This happens completely automatically, having to work 100% on a very strange and harsh environment that we have never directly tested. If there is only one mistake, it will dissipate $10 billion and 25 years of hard work by the best of all kinds around the world. Who would have thought that I would dare to participate in these things, it was extraordinary. This telescope is a testament to the extraordinary wisdom of man when people are put together.</p><p>When I worked as a forum coder in my early college years, running a bug forum up and down, I couldn't imagine at some point that I would be involved in what we were doing that had to be smooth. So far, I feel blessed that what I'm doing is confidence in what I can do that requires high levels of trust, because the loss when we make mistakes is enormous. That secret is definitely not how to think about punishing, banning, censoring, blaming. Because all of these forms will partly prevent people from doing the job. Part of the secret is a calm neutrality to have processes that make participants less likely to make mistakes, and if any individual makes a mistake, the adverse effects are minimized.</p><p>And when we do all that and still make mistakes, we apologize, apologize, fix it, and move on. Like Facebook today.</p><h4 style='font-style: italic;'>Author: Curly Rae Braces - spiderum</h4>\",\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      'e8388136-980a-4235-baeb-06e759345678',\r\n      '782574c3-236f-451a-bf09-47e3091279bc',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: 'e8388136-980a-4235-baeb-06e759345678',\r\n    id: 17,\r\n    type: 'Bài viết',\r\n    thumbnail: '/media/images/insights/vnpay-app.png',\r\n    date: '28/09/2021',\r\n    title: 'Tích hợp cổng thanh toán Vn-Pay với ứng dụng của bạn',\r\n    content:\r\n      '<i><h2>Bài viết trước mình có đề cập đến một số hình thức thanh toán và một số tiêu chí lựa chọn bên thứ ba để tích hợp hệ thống thanh toán...</h2></i><p>Bài viết này mình chia sẻ sơ lược về cách tích hợp thanh toán với vn-pay mà mình đã từng làm qua (Đây không phải là bài viết quảng cáo cho bên thứ ba nào nhé, nếu bên nào muốn có bài viết riêng thì liên hệ với mình 😄). </p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app.png\" /><p></p></div><h3>Bắt đầu sơ lược chút nhé!</h3><p>VNPAY là cổng thanh toán trung gian kết nối các đơn vị kinh doanh với ngân hàng, cho phép khách hàng sử dụng thẻ/tài khoản ngân hàng, công nghệ thanh toán bằng mã QR (QR Code) trên ứng dụng Mobile Banking để thanh toán các giao dịch. </p><p>Có 3 dạng tích hợp: Tích hợp code, tích hợp vào website sử dụng phần mềm mở, và tích hợp thông qua mã nhúng.</p><p>Ở đây mình đã làm với tích hợp code nên mình chỉ đề cập đến nó làm ví dụ thôi nhé! Nếu muốn tìm hiểu sâu hơn thì bạn hãy liên hệ và đọc tài liệu do bên <a href=\"https://sandbox.vnpayment.vn/apis/\" target=\"blank\">vn-pay cung cấp</a> nhé </p><p>Để nắm được cách tích hợp như nào thì bạn phải nắm được quá trình thanh toán mà vn-pay quy định trước đã. Nó sẽ gồm 6 bước sau:</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app-1.png\" /><p></p></div><p>Bước 1: Khách hàng thực hiện mua hàng trên Website TMĐT và tiến hành Thanh toán trực tuyến cho Đơn hàng</p><p>Bước 2: Website TMĐT thành lập yêu cầu thanh toán dưới dạng URL mang thông tin thanh toán và chuyển hướng khách hàng sang Cổng thanh toán VNPAY bằng URL đó. Cổng thanh toán VNPAY xử lý yêu cầu Thanh toán mà Website TMĐT gửi sang. Khách hàng tiến hành nhập các thông tin được yêu cầu để thực hiện việc Thanh toán.</p><p>Bước 3,4: Khách hàng nhập thông tin để xác minh tài khoản Ngân hàng của khách hàng và xác thực giao dịch.</p><p>Bước 5: Giao dịch thành công tại Ngân hàng, VNPAY tiến hành:   + Chuyển hướng khách hàng về Website TMĐT (vnp_ReturnUrl)   + Thông báo cho Website TMĐT kết quả thanh toán của khách hàng thông qua IPN URL. Merchant cập nhật kết quả thanh toán VNPAY gửi tại URL này.</p><p>Bước 6: Merchant hiển thị kết quả giao dịch tới khách hàng</p><p>Sau khi nắm được bước thanh toán rồi thì việc của bạn là làm bước số 2 và số 5. Dưới đây là sơ đồ mình tích hợp vào trong hệ thống của mình bạn có thể tham khảo.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app-2.png\" /><p></p></div><p>Đây là sơ đồ gồm 16 bước cho một hệ thống mà không phân chia backend và frontend bao gồm:</p><p>Bước 1. Người dùng hình thành giao dịch</p><p>Bước 2. Hệ thống của bạn bắt đầu tạo giao dịch và lưu giao dịch vào cơ sở dữ liệu với trạng thái chờ</p><p>Bước 3. Bạn tạo một đường dẫn thanh toán theo rule và những tham số đâu vào mà trang <a href=\"https://sandbox.vnpayment.vn/apis/docs/huong-dan-tich-hop/#t%25E1%25BA%25A1o-url-thanh-to%25C3%25A1n\" target=\"blank\">vn-pay cung cấp</a></p><p>Bước 4. Chuyển hướng trang của bạn qua trang thanh toán của vn-pay</p><p>Bước 5, 6. Nhúng trang thanh toán này vào hệ thống của bạn tạo thành một hệ thống thống nhất với return url mà vn-pay trả cho bạn</p><p>Bước 7,8,9,10,11,12. Đây là giao dịch của khách hàng với trang của vn-pay để có được thông tin và số tiền thanh toán.</p><p>Bước 13. Vn-pay sẽ trả kết quả cho bạn thông qua một api mà bạn sẽ phải public ra để vn-pay kết nối tới. Nó chứa những tham số và thông tin thành công hay thất bại kèm những thông số chữ ký bảo mật.</p><p>Bước 14. Nhận kết quả từ vn-pay và kiểm tra giao dịch thanh toán, thông tin và chữ ký bảo mật.</p><p>Bước 15. Xử lý trạng thái giao dịch phần hệ thống của bạn đã tạo trước đó và những tác vụ quy trình liên quan tùy thuộc vào nghiệp vụ của bạn</p><p>Bước 16. Thông báo cho khách hàng giao dịch thành công hay thất bại</p><p>Trên đây là quy trình tích hợp với vn-pay, code mẫu thì trong tài liệu của vn-pay có sẵn, bạn có thể tìm đọc.</p><p>Ngoài ra thì một số trang SPA (single page application) chia tách frontend và backend thì khi tích hợp sẽ phải chú ý rằng vn-pay sẽ nằm giữa FE và BE, vn-pay không chấp nhận việc chỉ tích hợp với BE vì họ cho rằng không bảo mật và sẽ không chịu trách nhiệm cho các vấn đề liên quan nếu bạn kiến trúc theo cách này. Vậy nên dưới đây là sơ đồ tích hợp nêu bạn chia tách FE và BE</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app-3.png\" /><p></p></div><p>Bạn sẽ thấy hệ thống của bạn phải biến đổi để thích nghi với vn-pay trong quá trình thanh toán, việc bạn xử lý sẽ phải nhiều hơn và rườm rà hơn để đảm bảo quá trình bảo mật. </p><p>Không phải một ai cũng chỉ rõ cho bạn sơ đồ kiểu này vì nó đã vô tình để lộ các bước giúp hacker đánh thẳng vào hệ thống của bạn. Vậy nên sơ đồ này chỉ mang tính tham khảo và có phần chủ quan của bản thân mình trong quá trình làm việc phác thảo ra và chỉnh sửa đôi chút để có thể viết một bài viết công khai như vậy. Nhớ nhé đây chỉ là tham khảo!</p><p>Cám ơn các bạn đã đọc và ủng hộ mình.</p><h4 style=\\'font-style: italic;\\'>Tác giả: Ntech - spiderum</h4>',\r\n    languageCode: 'vi',\r\n    refUniquePostKeys: [\r\n      'fa53e091-1f16-43d8-9b07-f69c0868b516',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n      '782574c3-236f-451a-bf09-47e3091279bc',\r\n    ],\r\n  },\r\n  {\r\n    uniquePostKey: 'e8388136-980a-4235-baeb-06e759345678',\r\n    id: 18,\r\n    type: 'Article',\r\n    thumbnail: '/media/images/insights/vnpay-app.png',\r\n    date: '28/09/2021',\r\n    title: 'Integrate Vn-Pay payment gateway with your app',\r\n    content:\r\n      '<i><h2>The previous article mentioned some forms of payment and some criteria for selecting third parties to integrate the payment system...</h2></i><p>This article I share a brief summary of how to integrate payment with vn-pay that I have done (This is not a promotional article for any third party, if any party wants to have their own article, contact me 😄). </p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app.png\" /><p></p></div><h3>Let\\'s start a little bit!</h3><p>VNPAY is an intermediary payment gateway connecting business units with banks, allowing customers to use cards/bank accounts, QR code payment technology on mobile banking application to pay transactions. </p><p>There are three types of integration: Code integration, integration into the website using open software, and integration through embedded code.</p><p>I did it with code integration, so I\\'m just going to mention it as an example! If you want to learn more, please contact and read the documents <a href=\"https://sandbox.vnpayment.vn/apis/\" target=\"blank\">provided by vn-pay</a>. </p><p>To understand how to integrate, you must know the payment process that vn-pay has stipulated in advance. It will consist of the following six steps:</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app-1.png\" /><p></p></div><p>Step 1: Customers make purchases on e-commerce websites and make online payments for orders</p><p>Step 2: E-commerce website establishes a payment request as a URL that carries payment information and redirects customers to VNPAY Payment Gateway using that URL. VNPAY payment gateway handles payment requests sent by e-commerce websites. The customer enters the information required to make the Payment.</p><p>Step 3.4: The customer enters the information to verify the customer\\'s bank account and authenticate the transaction.</p><p>Step 5: Successful transaction at the Bank, VNPAY conducts: + Redirect customers to e-commerce website (vnp_ReturnUrl) + Inform e-commerce website the customer\\'s payment results through IPN URL. Merchant updates vnpay payment results sent at this URL.</p><p>Step 6: Merchant displays transaction results to customers</p><p>Once you have the payment step, it is your job to do steps 2 and 5. Here\\'s a diagram I\\'ve integrated into your system you can refer to.</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app-2.png\" /><p></p></div><p>Here\\'s a 16-step diagram for a system that doesn\\'t divide the backend and frontend including:</p><p>Step 1. Users form transactions</p><p>Step 2. Your system starts creating transactions and saving transactions to a database with a standby state</p><p>Step 3. You create a payment path according to the rules and parameters that <a href=\"https://sandbox.vnpayment.vn/apis/docs/huong-dan-tich-hop/#t%25E1%25BA%25A1o-url-thanh-to%25C3%25A1n\" target=\"blank\">vn-pay provides</a></p><p>Step 4. Redirect your page through your payment page</p><p>Steps 5, 6. Embed this payment page into your system to form a unified system with the return url that vn-pay pays you</p><p>Step 7,8,9,10,11,12. This is a customer\\'s transaction with vn-pay\\'s page to get information and payment amount.</p><p>Step 13. Vn-pay will pay you results through an api that you will have to publicly out to vn-pay connection to. It contains parameters and information of success or failure with security signature parameters.</p><p>Step 14. Get results from vn-pay and check payment transactions, information and security signatures.</p><p>Step 15. Handle the trading status of the part of your system created earlier and related process tasks depending on your business</p><p>Step 16. Notify customers of successful or failed trades</p><p>Above is the process integrated with vn-pay, sample code, in the document of vn-pay available, you can find to read.</p><p>In addition, some SPA (single page application) separating frontend and backend, when integrated will have to pay attention that vn-pay will be between FE and BE, vn-pay does not accept to integrate only with BE because they think it is not secure and will not be responsible for related issues if you architecture in this way. So here\\'s an integrated diagram that says you split FE and BE</p><div style=\"text-align: center;\"><img src=\"/media/images/insights/vnpay-app-3.png\" /><p></p></div><p>You will see your system have to transform to adapt to vn-pay during the payment process, the processing will have to be more and more cumbersome to ensure the security process. </p><p>Not everyone has shown you this type of diagram because it accidentally reveals the steps that help hackers hit your system directly. So this diagram is only a reference and somewhat subjective of yourself in the process of sketching and editing a little to be able to write such a public article. Remember, this is just a reference!</p><p>Not everyone has shown you this type of diagram because it accidentally reveals the steps that help hackers hit your system directly. So this diagram is only a reference and somewhat subjective of yourself in the process of sketching and editing a little to be able to write such a public article. Remember, this is just a reference!</p><h4 style=\\'font-style: italic;\\'>Author: Ntech - spiderum</h4>',\r\n    languageCode: 'en',\r\n    refUniquePostKeys: [\r\n      'fa53e091-1f16-43d8-9b07-f69c0868b516',\r\n      '6d667a4a-5634-4b1b-96c0-853ed9cad85f',\r\n      '782574c3-236f-451a-bf09-47e3091279bc',\r\n    ],\r\n  },\r\n]\r\n\r\nexport const DashboardInsights: IInsight[] = [\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 1,\r\n    thumbnail: 'media/images/home-page/insight_image_08.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Xây dựng nền tảng để phát triển thiết bị y tế thành công',\r\n    title: 'xay-dung-nen-tang-de-phat-trien-thiet-bi-y-te-thanh-cong',\r\n    type: 'Bài viết',\r\n    isHightlight: true,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'vi',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 2,\r\n    thumbnail: 'media/images/home-page/insight_image_09.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Xây dựng nền tảng để phát triển thiết bị y tế thành công',\r\n    type: 'Bài viết',\r\n    title: 'xay-dung-nen-tang-de-phat-trien-thiet-bi-y-te-thanh-cong',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'vi',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 3,\r\n    thumbnail: 'media/images/home-page/insight_image_10.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Xây dựng nền tảng để phát triển thiết bị y tế thành công',\r\n    title: 'xay-dung-nen-tang-de-phat-trien-thiet-bi-y-te-thanh-cong',\r\n    type: 'Bài viết',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'vi',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 4,\r\n    thumbnail: 'media/images/home-page/insight_image_11.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Xây dựng nền tảng để phát triển thiết bị y tế thành công',\r\n    title: 'xay-dung-nen-tang-de-phat-trien-thiet-bi-y-te-thanh-cong',\r\n    type: 'Bài viết',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'vi',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 5,\r\n    thumbnail: 'media/images/home-page/insight_image_12.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Xây dựng nền tảng để phát triển thiết bị y tế thành công',\r\n    title: 'xay-dung-nen-tang-de-phat-trien-thiet-bi-y-te-thanh-cong',\r\n    type: 'Bài viết',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'vi',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 6,\r\n    thumbnail: 'media/images/home-page/insight_image_08.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Building foundations for successful medical device development',\r\n    title: 'building-foundations-for-successful-medical-device-development',\r\n    type: 'Article',\r\n    isHightlight: true,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'en',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 7,\r\n    thumbnail: 'media/images/home-page/insight_image_09.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Building foundations for successful medical device development',\r\n    title: 'building-foundations-for-successful-medical-device-development',\r\n    type: 'Article',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'en',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 8,\r\n    thumbnail: 'media/images/home-page/insight_image_10.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Building foundations for successful medical device development',\r\n    title: 'building-foundations-for-successful-medical-device-development',\r\n    type: 'Article',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'en',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 9,\r\n    thumbnail: 'media/images/home-page/insight_image_11.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Building foundations for successful medical device development',\r\n    title: 'building-foundations-for-successful-medical-device-development',\r\n    type: 'Article',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'en',\r\n  },\r\n  {\r\n    uniquePostKey: 'e31ec27e-659f-4259-97f1-ee5aa37bc145',\r\n    id: 10,\r\n    thumbnail: 'media/images/home-page/insight_image_12.jpg',\r\n    date: '2021-08-05',\r\n    name: 'Building foundations for successful medical device development',\r\n    title: 'building-foundations-for-successful-medical-device-development',\r\n    type: 'Article',\r\n    isHightlight: false,\r\n    shortdDescription: 'Building foundations for successful medical device development',\r\n    languageCode: 'en',\r\n  },\r\n]\r\n","export class ElementStyleUtil {\r\n  public static set(element: HTMLElement, property: string, value?: any, important?: boolean) {\r\n    if (important) {\r\n      element.style.setProperty(property, value, 'important')\r\n    } else {\r\n      element.style.setProperty(property, value)\r\n    }\r\n  }\r\n\r\n  public static get(element: HTMLElement, attributeName: string) {\r\n    return element.style.getPropertyValue(attributeName)\r\n  }\r\n\r\n  public static remove(element: HTMLElement, attibuteName: string) {\r\n    element.style.removeProperty(attibuteName)\r\n  }\r\n}\r\n","export class DataUtil {\r\n  static store: Map<HTMLElement, Map<string, any>> = new Map()\r\n\r\n  public static set(instance: HTMLElement | undefined, key: string, data: any): void {\r\n    if (!instance) {\r\n      return\r\n    }\r\n\r\n    const instanceData = DataUtil.store.get(instance)\r\n    if (!instanceData) {\r\n      const newMap = new Map().set(key, data)\r\n      DataUtil.store.set(instance, newMap)\r\n      return\r\n    }\r\n\r\n    instanceData.set(key, data)\r\n  }\r\n\r\n  public static get(instance: HTMLElement, key: string): any | undefined {\r\n    const instanceData = DataUtil.store.get(instance)\r\n    if (!instanceData) {\r\n      return\r\n    }\r\n\r\n    return instanceData.get(key)\r\n  }\r\n\r\n  public static remove(instance: HTMLElement, key: string): void {\r\n    const instanceData = DataUtil.store.get(instance)\r\n    if (!instanceData) {\r\n      return\r\n    }\r\n\r\n    instanceData.delete(key)\r\n  }\r\n\r\n  public static has(instance: HTMLElement, key: string): boolean {\r\n    const instanceData = DataUtil.store.get(instance)\r\n    if (instanceData) {\r\n      return instanceData.has(key)\r\n    }\r\n\r\n    return false\r\n  }\r\n\r\n  public static getAllInstancesByKey(key: string) {\r\n    const result: any[] = []\r\n    DataUtil.store.forEach((val) => {\r\n      val.forEach((v, k) => {\r\n        if (k === key) {\r\n          result.push(v)\r\n        }\r\n      })\r\n    })\r\n    return result\r\n  }\r\n}\r\n","function getObjectPropertyValueByKey(obj: any, key: string): any | undefined {\r\n  const map = new Map(Object.entries(obj))\r\n  if (obj.hasOwnProperty(key) && map) {\r\n    return map.get(key)\r\n  }\r\n}\r\n\r\n/**\r\n * Generates unique ID for give prefix.\r\n * @param {string} prefix Prefix for generated ID\r\n * @returns {boolean}\r\n */\r\nfunction getUniqueIdWithPrefix(prefix: string | undefined): string {\r\n  const result = Math.floor(Math.random() * new Date().getTime()).toString()\r\n  if (!prefix) {\r\n    return result\r\n  }\r\n\r\n  return `${prefix}${result}`\r\n}\r\n\r\n/* eslint-disable no-useless-escape */\r\nfunction stringSnakeToCamel(str: string): string {\r\n  return str.replace(/(\\-\\w)/g, function (m) {\r\n    return m[1].toUpperCase()\r\n  })\r\n}\r\n\r\nfunction toJSON(value: string | JSON): JSON | undefined {\r\n  if (typeof value !== 'string') {\r\n    return value\r\n  }\r\n\r\n  if (!value) {\r\n    return undefined\r\n  }\r\n\r\n  // (\"'\" => \"\\\"\");\r\n  const result = value\r\n    .toString()\r\n    .split('')\r\n    .map((el) => (el !== \"'\" ? el : '\"'))\r\n    .join('')\r\n  var jsonStr = result.replace(/(\\w+:)|(\\w+ :)/g, function (matched) {\r\n    return '\"' + matched.substring(0, matched.length - 1) + '\":'\r\n  })\r\n  try {\r\n    return JSON.parse(jsonStr)\r\n  } catch {\r\n    return undefined\r\n  }\r\n}\r\n\r\nexport {getObjectPropertyValueByKey, getUniqueIdWithPrefix, stringSnakeToCamel, toJSON}\r\n","import {getUniqueIdWithPrefix} from './_TypesHelpers'\r\n\r\nexport class DOMEventHandlerUtil {\r\n  public static store = new Map()\r\n\r\n  public static on(\r\n    element: HTMLElement,\r\n    selector: string,\r\n    eventName: string,\r\n    callBack: any\r\n  ): string {\r\n    const eventId = getUniqueIdWithPrefix('DOMEvent')\r\n    DOMEventHandlerUtil.store.set(eventId, (e: Event) => {\r\n      const targets = element.querySelectorAll(selector)\r\n      let target: HTMLElement | null = e.target as HTMLElement\r\n      while (target && target !== element) {\r\n        for (let i = 0; i < targets.length; i++) {\r\n          if (target === targets[i]) {\r\n            callBack.call(target, e)\r\n          }\r\n        }\r\n\r\n        if (target.parentElement) {\r\n          target = target.parentElement\r\n        } else {\r\n          target = null\r\n        }\r\n      }\r\n    })\r\n    element.addEventListener(eventName, DOMEventHandlerUtil.store.get(eventId))\r\n    return eventId\r\n  }\r\n\r\n  public static off(element: HTMLElement, eventName: string, eventId: string): void {\r\n    const funcFromStore = DOMEventHandlerUtil.store.get(eventId)\r\n    if (!funcFromStore) {\r\n      return\r\n    }\r\n\r\n    element.removeEventListener(eventName, funcFromStore)\r\n    DOMEventHandlerUtil.store.delete(eventId)\r\n  }\r\n\r\n  public static one(element: HTMLElement, eventName: string, callBack: Function): void {\r\n    element.addEventListener(eventName, function calee(e) {\r\n      // remove event\r\n      if (e.target && e.target.removeEventListener) {\r\n        e.target.removeEventListener(e.type, calee)\r\n      }\r\n\r\n      if (element && e && e.currentTarget) {\r\n        // if (element && element.removeEventListener && e && e.currentTarget) {\r\n        e.currentTarget.removeEventListener(e.type, calee)\r\n      }\r\n\r\n      // call hander\r\n      return callBack(e)\r\n    })\r\n  }\r\n}\r\n","import {DOMEventHandlerUtil} from './_DOMEventHandlerUtil'\r\nimport {ElementStyleUtil} from './_ElementStyleUtil'\r\nimport {getElementOffset} from './DomHelpers'\r\n\r\nexport class ElementAnimateUtil {\r\n  public static animate(\r\n    from: number,\r\n    to: number,\r\n    duration: number,\r\n    update: Function,\r\n    complete?: Function\r\n  ) {\r\n    /**\r\n     * TinyAnimate.easings\r\n     *  Adapted from jQuery Easing\r\n     */\r\n    const easings = {\r\n      linear: function (t: number, b: number, c: number, d: number) {\r\n        return (c * t) / d + b\r\n      },\r\n    }\r\n\r\n    // Create mock done() function if necessary\r\n    if (!complete) {\r\n      complete = function () {}\r\n    }\r\n\r\n    // Animation loop\r\n    // let canceled = false;\r\n    const change = to - from\r\n\r\n    function loop(timestamp: number) {\r\n      var time = (timestamp || +new Date()) - start\r\n\r\n      if (time >= 0) {\r\n        update(easings.linear(time, from, change, duration))\r\n      }\r\n      if (time >= 0 && time >= duration) {\r\n        update(to)\r\n        if (complete) {\r\n          complete()\r\n        }\r\n      } else {\r\n        window.requestAnimationFrame(loop)\r\n      }\r\n    }\r\n\r\n    update(from)\r\n\r\n    // Start animation loop\r\n    const start =\r\n      window.performance && window.performance.now ? window.performance.now() : +new Date()\r\n\r\n    window.requestAnimationFrame(loop)\r\n  }\r\n\r\n  public static animateClass(\r\n    element: HTMLElement,\r\n    animationName: string,\r\n    callBack?: Function\r\n  ): void {\r\n    const animateClasses = animationName.split(' ')\r\n    animateClasses.forEach((cssClass) => element.classList.add(cssClass))\r\n    DOMEventHandlerUtil.one(element, 'animationend', function () {\r\n      animateClasses.forEach((cssClass) => element.classList.remove(cssClass))\r\n    })\r\n\r\n    if (callBack) {\r\n      DOMEventHandlerUtil.one(element, 'animationend', callBack)\r\n    }\r\n  }\r\n\r\n  public static transitionEnd(element: HTMLElement, callBack: Function) {\r\n    DOMEventHandlerUtil.one(element, 'transitionend', callBack)\r\n  }\r\n\r\n  public static animationEnd(element: HTMLElement, callBack: Function) {\r\n    DOMEventHandlerUtil.one(element, 'animationend', callBack)\r\n  }\r\n\r\n  public static animationDelay(element: HTMLElement, value: string) {\r\n    ElementStyleUtil.set(element, 'animation-delay', value)\r\n  }\r\n\r\n  public static animationDuration(element: HTMLElement, value: string) {\r\n    ElementStyleUtil.set(element, 'animation-duration', value)\r\n  }\r\n\r\n  public static scrollTo(element: HTMLElement | null, offset: number, duration: number = 500) {\r\n    let targetPos = element ? getElementOffset(element).top : 0\r\n    let scrollPos =\r\n      window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0\r\n\r\n    if (offset) {\r\n      scrollPos += offset\r\n      targetPos = targetPos - offset\r\n    }\r\n\r\n    const from = scrollPos\r\n    const to = targetPos\r\n\r\n    ElementAnimateUtil.animate(from, to, duration, function (value: number) {\r\n      document.documentElement.scrollTop = value\r\n      // document.body.parentNode.scrollTop = value;\r\n      document.body.scrollTop = value\r\n    }) //, easing, done\r\n  }\r\n  public static scrollTop(offset: number, duration: number) {\r\n    ElementAnimateUtil.scrollTo(null, offset, duration)\r\n  }\r\n}\r\n","import {OffsetModel} from './models/OffsetModel'\r\nimport {ViewPortModel} from './models/ViewPortModel'\r\nimport {ElementStyleUtil} from './_ElementStyleUtil'\r\nimport {DataUtil} from './_DataUtil'\r\nimport {ElementAnimateUtil} from './ElementAnimateUtil'\r\nimport {getObjectPropertyValueByKey, toJSON} from './_TypesHelpers'\r\n\r\nfunction getCSS(el: HTMLElement, styleProp: string) {\r\n  const defaultView = (el.ownerDocument || document).defaultView\r\n\r\n  if (!defaultView) {\r\n    return ''\r\n  }\r\n\r\n  // sanitize property name to css notation\r\n  // (hyphen separated words eg. font-Size)\r\n  styleProp = styleProp.replace(/([A-Z])/g, '-$1').toLowerCase()\r\n\r\n  return defaultView.getComputedStyle(el, null).getPropertyValue(styleProp)\r\n}\r\n\r\nfunction getCSSVariableValue(variableName: string) {\r\n  let hex = getComputedStyle(document.documentElement).getPropertyValue(variableName)\r\n  if (hex && hex.length > 0) {\r\n    hex = hex.trim()\r\n  }\r\n\r\n  return hex\r\n}\r\n\r\nfunction getElementActualCss(el: HTMLElement, prop: any, cache: boolean) {\r\n  let css = ''\r\n\r\n  if (!el.getAttribute('kt-hidden-' + prop) || cache === false) {\r\n    let value\r\n\r\n    // the element is hidden so:\r\n    // making the el block so we can meassure its height but still be hidden\r\n    css = el.style.cssText\r\n    el.style.cssText = 'position: absolute; visibility: hidden; display: block;'\r\n\r\n    if (prop === 'width') {\r\n      value = el.offsetWidth\r\n    } else if (prop === 'height') {\r\n      value = el.offsetHeight\r\n    }\r\n\r\n    el.style.cssText = css\r\n\r\n    // store it in cache\r\n    if (value !== undefined) {\r\n      el.setAttribute('kt-hidden-' + prop, value.toString())\r\n      return parseFloat(value.toString())\r\n    }\r\n    return 0\r\n  } else {\r\n    // store it in cache\r\n    const attributeValue = el.getAttribute('kt-hidden-' + prop)\r\n    if (attributeValue || attributeValue === '0') {\r\n      return parseFloat(attributeValue)\r\n    }\r\n  }\r\n}\r\n\r\nfunction getElementActualHeight(el: HTMLElement) {\r\n  return getElementActualCss(el, 'height', false)\r\n}\r\n\r\nfunction getElementActualWidth(el: HTMLElement, cache?: boolean) {\r\n  return getElementActualCss(el, 'width', false)\r\n}\r\n\r\nfunction getElementIndex(element: HTMLElement) {\r\n  if (element.parentNode) {\r\n    const c = element.parentNode.children\r\n    for (let i = 0; i < c.length; i++) {\r\n      if (c[i] === element) return i\r\n    }\r\n  }\r\n  return -1\r\n}\r\n\r\n// https://developer.mozilla.org/en-US/docs/Web/API/Element/matches\r\nfunction getElementMatches(element: HTMLElement, selector: string) {\r\n  const p = Element.prototype\r\n  const f = p.matches || p.webkitMatchesSelector\r\n\r\n  if (element && element.tagName) {\r\n    return f.call(element, selector)\r\n  } else {\r\n    return false\r\n  }\r\n}\r\n\r\nfunction getElementOffset(el: HTMLElement): OffsetModel {\r\n  // Return zeros for disconnected and hidden (display: none) elements (gh-2310)\r\n  // Support: IE <=11 only\r\n  // Running getBoundingClientRect on a\r\n  // disconnected node in IE throws an error\r\n  if (!el.getClientRects().length) {\r\n    return {top: 0, left: 0}\r\n  }\r\n\r\n  // Get document-relative position by adding viewport scroll to viewport-relative gBCR\r\n  const rect = el.getBoundingClientRect()\r\n  const win = el.ownerDocument.defaultView\r\n  if (win) {\r\n    return {\r\n      top: rect.top + win.pageYOffset,\r\n      left: rect.left + win.pageXOffset,\r\n    }\r\n  }\r\n\r\n  return rect\r\n}\r\n\r\nfunction getElementParents(element: Element, selector: string) {\r\n  // Element.matches() polyfill\r\n  if (!Element.prototype.matches) {\r\n    Element.prototype.matches = function (s) {\r\n      const matches = (document || this.ownerDocument).querySelectorAll(s)\r\n      let i = matches.length\r\n      while (--i >= 0 && matches.item(i) !== this) {}\r\n      return i > -1\r\n    }\r\n  }\r\n\r\n  // Set up a parent array\r\n  const parents:Array<Element> = []\r\n\r\n  let el: Element | null = element\r\n\r\n  // Push each parent element to the array\r\n  for (; el && el !== document.body; el = el.parentElement) {\r\n    if (selector) {\r\n      if (el.matches(selector)) {\r\n        parents.push(el)\r\n      }\r\n      continue\r\n    }\r\n    parents.push(el)\r\n  }\r\n\r\n  // Return our parent array\r\n  return parents\r\n}\r\n\r\nfunction getHighestZindex(el: HTMLElement) {\r\n  let bufferNode: Node | null = el as Node\r\n  let buffer = el\r\n  while (bufferNode && bufferNode !== document) {\r\n    // Ignore z-index if position is set to a value where z-index is ignored by the browser\r\n    // This makes behavior of this function consistent across browsers\r\n    // WebKit always returns auto if the element is positioned\r\n    const position = buffer.style.getPropertyValue('position')\r\n    if (position === 'absolute' || position === 'relative' || position === 'fixed') {\r\n      // IE returns 0 when zIndex is not specified\r\n      // other browsers return a string\r\n      // we ignore the case of nested elements with an explicit value of 0\r\n      // <div style=\"z-index: -10;\"><div style=\"z-index: 0;\"></div></div>\r\n      const value = parseInt(buffer.style.getPropertyValue('z-index'))\r\n      if (!isNaN(value) && value !== 0) {\r\n        return value\r\n      }\r\n    }\r\n\r\n    bufferNode = bufferNode.parentNode\r\n    buffer = bufferNode as HTMLElement\r\n  }\r\n  return null\r\n}\r\n\r\nfunction getScrollTop(): number {\r\n  return (document.scrollingElement || document.documentElement).scrollTop\r\n}\r\n\r\n// https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth\r\nfunction getViewPort(): ViewPortModel {\r\n  return {\r\n    width: window.innerWidth,\r\n    height: window.innerHeight,\r\n  }\r\n}\r\n\r\nfunction insertAfterElement(el: HTMLElement, referenceNode: HTMLElement) {\r\n  return referenceNode.parentNode?.insertBefore(el, referenceNode.nextSibling)\r\n}\r\n\r\nfunction isElementHasClasses(element: HTMLElement, classesStr: string): boolean {\r\n  const classes = classesStr.split(' ')\r\n  for (let i = 0; i < classes.length; i++) {\r\n    if (!element.classList.contains(classes[i])) {\r\n      return false\r\n    }\r\n  }\r\n\r\n  return true\r\n}\r\n\r\nfunction isVisibleElement(element: HTMLElement): boolean {\r\n  return !(element.offsetWidth === 0 && element.offsetHeight === 0)\r\n}\r\n\r\n// Throttle function: Input as function which needs to be throttled and delay is the time interval in milliseconds\r\nfunction throttle(timer: number | undefined, func: Function, delay?: number) {\r\n  // If setTimeout is already scheduled, no need to do anything\r\n  if (timer) {\r\n    return\r\n  }\r\n\r\n  // Schedule a setTimeout after delay seconds\r\n  timer = window.setTimeout(function () {\r\n    func()\r\n\r\n    // Once setTimeout function execution is finished, timerId = undefined so that in <br>\r\n    // the next scroll event function execution can be scheduled by the setTimeout\r\n    timer = undefined\r\n  }, delay)\r\n}\r\n\r\nfunction getElementChildren(element: HTMLElement, selector: string): Array<HTMLElement> | null {\r\n  if (!element || !element.childNodes) {\r\n    return null\r\n  }\r\n\r\n  const result: Array<HTMLElement> = []\r\n  for (let i = 0; i < element.childNodes.length; i++) {\r\n    const child = element.childNodes[i]\r\n    // child.nodeType == 1 => Element, Text, Comment, ProcessingInstruction, CDATASection, EntityReference\r\n    if (child.nodeType === 1 && getElementMatches(child as HTMLElement, selector)) {\r\n      result.push(child as HTMLElement)\r\n    }\r\n  }\r\n\r\n  return result\r\n}\r\n\r\nfunction getElementChild(element: HTMLElement, selector: string): HTMLElement | null {\r\n  const children = getElementChildren(element, selector)\r\n  return children ? children[0] : null\r\n}\r\n\r\nfunction isMobileDevice(): boolean {\r\n  let test = getViewPort().width < +getBreakpoint('lg') ? true : false\r\n\r\n  if (test === false) {\r\n    // For use within normal web clients\r\n    test = navigator.userAgent.match(/iPad/i) != null\r\n  }\r\n\r\n  return test\r\n}\r\n\r\nfunction slide(el: HTMLElement, dir: string, speed: number, callback: any) {\r\n  if (\r\n    !el ||\r\n    (dir === 'up' && isVisibleElement(el) === false) ||\r\n    (dir === 'down' && isVisibleElement(el) === true)\r\n  ) {\r\n    return\r\n  }\r\n\r\n  speed = speed ? speed : 600\r\n  let calcHeight = getElementActualHeight(el)\r\n  let calcPaddingTop: number = 0\r\n  let calcPaddingBottom: number = 0\r\n\r\n  if (ElementStyleUtil.get(el, 'padding-top') && DataUtil.get(el, 'slide-padding-top') !== true) {\r\n    DataUtil.set(el, 'slide-padding-top', ElementStyleUtil.get(el, 'padding-top'))\r\n  }\r\n\r\n  if (\r\n    ElementStyleUtil.get(el, 'padding-bottom') &&\r\n    DataUtil.has(el, 'slide-padding-bottom') !== true\r\n  ) {\r\n    DataUtil.set(el, 'slide-padding-bottom', ElementStyleUtil.get(el, 'padding-bottom'))\r\n  }\r\n\r\n  if (DataUtil.has(el, 'slide-padding-top')) {\r\n    calcPaddingTop = parseInt(DataUtil.get(el, 'slide-padding-top'))\r\n  }\r\n\r\n  if (DataUtil.has(el, 'slide-padding-bottom')) {\r\n    calcPaddingBottom = parseInt(DataUtil.get(el, 'slide-padding-bottom'))\r\n  }\r\n\r\n  if (dir === 'up') {\r\n    // up\r\n    el.style.cssText = 'display: block; overflow: hidden;'\r\n\r\n    if (calcPaddingTop) {\r\n      ElementAnimateUtil.animate(0, calcPaddingTop, speed, function (value: number) {\r\n        el.style.paddingTop = calcPaddingTop - value + 'px'\r\n      })\r\n    }\r\n\r\n    if (calcPaddingBottom) {\r\n      ElementAnimateUtil.animate(0, calcPaddingBottom, speed, function (value: number) {\r\n        el.style.paddingBottom = calcPaddingBottom - value + 'px'\r\n      })\r\n    }\r\n\r\n    ElementAnimateUtil.animate(\r\n      0,\r\n      calcHeight || 0,\r\n      speed,\r\n      function (value: number) {\r\n        el.style.height = (calcHeight || 0) - value + 'px'\r\n      },\r\n      function () {\r\n        el.style.height = ''\r\n        el.style.display = 'none'\r\n\r\n        if (typeof callback === 'function') {\r\n          callback()\r\n        }\r\n      }\r\n    )\r\n  } else if (dir === 'down') {\r\n    // down\r\n    el.style.cssText = 'display: block; overflow: hidden;'\r\n\r\n    if (calcPaddingTop) {\r\n      ElementAnimateUtil.animate(\r\n        0,\r\n        calcPaddingTop,\r\n        speed,\r\n        function (value: number) {\r\n          //\r\n          el.style.paddingTop = value + 'px'\r\n        },\r\n        function () {\r\n          el.style.paddingTop = ''\r\n        }\r\n      )\r\n    }\r\n\r\n    if (calcPaddingBottom) {\r\n      ElementAnimateUtil.animate(\r\n        0,\r\n        calcPaddingBottom,\r\n        speed,\r\n        function (value: number) {\r\n          el.style.paddingBottom = value + 'px'\r\n        },\r\n        function () {\r\n          el.style.paddingBottom = ''\r\n        }\r\n      )\r\n    }\r\n\r\n    ElementAnimateUtil.animate(\r\n      0,\r\n      calcHeight || 0,\r\n      speed,\r\n      function (value: number) {\r\n        el.style.height = value + 'px'\r\n      },\r\n      function () {\r\n        el.style.height = ''\r\n        el.style.display = ''\r\n        el.style.overflow = ''\r\n\r\n        if (typeof callback === 'function') {\r\n          callback()\r\n        }\r\n      }\r\n    )\r\n  }\r\n}\r\n\r\nfunction slideUp(el: HTMLElement, speed: number, callback: any) {\r\n  slide(el, 'up', speed, callback)\r\n}\r\n\r\nfunction slideDown(el: HTMLElement, speed: number, callback: any) {\r\n  slide(el, 'down', speed, callback)\r\n}\r\n\r\nfunction getBreakpoint(breakpoint: string) {\r\n  let value: number | string = getCSSVariableValue('--bs-' + breakpoint)\r\n  if (value) {\r\n    value = parseInt(value.trim())\r\n  }\r\n\r\n  return value\r\n}\r\n\r\nfunction getAttributeValueByBreakpoint(incomingAttr: string): string | JSON {\r\n  let value = toJSON(incomingAttr)\r\n  if (typeof value !== 'object') {\r\n    return incomingAttr\r\n  }\r\n\r\n  const width = getViewPort().width\r\n  let resultKey\r\n  let resultBreakpoint = -1\r\n  let breakpoint\r\n\r\n  for (let key in value) {\r\n    if (key === 'default') {\r\n      breakpoint = 0\r\n    } else {\r\n      breakpoint = getBreakpoint(key) ? +getBreakpoint(key) : parseInt(key)\r\n    }\r\n\r\n    if (breakpoint <= width && breakpoint > resultBreakpoint) {\r\n      resultKey = key\r\n      resultBreakpoint = breakpoint\r\n    }\r\n  }\r\n\r\n  return resultKey ? getObjectPropertyValueByKey(value, resultKey) : value\r\n}\r\n\r\nfunction colorLighten(color: string, amount: number) {\r\n  const addLight = (_color: string, _amount: number) => {\r\n    const cc = parseInt(_color, 16) + _amount\r\n    const cNum = cc > 255 ? 255 : cc\r\n    const c = cNum.toString(16).length > 1 ? cNum.toString(16) : `0${cNum.toString(16)}`\r\n    return c\r\n  }\r\n\r\n  color = color.indexOf('#') >= 0 ? color.substring(1, color.length) : color\r\n  amount = parseInt(((255 * amount) / 100).toString())\r\n  return (color = `#${addLight(color.substring(0, 2), amount)}${addLight(\r\n    color.substring(2, 4),\r\n    amount\r\n  )}${addLight(color.substring(4, 6), amount)}`)\r\n}\r\n\r\nfunction colorDarken(color: string, amount: number) {\r\n  const subtractLight = (_color: string, _amount: number) => {\r\n    const cc = parseInt(color, 16) - amount\r\n    const cNum = cc < 0 ? 0 : cc\r\n    const c = cNum.toString(16).length > 1 ? cNum.toString(16) : `0${cNum.toString(16)}`\r\n    return c\r\n  }\r\n\r\n  color = color.indexOf('#') >= 0 ? color.substring(1, color.length) : color\r\n  amount = parseInt(((255 * amount) / 100).toString())\r\n\r\n  return (color = `#${subtractLight(color.substring(0, 2), amount)}${subtractLight(\r\n    color.substring(2, 4),\r\n    amount\r\n  )}${subtractLight(color.substring(4, 6), amount)}`)\r\n}\r\n\r\nexport {\r\n  getBreakpoint,\r\n  getCSS,\r\n  getCSSVariableValue,\r\n  getElementActualCss,\r\n  getElementActualHeight,\r\n  getElementActualWidth,\r\n  getElementIndex,\r\n  getElementMatches,\r\n  getElementOffset,\r\n  getElementParents,\r\n  getHighestZindex,\r\n  getScrollTop,\r\n  getViewPort,\r\n  insertAfterElement,\r\n  isElementHasClasses,\r\n  isVisibleElement,\r\n  throttle,\r\n  getElementChildren,\r\n  getElementChild,\r\n  isMobileDevice,\r\n  slide,\r\n  slideUp,\r\n  slideDown,\r\n  getAttributeValueByBreakpoint,\r\n  colorLighten,\r\n  colorDarken,\r\n}\r\n","import {DataUtil} from './_DataUtil'\r\nimport {getUniqueIdWithPrefix} from './_TypesHelpers'\r\n\r\nexport interface EventMeta {\r\n  name: string\r\n  callback: Function\r\n  one: boolean\r\n  fired: boolean\r\n}\r\n\r\nexport class EventHandlerUtil {\r\n  static store: Map<string, Map<string, EventMeta>> = new Map()\r\n\r\n  private static setEventMetasByName(name: string, metas: Map<string, EventMeta>): void {\r\n    EventHandlerUtil.store.set(name, metas)\r\n  }\r\n\r\n  private static getEventMetasByName(name: string): Map<string, EventMeta> | undefined {\r\n    return EventHandlerUtil.store.get(name)\r\n  }\r\n\r\n  private static setEventMetaByNameAndHandlerId(\r\n      name: string,\r\n      handlerId: string,\r\n      meta: EventMeta\r\n  ): void {\r\n    let metas = EventHandlerUtil.getEventMetasByName(name)\r\n    if (!metas) {\r\n      metas = new Map()\r\n    }\r\n\r\n    metas.set(handlerId, meta)\r\n    EventHandlerUtil.setEventMetasByName(name, metas)\r\n  }\r\n\r\n  private static getEventsMetaByHandlerId(name: string, handlerId: string): EventMeta | undefined {\r\n    const metas = EventHandlerUtil.store.get(name)\r\n    if (!metas) {\r\n      return\r\n    }\r\n\r\n    return metas.get(handlerId)\r\n  }\r\n\r\n  private static setFiredByNameAndHandlerId(name: string, handerId: string, fired: boolean): void {\r\n    const meta = EventHandlerUtil.getEventsMetaByHandlerId(name, handerId)\r\n    if (!meta) {\r\n      return\r\n    }\r\n\r\n    meta.fired = fired\r\n    EventHandlerUtil.setEventMetaByNameAndHandlerId(name, handerId, meta)\r\n  }\r\n\r\n  private static addEvent(\r\n      element: HTMLElement,\r\n      name: string,\r\n      callback: Function,\r\n      one: boolean = false\r\n  ) {\r\n    const handlerId = getUniqueIdWithPrefix('event')\r\n    DataUtil.set(element, name, handlerId)\r\n    const meta: EventMeta = {\r\n      name: name,\r\n      callback: callback,\r\n      one: one,\r\n      fired: false,\r\n    }\r\n\r\n    EventHandlerUtil.setEventMetaByNameAndHandlerId(name, handlerId, meta)\r\n  }\r\n\r\n  private static removeEvent(element: HTMLElement, name: string) {\r\n    const handlerId = DataUtil.get(element, name)\r\n    if (!handlerId) {\r\n      return\r\n    }\r\n\r\n    const metas = EventHandlerUtil.getEventMetasByName(name)\r\n    if (!metas) {\r\n      return\r\n    }\r\n\r\n    metas.delete(handlerId)\r\n    EventHandlerUtil.setEventMetasByName(name, metas)\r\n  }\r\n\r\n  public static trigger(element: HTMLElement, name: string, target?: any, e?: Event) {\r\n    if (DataUtil.has(element, name)) {\r\n      const handlerId = DataUtil.get(element, name)\r\n      if (!handlerId) {\r\n        return undefined\r\n      }\r\n\r\n      const handler = EventHandlerUtil.getEventsMetaByHandlerId(name, handlerId)\r\n      if (handler) {\r\n        if (handler.name === name) {\r\n          if (handler.one === true) {\r\n            if (handler.fired === false) {\r\n              EventHandlerUtil.setFiredByNameAndHandlerId(name, handlerId, true)\r\n              return handler.callback.call(this, target, e)\r\n            }\r\n          } else {\r\n            return handler.callback.call(this, target, e)\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  public static on = function (element: HTMLElement, name: string, callBack: Function): void {\r\n    EventHandlerUtil.addEvent(element, name, callBack, false)\r\n  }\r\n\r\n  public static one(element: HTMLElement, name: string, callBack: Function): void {\r\n    EventHandlerUtil.addEvent(element, name, callBack, true)\r\n  }\r\n\r\n  public static off(element: HTMLElement, name: string): void {\r\n    EventHandlerUtil.removeEvent(element, name)\r\n  }\r\n}\r\n","import React, { FC } from 'react'\r\nimport { useIntl } from 'react-intl'\r\nimport projects, { IProject } from '../../../assets/ProjectsData'\r\nimport './ProjectContent.scss'\r\n\r\n\r\nconst ProjectContent: FC = () => {\r\n  const intl = useIntl();\r\n  let recordsProject: IProject[] = [];\r\n  if (projects && projects.length > 0) {\r\n    recordsProject = projects.filter(x => x.languageCode === intl.locale);\r\n  }\r\n  return (\r\n    <div className='project-home'>\r\n      <div className='container'>\r\n        <div className='project-text'>\r\n          <h1 className='fw-bold '>{intl.formatMessage({ id: 'MENU.PROJECTS' })}</h1>\r\n          <div className='row d-flex justify-content-between'>\r\n            <div className='col-xl-6 col-lg-8 col-sm-11 fw-normal '>\r\n              <p className='fz-20px'>\r\n                {intl.formatMessage({ id: 'PROJECT.SHORT_DESC' })}\r\n              </p>\r\n            </div>\r\n            <div className='col-xl-3 col-lg-4 col-sm-5 fw-bolder d-flex position-relative'>\r\n              <p className='fz-16px align-middle'> {intl.formatMessage({ id: 'PROJECT.EXPLORE_ALL' })}</p>\r\n              <button className='project-button-radio position-absolute'>\r\n                <a href='/projects'>\r\n                  <div className='line-width'>\r\n                    <i className='arrow right'></i>\r\n                  </div>\r\n                </a>\r\n              </button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div className='products'>\r\n          <div className='row d-flex justify-content-between'>\r\n            {recordsProject.map((item, idx) =>\r\n              <div key={idx} className='width-600 col-xxl-6'>\r\n                <div className='col-xxl-12 position-relative shadow'>\r\n                  <img src={item.thumbnail} alt={`${item.alias}-thumb`} className='image' />\r\n                  <div className='products-overlay-img d-flex'>\r\n                    <div className='d-flex flex-column padding-hover'>\r\n                      <button className='button-hover text-white '>\r\n                        {/* <img src={item.logo} alt={`${item.alias}-logo`} className=' left-img' /> */}\r\n                      </button>\r\n                      <div className='text-hover'>\r\n                        <p>{item.type}</p>\r\n                        <div className='line-width-hove'>\r\n                          <h3>{item.name}</h3>\r\n                        </div>\r\n                      </div>\r\n                      <div className='col-xxl-11 lh-lg padding-text-span'>\r\n                        <span>\r\n                          {item.shortDescription}\r\n                        </span>\r\n                      </div>\r\n                      <div className='d-flex align-items-end'>\r\n                        <div>\r\n                          <a href={`/project-detail/${item.alias}-${item.id}.html`} className='fs-6 text-start text-white'>\r\n                            {intl.formatMessage({ id: 'PROJECT.EXPLORE_FULL_PROJECT' })}\r\n                          </a>\r\n                        </div>\r\n                        <div className='line-width-icon justify-content-end'>\r\n                          <i className='arrow right-icon'></i>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <div className='product-text'>\r\n                  <p>{item.type}</p>\r\n                  <span className='fw-bolder'>{item.name}</span>\r\n                </div>\r\n              </div>\r\n            )}\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default ProjectContent\r\n","import {FC} from 'react'\r\nimport {Container, Row, Col, Card} from 'react-bootstrap-v5'\r\nimport {useIntl} from 'react-intl'\r\nimport ArrowNavigation from '../../common/components/arrow-navigation'\r\nimport './services.scss'\r\n\r\ntype ServicesProps = {\r\n  isHome?: boolean\r\n}\r\n\r\nconst ServicesWrapper: FC<ServicesProps> = ({isHome = false}) => {\r\n  const intl = useIntl()\r\n\r\n  return (\r\n    <>\r\n      <Container className='services-home-container' style={{display: isHome ? 'block' : 'none'}}>\r\n        <div className='title fw-bold'>{intl.formatMessage({id: 'MENU.SERVICES'})}</div>\r\n        <Row>\r\n          <Col className='sub-title' sm={6}>\r\n            we’re all about co-creation. From ideation through launch, we work with our customers\r\n            every step of the way.\r\n          </Col>\r\n          <Col sm={6}>\r\n            <div className='d-none d-sm-flex justify-content-end'>\r\n              <ArrowNavigation\r\n                href='/services'\r\n                title={intl.formatMessage({id: 'SOLUTIONS.EXPLORE'})}\r\n                isRight\r\n                isCircle={true}\r\n                color='black'\r\n              />\r\n            </div>\r\n            <div className='d-flex d-sm-none mb-5'>\r\n              <ArrowNavigation\r\n                href='/services'\r\n                title={intl.formatMessage({id: 'SOLUTIONS.EXPLORE'})}\r\n                isRight\r\n                color='black'\r\n              />\r\n            </div>\r\n          </Col>\r\n        </Row>\r\n      </Container>\r\n\r\n      <div className='services-container' style={{height: isHome ? 'auto' : ''}}>\r\n        <div className='overlay-bg'></div>\r\n        <Container className='services-content'>\r\n          <div className='title' style={{display: isHome ? 'none' : 'block'}}>\r\n            {intl.formatMessage({id: 'MENU.SERVICES'})}\r\n          </div>\r\n          <Row className={`content ${isHome ? 'home-padding' : ''}`}>\r\n            <Col xs={12} md={4}>\r\n              <Card>\r\n                <Card.Title>\r\n                  {intl.formatMessage({id: 'SOLUTIONS.TITLE_1.1ST_CHAR'})} <br />{' '}\r\n                  {intl.formatMessage({id: 'SOLUTIONS.TITLE_1.2ND_CHAR'})}\r\n                </Card.Title>\r\n                <Card.Text>{intl.formatMessage({id: 'SOLUTIONS.SUB_TITLE_1'})}</Card.Text>\r\n                <ArrowNavigation\r\n                  href='/product-design'\r\n                  title={intl.formatMessage({id: 'GENERAL.EXPLORER_OUR'})}\r\n                  isRight\r\n                  color='white'\r\n                />\r\n              </Card>\r\n            </Col>\r\n            <Col xs={12} md={4}>\r\n              <Card>\r\n                <Card.Title>\r\n                  {intl.formatMessage({id: 'SOLUTIONS.TITLE_2.1ST_CHAR'})} <br />{' '}\r\n                  {intl.formatMessage({id: 'SOLUTIONS.TITLE_2.2ND_CHAR'})}\r\n                </Card.Title>\r\n                <Card.Text>{intl.formatMessage({id: 'SOLUTIONS.SUB_TITLE_2'})}</Card.Text>\r\n                <ArrowNavigation\r\n                  href='/solutions-software-development'\r\n                  title={intl.formatMessage({id: 'GENERAL.EXPLORER_OUR'})}\r\n                  isRight\r\n                  color='white'\r\n                />\r\n              </Card>\r\n            </Col>\r\n            <Col xs={12} md={4}>\r\n              <Card>\r\n                <Card.Title>\r\n                  {intl.formatMessage({id: 'SOLUTIONS.TITLE_3.1ST_CHAR'})} <br />{' '}\r\n                  {intl.formatMessage({id: 'SOLUTIONS.TITLE_3.2ND_CHAR'})}\r\n                </Card.Title>\r\n                <Card.Text>{intl.formatMessage({id: 'SOLUTIONS.SUB_TITLE_3'})}</Card.Text>\r\n                <ArrowNavigation\r\n                  href='/erp-development'\r\n                  title={intl.formatMessage({id: 'GENERAL.EXPLORER_OUR'})}\r\n                  isRight\r\n                  color='white'\r\n                />\r\n              </Card>\r\n            </Col>\r\n          </Row>\r\n        </Container>\r\n      </div>\r\n    </>\r\n  )\r\n}\r\n\r\nexport default ServicesWrapper\r\n","export const toAbsoluteUrl = (pathname: string) => process.env.PUBLIC_URL + pathname\r\n","export function getCurrentUrl(pathname: string) {\r\n  return pathname.split(/[?#]/)[0]\r\n}\r\n\r\nexport function checkIsActive(pathname: string, url: string) {\r\n  const current = getCurrentUrl(pathname)\r\n  if (!current || !url) {\r\n    return false\r\n  }\r\n\r\n  if (current === url) {\r\n    return true\r\n  }\r\n\r\n  if (current.indexOf(url) > -1) {\r\n    return true\r\n  }\r\n\r\n  return false\r\n}\r\n","import React from 'react'\r\nimport SVG from 'react-inlinesvg'\r\nimport {toAbsoluteUrl} from '../AssetHelpers'\r\ntype Props = {\r\n  className?: string\r\n  path: string\r\n  svgClassName?: string\r\n}\r\n\r\nconst KTSVG: React.FC<Props> = ({className = '', path, svgClassName = 'mh-50px'}) => {\r\n  return (\r\n    <span className={`svg-icon ${className}`}>\r\n      <SVG src={toAbsoluteUrl(path)} className={svgClassName} />\r\n    </span>\r\n  )\r\n}\r\n\r\nexport {KTSVG}\r\n","export interface MessageModel {\r\n  user: number\r\n  type: 'in' | 'out'\r\n  text: string\r\n  time: string\r\n  template?: boolean\r\n}\r\n\r\nconst defaultMessages: Array<MessageModel> = [\r\n  {\r\n    user: 4,\r\n    type: 'in',\r\n    text: 'How likely are you to recommend our company to your friends and family ?',\r\n    time: '2 mins',\r\n  },\r\n  {\r\n    user: 2,\r\n    type: 'out',\r\n    text: 'Hey there, we’re just writing to let you know that you’ve been subscribed to a repository on GitHub.',\r\n    time: '5 mins',\r\n  },\r\n  {\r\n    user: 4,\r\n    type: 'in',\r\n    text: 'Ok, Understood!',\r\n    time: '1 Hour',\r\n  },\r\n  {\r\n    user: 2,\r\n    type: 'out',\r\n    text: 'You’ll receive notifications for all issues, pull requests!',\r\n    time: '2 Hours',\r\n  },\r\n  {\r\n    user: 4,\r\n    type: 'in',\r\n    text: 'You can unwatch this repository immediately by clicking here: <a href=\"https://keenthemes.com\">Keenthemes.com</a>',\r\n    time: '3 Hours',\r\n  },\r\n  {\r\n    user: 2,\r\n    type: 'out',\r\n    text: 'Most purchased Business courses during this sale!',\r\n    time: '4 Hours',\r\n  },\r\n  {\r\n    user: 4,\r\n    type: 'in',\r\n    text: 'Company BBQ to celebrate the last quater achievements and goals. Food and drinks provided',\r\n    time: '5 Hours',\r\n  },\r\n  {\r\n    template: true,\r\n    user: 2,\r\n    type: 'out',\r\n    text: '',\r\n    time: 'Just now',\r\n  },\r\n  {\r\n    template: true,\r\n    user: 4,\r\n    type: 'in',\r\n    text: 'Right before vacation season we have the next Big Deal for you.',\r\n    time: 'Just now',\r\n  },\r\n]\r\n\r\nexport interface UserInfoModel {\r\n  initials?: {label: string; state: 'warning' | 'danger' | 'primary' | 'success' | 'info'}\r\n  name: string\r\n  avatar?: string\r\n  email: string\r\n  position: string\r\n  online: boolean\r\n}\r\n\r\nconst defaultUserInfos: Array<UserInfoModel> = [\r\n  {\r\n    name: 'Emma Smith',\r\n    avatar: 'avatars/150-1.jpg',\r\n    email: 'e.smith@kpmg.com.au',\r\n    position: 'Art Director',\r\n    online: false,\r\n  },\r\n  {\r\n    name: 'Melody Macy',\r\n    initials: {label: 'M', state: 'danger'},\r\n    email: 'melody@altbox.com',\r\n    position: 'Marketing Analytic',\r\n    online: true,\r\n  },\r\n  {\r\n    name: 'Max Smith',\r\n    avatar: 'avatars/150-2.jpg',\r\n    email: 'max@kt.com',\r\n    position: 'Software Enginer',\r\n    online: false,\r\n  },\r\n  {\r\n    name: 'Sean Bean',\r\n    avatar: 'avatars/150-4.jpg',\r\n    email: 'sean@dellito.com',\r\n    position: 'Web Developer',\r\n    online: false,\r\n  },\r\n  {\r\n    name: 'Brian Cox',\r\n    avatar: 'avatars/150-15.jpg',\r\n    email: 'brian@exchange.com',\r\n    position: 'UI/UX Designer',\r\n    online: false,\r\n  },\r\n  {\r\n    name: 'Mikaela Collins',\r\n    initials: {label: 'M', state: 'warning'},\r\n    email: 'mikaela@pexcom.com',\r\n    position: 'Head Of Marketing',\r\n    online: true,\r\n  },\r\n  {\r\n    name: 'Francis Mitcham',\r\n    avatar: 'avatars/150-8.jpg',\r\n    email: 'f.mitcham@kpmg.com.au',\r\n    position: 'Software Arcitect',\r\n    online: false,\r\n  },\r\n\r\n  {\r\n    name: 'Olivia Wild',\r\n    initials: {label: 'O', state: 'danger'},\r\n    email: 'olivia@corpmail.com',\r\n    position: 'System Admin',\r\n    online: true,\r\n  },\r\n  {\r\n    name: 'Neil Owen',\r\n    initials: {label: 'N', state: 'primary'},\r\n    email: 'owen.neil@gmail.com',\r\n    position: 'Account Manager',\r\n    online: true,\r\n  },\r\n  {\r\n    name: 'Dan Wilson',\r\n    avatar: 'avatars/150-6.jpg',\r\n    email: 'dam@consilting.com',\r\n    position: 'Web Desinger',\r\n    online: false,\r\n  },\r\n  {\r\n    name: 'Emma Bold',\r\n    initials: {label: 'E', state: 'danger'},\r\n    email: 'emma@intenso.com',\r\n    position: 'Corporate Finance',\r\n    online: true,\r\n  },\r\n  {\r\n    name: 'Ana Crown',\r\n    avatar: 'avatars/150-7.jpg',\r\n    email: 'ana.cf@limtel.com',\r\n    position: 'Customer Relationship',\r\n    online: false,\r\n  },\r\n  {\r\n    name: 'Robert Doe',\r\n    initials: {label: 'A', state: 'info'},\r\n    email: 'robert@benko.com',\r\n    position: 'Marketing Executive',\r\n    online: true,\r\n  },\r\n  {\r\n    name: 'John Miller',\r\n    avatar: 'avatars/150-17.jpg',\r\n    email: 'miller@mapple.com',\r\n    position: 'Project Manager',\r\n    online: false,\r\n  },\r\n  {\r\n    name: 'Lucy Kunic',\r\n    initials: {label: 'L', state: 'success'},\r\n    email: 'lucy.m@fentech.com',\r\n    position: 'SEO Master',\r\n    online: true,\r\n  },\r\n  {\r\n    name: 'Ethan Wilder',\r\n    avatar: 'avatars/150-10.jpg',\r\n    email: 'ethan@loop.com.au',\r\n    position: 'Accountant',\r\n    online: true,\r\n  },\r\n]\r\n\r\nconst messageFromClient: MessageModel = {\r\n  user: 4,\r\n  type: 'in',\r\n  text: 'Thank you for your awesome support!',\r\n  time: 'Just now',\r\n}\r\n\r\nexport interface AlertModel {\r\n  title: string\r\n  description: string\r\n  time: string\r\n  icon: string\r\n  state: 'primary' | 'danger' | 'warning' | 'success' | 'info'\r\n}\r\n\r\nconst defaultAlerts: Array<AlertModel> = [\r\n  {\r\n    title: 'Project Alice',\r\n    description: 'Phase 1 development',\r\n    time: '1 hr',\r\n    icon: 'icons/duotune/technology/teh008.svg',\r\n    state: 'primary',\r\n  },\r\n  {\r\n    title: 'HR Confidential',\r\n    description: 'Confidential staff documents',\r\n    time: '2 hrs',\r\n    icon: 'icons/duotune/general/gen044.svg',\r\n    state: 'danger',\r\n  },\r\n  {\r\n    title: 'Company HR',\r\n    description: 'Corporeate staff profiles',\r\n    time: '5 hrs',\r\n    icon: 'icons/duotune/finance/fin006.svg',\r\n    state: 'warning',\r\n  },\r\n  {\r\n    title: 'Project Redux',\r\n    description: 'New frontend admin theme',\r\n    time: '2 days',\r\n    icon: 'icons/duotune/files/fil023.svg',\r\n    state: 'success',\r\n  },\r\n  {\r\n    title: 'Project Breafing',\r\n    description: 'Product launch status update',\r\n    time: '21 Jan',\r\n    icon: 'icons/duotune/maps/map001.svg',\r\n    state: 'primary',\r\n  },\r\n  {\r\n    title: 'Banner Assets',\r\n    description: 'Collection of banner images',\r\n    time: '21 Jan',\r\n    icon: 'icons/duotune/general/gen006.svg',\r\n    state: 'info',\r\n  },\r\n  {\r\n    title: 'Icon Assets',\r\n    description: 'Collection of SVG icons',\r\n    time: '20 March',\r\n    icon: 'icons/duotune/art/art002.svg',\r\n    state: 'warning',\r\n  },\r\n]\r\nexport interface LogModel {\r\n  code: string\r\n  state: 'success' | 'danger' | 'warning'\r\n  message: string\r\n  time: string\r\n}\r\n\r\nconst defaultLogs: Array<LogModel> = [\r\n  {code: '200 OK', state: 'success', message: 'New order', time: 'Just now'},\r\n  {code: '500 ERR', state: 'danger', message: 'New customer', time: '2 hrs'},\r\n  {code: '200 OK', state: 'success', message: 'Payment process', time: '5 hrs'},\r\n  {code: '300 WRN', state: 'warning', message: 'Search query', time: '2 days'},\r\n  {code: '200 OK', state: 'success', message: 'API connection', time: '1 week'},\r\n  {code: '200 OK', state: 'success', message: 'Database restore', time: 'Mar 5'},\r\n  {code: '300 WRN', state: 'warning', message: 'System update', time: 'May 15'},\r\n  {code: '300 WRN', state: 'warning', message: 'Server OS update', time: 'Apr 3'},\r\n  {code: '300 WRN', state: 'warning', message: 'API rollback', time: 'Jun 30'},\r\n  {code: '500 ERR', state: 'danger', message: 'Refund process', time: 'Jul 10'},\r\n  {code: '500 ERR', state: 'danger', message: 'Withdrawal process', time: 'Sep 10'},\r\n  {code: '500 ERR', state: 'danger', message: 'Mail tasks', time: 'Dec 10'},\r\n]\r\n\r\nexport {defaultMessages, defaultUserInfos, defaultAlerts, defaultLogs, messageFromClient}\r\n","/* eslint-disable no-useless-escape */\r\n// DOCS: https://javascript.info/cookie\r\nexport class CookieComponent {\r\n  /**\r\n   * Returns the cookie with the given name, or undefined if not found\r\n   *\r\n   * @param  {string} name - cookie name\r\n   * @returns string | null\r\n   */\r\n  public static get(name: string): string | undefined {\r\n    let matches = document.cookie.match(\r\n      new RegExp('(?:^|; )' + name.replace(/([\\.$?*|{}\\(\\)\\[\\]\\\\\\/\\+^])/g, '\\\\$1') + '=([^;]*)')\r\n    )\r\n    return matches ? decodeURIComponent(matches[1]) : undefined\r\n  }\r\n\r\n  /**\r\n   * Please note that a cookie value is encoded,\r\n   * so getCookie uses a built-in decodeURIComponent function to decode it.\r\n   *\r\n   * @param  {string} name - cookie name\r\n   * @param  {string | number | boolean} value - cookie value\r\n   * @param  {any} cookieOptions - cookie options\r\n   * @returns void\r\n   */\r\n  public static set(name: string, value: string | number | boolean, cookieOptions: any): void {\r\n    const options = {\r\n      path: '/',\r\n      // add other defaults here if necessary\r\n      ...cookieOptions,\r\n    }\r\n\r\n    if (options.expires instanceof Date) {\r\n      options.expires = options.expires.toUTCString()\r\n    }\r\n\r\n    let updatedCookie = encodeURIComponent(name) + '=' + encodeURIComponent(value)\r\n\r\n    for (let optionKey in options) {\r\n      updatedCookie += '; ' + optionKey\r\n      let optionValue = options[optionKey]\r\n      if (optionValue !== true) {\r\n        updatedCookie += '=' + optionValue\r\n      }\r\n    }\r\n\r\n    document.cookie = updatedCookie\r\n  }\r\n\r\n  /**\r\n   * To delete a cookie, we can call it with a negative expiration date\r\n   *\r\n   * @param  {string} name\r\n   */\r\n  public static delete(name: string): void {\r\n    CookieComponent.set(name, '', {\r\n      'max-age': -1,\r\n    })\r\n  }\r\n}\r\n","import {\r\n  EventHandlerUtil,\r\n  getUniqueIdWithPrefix,\r\n  getObjectPropertyValueByKey,\r\n  stringSnakeToCamel,\r\n  getAttributeValueByBreakpoint,\r\n  throttle,\r\n  getCSS,\r\n  DOMEventHandlerUtil,\r\n  ElementStyleUtil,\r\n} from '../_utils/index'\r\n\r\nexport class DrawerStore {\r\n  static store: Map<string, DrawerComponent> = new Map()\r\n\r\n  public static set(instanceId: string, drawerComponentObj: DrawerComponent): void {\r\n    if (DrawerStore.has(instanceId)) {\r\n      return\r\n    }\r\n\r\n    DrawerStore.store.set(instanceId, drawerComponentObj);\r\n  }\r\n\r\n  public static get(instanceId: string): DrawerComponent | undefined {\r\n    if (!DrawerStore.has(instanceId)) {\r\n      return\r\n    }\r\n    return DrawerStore.store.get(instanceId);\r\n  }\r\n\r\n  public static remove(instanceId: string): void {\r\n    if (!DrawerStore.has(instanceId)) {\r\n      return\r\n    }\r\n\r\n    DrawerStore.store.delete(instanceId)\r\n  }\r\n\r\n  public static has(instanceId: string): boolean {\r\n    return DrawerStore.store.has(instanceId);\r\n  }\r\n\r\n  public static getAllInstances() {\r\n    return DrawerStore.store;\r\n  }\r\n}\r\n\r\nexport interface DrawerOptions {\r\n  overlay: boolean\r\n  baseClass: string\r\n  overlayClass: string\r\n  direction: string\r\n}\r\n\r\nconst defaultDrawerOptions: DrawerOptions = {\r\n  overlay: true,\r\n  baseClass: 'drawer',\r\n  overlayClass: 'drawer-overlay',\r\n  direction: 'end',\r\n}\r\n\r\nclass DrawerComponent {\r\n  element: HTMLElement\r\n  overlayElement: HTMLElement | null = null\r\n  toggleElement: HTMLElement | null = null\r\n  options: DrawerOptions\r\n  instanceUid: string\r\n  name: string = ''\r\n  shown: boolean = false\r\n  lastWidth: number = 0\r\n  closeElement: HTMLElement | null = null\r\n\r\n  constructor(_element: HTMLElement, options: DrawerOptions) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultDrawerOptions, options)\r\n    this.instanceUid = getUniqueIdWithPrefix('drawer')\r\n    this.overlayElement = null\r\n    this.name = this.element.getAttribute('data-kt-drawer-name') || ''\r\n    this.shown = false\r\n    this.toggleElement = null\r\n    // Event Handlers\r\n    this._handlers()\r\n    // Update Instance\r\n    this._update()\r\n    // Bind Instance\r\n    DrawerStore.set(this.element.id, this)\r\n  }\r\n\r\n  private _handlers = () => {\r\n    const togglers = this._getOption('toggle') as string\r\n    const closers = this._getOption('close') as string\r\n\r\n    if (togglers !== null && togglers.length > 0) {\r\n      DOMEventHandlerUtil.on(document.body, togglers, 'click', (e: Event) => {\r\n        e.preventDefault()\r\n        this.toggleElement = document.getElementById(togglers)\r\n        this._toggle()\r\n      })\r\n    }\r\n\r\n    if (closers !== null && closers.length > 0) {\r\n      DOMEventHandlerUtil.on(document.body, closers, 'click', (e: Event) => {\r\n        e.preventDefault()\r\n        this.closeElement = document.getElementById(closers)\r\n\r\n        this._hide()\r\n      })\r\n    }\r\n  }\r\n\r\n  private _update = () => {\r\n    const width = String(this._getOption('width'))\r\n    const direction = String(this._getOption('direction'))\r\n\r\n    // Reset state\r\n    const hasBaseClass = this.element.classList.contains(`${this.options.baseClass}-on`)\r\n    const bodyCanvasAttr = String(document.body.getAttribute(`data-kt-drawer-${this.name}-`))\r\n\r\n    if (hasBaseClass === true && bodyCanvasAttr === 'on') {\r\n      this.shown = true\r\n    } else {\r\n      this.shown = false\r\n    }\r\n\r\n    // Activate/deactivate\r\n    if (this._getOption('activate') === true) {\r\n      this.element.classList.add(this.options.baseClass)\r\n      this.element.classList.add(`${this.options.baseClass}-${direction}`)\r\n      ElementStyleUtil.set(this.element, 'width', width, true)\r\n\r\n      this.lastWidth = parseInt(width)\r\n    } else {\r\n      ElementStyleUtil.set(this.element, 'width', '')\r\n      this.element.classList.remove(this.options.baseClass)\r\n      this.element.classList.remove(`${this.options.baseClass}-${direction}`)\r\n      this._hide()\r\n    }\r\n  }\r\n\r\n  private _getOption = (name: string) => {\r\n    const attr = this.element.getAttribute(`data-kt-drawer-${name}`)\r\n    if (attr) {\r\n      let value = getAttributeValueByBreakpoint(attr)\r\n      if (value !== null && String(value) === 'true') {\r\n        return true\r\n      } else {\r\n        if (value !== null && String(value) === 'false') {\r\n          return false\r\n        }\r\n      }\r\n\r\n      return value\r\n    } else {\r\n      const optionName = stringSnakeToCamel(name)\r\n      const option = getObjectPropertyValueByKey(this.options, optionName)\r\n      if (option) {\r\n        return getAttributeValueByBreakpoint(option)\r\n      } else {\r\n        return null\r\n      }\r\n    }\r\n  }\r\n\r\n  private _toggle = () => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.drawer.toggle') === false) {\r\n      return\r\n    }\r\n\r\n    if (this.shown) {\r\n      this._hide()\r\n    } else {\r\n      this._show()\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.drawer.toggled')\r\n  }\r\n\r\n  private _hide = () => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.drawer.hide') === false) {\r\n      return\r\n    }\r\n\r\n    this.shown = false\r\n    this._deleteOverlay()\r\n    document.body.removeAttribute(`data-kt-drawer-${this.name}`)\r\n    document.body.removeAttribute(`data-kt-drawer`)\r\n    this.element.classList.remove(`${this.options.baseClass}-on`)\r\n    if (this.toggleElement != null) {\r\n      this.toggleElement.classList.remove('active')\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.drawer.after.hidden')\r\n  }\r\n\r\n  private _show = () => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.drawer.show') === false) {\r\n      return\r\n    }\r\n\r\n    this.shown = true\r\n    this._createOverlay()\r\n    document.body.setAttribute(`data-kt-drawer-${this.name}`, 'on')\r\n    document.body.setAttribute('data-kt-drawer', 'on')\r\n    this.element.classList.add(`${this.options.baseClass}-on`)\r\n    if (this.toggleElement !== null) {\r\n      this.toggleElement.classList.add('active')\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.drawer.shown')\r\n  }\r\n\r\n  private _createOverlay = () => {\r\n    if (this._getOption('overlay') === true) {\r\n      this.overlayElement = document.createElement('DIV')\r\n      const elementZIndex = getCSS(this.element, 'z-index')\r\n      if (elementZIndex) {\r\n        const overlayZindex = parseInt(elementZIndex) - 1\r\n        ElementStyleUtil.set(this.overlayElement, 'z-index', overlayZindex) // update\r\n      }\r\n      document.body.append(this.overlayElement)\r\n      const overlayClassOption = this._getOption('overlay-class')\r\n      if (overlayClassOption) {\r\n        this.overlayElement.classList.add(overlayClassOption.toString())\r\n      }\r\n      this.overlayElement.addEventListener('click', (e) => {\r\n        e.preventDefault()\r\n        this._hide()\r\n      })\r\n    }\r\n  }\r\n\r\n  private _deleteOverlay = () => {\r\n    if (this.overlayElement !== null && this.overlayElement.parentNode) {\r\n      this.overlayElement.parentNode.removeChild(this.overlayElement)\r\n    }\r\n  }\r\n\r\n  private _getDirection = () => {\r\n    return String(this._getOption('direction')) === 'left' ? 'left' : 'right'\r\n  }\r\n\r\n  private _getWidth = () => {\r\n    let width = this._getOption('width')\r\n    if (width && width === 'auto') {\r\n      width = getCSS(this.element, 'width')\r\n    }\r\n\r\n    return width\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  public toggle = () => {\r\n    this._toggle()\r\n  }\r\n\r\n  public show = () => {\r\n    this._show()\r\n  }\r\n\r\n  public hide = () => {\r\n    this._hide()\r\n  }\r\n\r\n  public isShown = () => {\r\n    return this.shown\r\n  }\r\n\r\n  public update = () => {\r\n    this._update()\r\n  }\r\n\r\n  public goElement = () => {\r\n    return this.element\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  public trigger = (name: string, event: Event) => {\r\n    return EventHandlerUtil.trigger(this.element, name, event)\r\n  }\r\n\r\n  // Static methods\r\n  public static hasInstace = (elementId: string): boolean => {\r\n    return DrawerStore.has(elementId)\r\n  }\r\n\r\n  public static getInstance = (elementId: string) => {\r\n    return DrawerStore.get(elementId)\r\n  }\r\n\r\n  public static hideAll = () => {\r\n    const oldInstances = DrawerStore.getAllInstances()\r\n    oldInstances.forEach((dr) => {\r\n      dr.hide()\r\n    })\r\n  }\r\n\r\n  public static updateAll = () => {\r\n    const oldInstances = DrawerStore.getAllInstances()\r\n    oldInstances.forEach((dr) => {\r\n      dr.update()\r\n    })\r\n  }\r\n\r\n  // Create Instances\r\n  public static createInstances(selector: string): void {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((element) => {\r\n      const item = element as HTMLElement\r\n      let drawer = DrawerComponent.getInstance(item.id)\r\n      if (!drawer) {\r\n        drawer = new DrawerComponent(item, defaultDrawerOptions)\r\n      }\r\n      drawer.element = item;\r\n      drawer.hide()\r\n    })\r\n  }\r\n\r\n  // Dismiss instances\r\n  public static handleDismiss = () => {\r\n    // External drawer toggle handler\r\n    DOMEventHandlerUtil.on(document.body, '[data-kt-drawer-dismiss=\"true\"]', 'click', () => {\r\n      /* @ts-ignore */\r\n      const element = this.closest('[data-kt-drawer=\"true\"]')\r\n      if (element) {\r\n        const drawer = DrawerComponent.getInstance(element)\r\n        if (drawer && drawer.isShown()) {\r\n          drawer.hide()\r\n        }\r\n      }\r\n    })\r\n  }\r\n\r\n  // Global Initialization\r\n  public static initGlobalHandlers(): void {\r\n    // Window Resize Handling\r\n    window.addEventListener('resize', function () {\r\n      let timer: number | undefined\r\n      throttle(\r\n        timer,\r\n        () => {\r\n          // Locate and update Drawer instances on window resize\r\n          const elements = document.body.querySelectorAll('[data-kt-drawer=\"true\"]')\r\n          elements.forEach((el) => {\r\n            const item = el as HTMLElement\r\n            const instance = DrawerComponent.getInstance(item.id)\r\n            if (instance) {\r\n              instance.element = item;\r\n              instance.update()\r\n            }\r\n          })\r\n        },\r\n        200\r\n      )\r\n    })\r\n  }\r\n\r\n  public static bootstrap = () => {\r\n    DrawerComponent.createInstances('[data-kt-drawer=\"true\"]')\r\n    DrawerComponent.initGlobalHandlers()\r\n    DrawerComponent.handleDismiss()\r\n  }\r\n\r\n  public static reinitialization = () => {\r\n    DrawerComponent.createInstances('[data-kt-drawer=\"true\"]')\r\n    DrawerComponent.hideAll()\r\n    DrawerComponent.updateAll()\r\n    DrawerComponent.handleDismiss()\r\n  }\r\n}\r\n\r\nexport {DrawerComponent, defaultDrawerOptions}\r\n","import {\r\n  DataUtil,\r\n  ElementStyleUtil,\r\n  EventHandlerUtil,\r\n  getUniqueIdWithPrefix,\r\n  getAttributeValueByBreakpoint,\r\n} from '../_utils/index'\r\n\r\nexport interface FeedbackOptions {\r\n  width?: number\r\n  placement?: string\r\n  content?: string\r\n  type?: string\r\n}\r\n\r\nconst defaultFeedbackOptions: FeedbackOptions = {\r\n  width: 100,\r\n  placement: 'top-center',\r\n  content: '',\r\n  type: 'popup',\r\n}\r\n\r\nclass FeedbackComponent {\r\n  element: HTMLElement\r\n  options: FeedbackOptions\r\n  instanceUid: string\r\n  shown: boolean\r\n\r\n  constructor(_element: HTMLElement, options: FeedbackOptions) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultFeedbackOptions, options)\r\n    this.instanceUid = getUniqueIdWithPrefix('feedback')\r\n    this.shown = false\r\n\r\n    // Event handlers\r\n    this._handlers() // will add in the show popup\r\n    DataUtil.set(this.element, 'feedback', this)\r\n  }\r\n\r\n  private _handlers = () => {\r\n    this.element.addEventListener('click', (e: Event) => {\r\n      e.preventDefault()\r\n      this._go()\r\n    })\r\n  }\r\n\r\n  private _go = () => {}\r\n\r\n  private showPopup = () => {\r\n    this.element = document.createElement('DIV')\r\n\r\n    this.element.classList.add('feedback feedback-popup')\r\n    this.element.innerHTML = this.options.content || ''\r\n\r\n    if (this.options.placement === 'top-center') {\r\n      this.setPopupTopCenterPosition()\r\n    }\r\n\r\n    document.body.appendChild(this.element)\r\n    this.element.classList.add('feedback-shown')\r\n    this.shown = true\r\n  }\r\n\r\n  private setPopupTopCenterPosition = () => {\r\n    const width = getAttributeValueByBreakpoint(this.options.width?.toString() || '0')\r\n    const height = ElementStyleUtil.get(this.element, 'height')\r\n    this.element.classList.add('feedback-top-center')\r\n    ElementStyleUtil.set(this.element, 'width', width)\r\n    ElementStyleUtil.set(this.element, 'left', '50%')\r\n    ElementStyleUtil.set(this.element, 'top', '-' + height)\r\n  }\r\n\r\n  private hidePopup = () => {\r\n    this.element.remove()\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  public show = () => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.feedback.show') === false) {\r\n      return\r\n    }\r\n\r\n    if (this.options.type === 'popup') {\r\n      this.showPopup()\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.feedback.shown')\r\n\r\n    return this\r\n  }\r\n\r\n  public hide = () => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.feedback.hide') === false) {\r\n      return\r\n    }\r\n\r\n    if (this.options.type === 'popup') {\r\n      this.hidePopup()\r\n    }\r\n\r\n    this.shown = false\r\n    EventHandlerUtil.trigger(this.element, 'kt.feedback.hidden')\r\n    return this\r\n  }\r\n\r\n  public isShown = () => {\r\n    return this.isShown\r\n  }\r\n\r\n  public getElement = () => {\r\n    return this.element\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  public trigger = (name: string, event: Event) => {\r\n    return EventHandlerUtil.trigger(this.element, name, event)\r\n  }\r\n\r\n  // Create Instances\r\n  public static createInstances(selector: string) {\r\n    throw new Error('not implemented')\r\n  }\r\n\r\n  // Static methods\r\n  public static hasInstace(element: HTMLElement) {\r\n    throw new Error('not implemented')\r\n  }\r\n\r\n  public static getInstance(element: HTMLElement) {\r\n    throw new Error('not implemented')\r\n  }\r\n\r\n  public static bootstrap(attr: string = '[data-Feedback]') {\r\n    throw new Error('not implemented')\r\n  }\r\n}\r\n\r\nexport {FeedbackComponent, defaultFeedbackOptions}\r\n","import {EventHandlerUtil, DataUtil, getUniqueIdWithPrefix, getCSS} from '../_utils/index'\r\n\r\nexport interface IImageInputOptions {}\r\n\r\nexport interface IImageInputQueries {\r\n  componentName: string\r\n  instanseQuery: string\r\n  inputQuery: string\r\n  wrapperQuery: string\r\n  cancelQuery: string\r\n  removeQuery: string\r\n  hiddenQuery: string\r\n}\r\n\r\nconst defaultImageInputOptions = {}\r\n\r\nconst defaultImageInputQueires: IImageInputQueries = {\r\n  componentName: 'image-input',\r\n  instanseQuery: '[data-kt-image-input]',\r\n  inputQuery: 'input[type=\"file\"]',\r\n  wrapperQuery: '.image-input-wrapper',\r\n  cancelQuery: '[data-kt-image-input-action=\"cancel\"]',\r\n  removeQuery: '[data-kt-image-input-action=\"remove\"]',\r\n  hiddenQuery: 'input[type=\"hidden\"]',\r\n}\r\n\r\nclass ImageInputComponent {\r\n  element: HTMLElement\r\n  inputElement: HTMLInputElement | null\r\n  wrapperElement: HTMLElement | null\r\n  cancelElement: HTMLElement | null\r\n  removeElement: HTMLElement | null\r\n  hiddenElement: HTMLInputElement | null\r\n  src: string = ''\r\n  options: IImageInputOptions\r\n  queries: IImageInputQueries\r\n  uid: string\r\n  value: string = ''\r\n\r\n  constructor(_element: HTMLElement, _options: IImageInputOptions, _queries: IImageInputQueries) {\r\n    // Variables\r\n    this.options = Object.assign(defaultImageInputOptions, _options)\r\n    this.queries = _queries\r\n    this.uid = getUniqueIdWithPrefix(this.queries.componentName)\r\n\r\n    // Elements\r\n    this.element = _element\r\n    this.inputElement = this.element.querySelector(this.queries.inputQuery)\r\n    this.wrapperElement = this.element.querySelector(this.queries.wrapperQuery)\r\n    this.cancelElement = this.element.querySelector(this.queries.cancelQuery)\r\n    this.removeElement = this.element.querySelector(this.queries.removeQuery)\r\n    this.hiddenElement = this.element.querySelector(this.queries.hiddenQuery)\r\n    if (this.wrapperElement) {\r\n      this.src = getCSS(this.wrapperElement, 'backgroundImage')\r\n    }\r\n\r\n    // Event Handlers\r\n    this.handlers()\r\n\r\n    DataUtil.set(this.element, this.queries.componentName, this)\r\n  }\r\n\r\n  private handlers(): void {\r\n    this.element.addEventListener('change', this._change)\r\n    if (this.cancelElement) {\r\n      this.cancelElement.addEventListener('click', this._cancel)\r\n    }\r\n\r\n    if (this.removeElement) {\r\n      this.removeElement.addEventListener('click', this._cancel)\r\n    }\r\n  }\r\n\r\n  // Event Handlers\r\n  private _change = (e: Event) => {\r\n    e.preventDefault()\r\n\r\n    if (this.inputElement !== null && this.inputElement.files && this.inputElement.files[0]) {\r\n      // Fire change event\r\n      if (EventHandlerUtil.trigger(this.element, 'kt.imageinput.change', e) === false) {\r\n        return\r\n      }\r\n\r\n      const reader = new FileReader()\r\n\r\n      reader.onload = (e: ProgressEvent<FileReader>) => {\r\n        if (this.wrapperElement && e.target) {\r\n          this.wrapperElement.style.setProperty('background-image', `url('${e.target.result}')`)\r\n        }\r\n      }\r\n\r\n      reader.readAsDataURL(this.inputElement.files[0])\r\n      this.element.classList.add('image-input-changed')\r\n      this.element.classList.remove('image-input-empty')\r\n\r\n      // Fire removed event\r\n      EventHandlerUtil.trigger(this.element, 'kt.imageinput.changed', e)\r\n    }\r\n  }\r\n\r\n  private _cancel = (e: Event) => {\r\n    e.preventDefault()\r\n\r\n    // Fire cancel event\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.imageinput.cancel', e) === false) {\r\n      return\r\n    }\r\n\r\n    this.element.classList.remove('image-input-changed')\r\n    this.element.classList.remove('image-input-empty')\r\n    this.element.style.setProperty('background-image', this.src)\r\n    if (this.inputElement) {\r\n      this.inputElement.value = ''\r\n    }\r\n\r\n    if (this.hiddenElement !== null) {\r\n      this.hiddenElement.value = '0'\r\n    }\r\n\r\n    // Fire canceled event\r\n    EventHandlerUtil.trigger(this.element, 'kt.imageinput.canceled', e)\r\n  }\r\n\r\n  private _remove = (e: Event) => {\r\n    e.preventDefault()\r\n\r\n    // Fire remove event\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.imageinput.remove', e) === false) {\r\n      return\r\n    }\r\n\r\n    this.element.classList.remove('image-input-changed')\r\n    this.element.classList.add('image-input-empty')\r\n    if (this.wrapperElement) {\r\n      this.wrapperElement.style.setProperty('background-image', 'none')\r\n    }\r\n\r\n    if (this.inputElement) {\r\n      this.inputElement.value = ''\r\n    }\r\n\r\n    if (this.hiddenElement !== null) {\r\n      this.hiddenElement.value = '1'\r\n    }\r\n\r\n    // Fire removed event\r\n    EventHandlerUtil.trigger(this.element, 'kt.imageinput.removed', e)\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  public getInputElement(): HTMLInputElement | null {\r\n    return this.inputElement\r\n  }\r\n\r\n  public getElement(): HTMLElement {\r\n    return this.element\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  public trigger = (name: string, event: Event) => {\r\n    return EventHandlerUtil.trigger(this.element, name, event)\r\n  }\r\n\r\n  // Static methods\r\n  public static getInstance = (\r\n    el: HTMLElement,\r\n    componentName: string = defaultImageInputQueires.componentName\r\n  ) => {\r\n    const ImageInput = DataUtil.get(el, componentName)\r\n    if (ImageInput) {\r\n      return ImageInput\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  public static createInstances = (\r\n    selector: string = defaultImageInputQueires.instanseQuery,\r\n    options: IImageInputOptions = defaultImageInputOptions,\r\n    queries: IImageInputQueries = defaultImageInputQueires\r\n  ) => {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((el) => {\r\n      const item = el as HTMLElement\r\n      let ImageInput = ImageInputComponent.getInstance(item)\r\n      if (!ImageInput) {\r\n        ImageInput = new ImageInputComponent(item, options, queries)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string = defaultImageInputQueires.instanseQuery,\r\n    options: IImageInputOptions = defaultImageInputOptions,\r\n    queries: IImageInputQueries = defaultImageInputQueires\r\n  ): ImageInputComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let ImageInput = ImageInputComponent.getInstance(item)\r\n    if (!ImageInput) {\r\n      ImageInput = new ImageInputComponent(item, options, queries)\r\n    }\r\n    return ImageInput\r\n  }\r\n\r\n  public static bootstrap = (selector: string = defaultImageInputQueires.instanseQuery) => {\r\n    ImageInputComponent.createInstances(selector)\r\n  }\r\n\r\n  public static reinitialization = (selector: string = defaultImageInputQueires.instanseQuery) => {\r\n    ImageInputComponent.createInstances(selector)\r\n  }\r\n}\r\nexport {ImageInputComponent, defaultImageInputOptions, defaultImageInputQueires}\r\n","import {\r\n  DataUtil,\r\n  getObjectPropertyValueByKey,\r\n  stringSnakeToCamel,\r\n  getAttributeValueByBreakpoint,\r\n  getViewPort,\r\n  isVisibleElement,\r\n  throttle,\r\n  getCSS,\r\n  ElementStyleUtil,\r\n} from '../_utils/index'\r\nimport {CookieComponent} from './_CookieComponent'\r\n\r\nexport interface ScrollOptions {\r\n  saveState?: boolean\r\n}\r\n\r\nconst defaultScrollOptions: ScrollOptions = {\r\n  saveState: true,\r\n}\r\n\r\nclass ScrollComponent {\r\n  element: HTMLElement\r\n  options: ScrollOptions\r\n  id: string\r\n\r\n  constructor(_element: HTMLElement, options: ScrollOptions) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultScrollOptions, options)\r\n    this.id = this.element.getAttribute('id') || ''\r\n    this.update()\r\n    // this.element.setAttribute('data-kt-scrolltop', 'true')\r\n    DataUtil.set(this.element, 'scroll', this)\r\n  }\r\n\r\n  private getOption = (name: string) => {\r\n    if (this.element.hasAttribute('data-kt-scroll-' + name) === true) {\r\n      const attr = this.element.getAttribute('data-kt-scroll-' + name) || ''\r\n      let value: string | JSON | boolean = getAttributeValueByBreakpoint(attr)\r\n      if (value !== null && String(value) === 'true') {\r\n        value = true\r\n      } else if (value !== null && String(value) === 'false') {\r\n        value = false\r\n      }\r\n\r\n      return value\r\n    } else {\r\n      const optionName = stringSnakeToCamel(name)\r\n      const option = getObjectPropertyValueByKey(this.options, optionName)\r\n      if (option) {\r\n        return getAttributeValueByBreakpoint(option)\r\n      } else {\r\n        return null\r\n      }\r\n    }\r\n  }\r\n\r\n  private getHeightType = () => {\r\n    if (this.getOption('height')) {\r\n      return 'height'\r\n    }\r\n    if (this.getOption('min-height')) {\r\n      return 'min-height'\r\n    }\r\n    if (this.getOption('max-height')) {\r\n      return 'max-height'\r\n    }\r\n  }\r\n\r\n  private getAutoHeight = () => {\r\n    let height: number | string = getViewPort().height\r\n    const dependencies = this.getOption('dependencies')\r\n    const wrappers = this.getOption('wrappers')\r\n    const offset = this.getOption('offset')\r\n\r\n    // Height dependencies\r\n    if (dependencies !== null) {\r\n      const elements = document.querySelectorAll(dependencies as string)\r\n      if (elements && elements.length > 0) {\r\n        for (let i = 0, len = elements.length; i < len; i++) {\r\n          const element = elements[i] as HTMLElement\r\n          if (isVisibleElement(element) === false) {\r\n            continue\r\n          }\r\n\r\n          height = height - parseInt(getCSS(element, 'height'))\r\n          height = height - parseInt(getCSS(element, 'margin-top'))\r\n          height = height - parseInt(getCSS(element, 'margin-bottom'))\r\n\r\n          const borderTop = getCSS(element, 'border-top')\r\n          if (borderTop) {\r\n            height = height - parseInt(borderTop)\r\n          }\r\n\r\n          const borderBottom = getCSS(element, 'border-bottom')\r\n          if (borderBottom) {\r\n            height = height - parseInt(borderBottom)\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    // Wrappers\r\n    if (wrappers !== null) {\r\n      var elements = document.querySelectorAll(wrappers as string)\r\n      if (elements && elements.length > 0) {\r\n        for (let i = 0, len = elements.length; i < len; i++) {\r\n          const element = elements[i] as HTMLElement\r\n\r\n          if (!isVisibleElement(element)) {\r\n            continue\r\n          }\r\n\r\n          height = height - parseInt(getCSS(element, 'margin-top'))\r\n          height = height - parseInt(getCSS(element, 'margin-bottom'))\r\n          height = height - parseInt(getCSS(element, 'padding-top'))\r\n          height = height - parseInt(getCSS(element, 'padding-bottom'))\r\n\r\n          const borderTop = getCSS(element, 'border-top')\r\n          if (borderTop) {\r\n            height = height - parseInt(borderTop)\r\n          }\r\n\r\n          const borderBottom = getCSS(element, 'border-bottom')\r\n          if (borderBottom) {\r\n            height = height - parseInt(borderBottom)\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    // Custom offset\r\n    if (offset !== null) {\r\n      height = height - parseInt(offset as string)\r\n    }\r\n\r\n    height = height - parseInt(getCSS(this.element, 'margin-top'))\r\n    height = height - parseInt(getCSS(this.element, 'margin-bottom'))\r\n\r\n    const borderTop = getCSS(this.element, 'border-top')\r\n    if (borderTop) {\r\n      height = height - parseInt(borderTop)\r\n    }\r\n\r\n    const borderBottom = getCSS(this.element, 'border-bottom')\r\n    if (borderBottom) {\r\n      height = height - parseInt(borderBottom)\r\n    }\r\n\r\n    height = String(height) + 'px'\r\n\r\n    return height\r\n  }\r\n\r\n  private setupHeight = () => {\r\n    let height = this.getHeight()\r\n    let heightType = this.getHeightType() as string\r\n\r\n    // Set height\r\n    if (height !== null && height.length > 0) {\r\n      ElementStyleUtil.set(this.element, heightType, height)\r\n    } else {\r\n      ElementStyleUtil.set(this.element, heightType, '')\r\n    }\r\n  }\r\n\r\n  private setupState = () => {\r\n    if (this.getOption('save-state') === true && this.id) {\r\n      const cookie = CookieComponent.get(this.id + 'st')\r\n      if (cookie) {\r\n        var pos = parseInt(cookie)\r\n\r\n        if (pos > 0) {\r\n          this.element.scrollTop = pos\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  private setupScrollHandler = () => {\r\n    if (this.getOption('save-state') === true && this.id) {\r\n      this.element.addEventListener('scroll', this.scrollHandler)\r\n    } else {\r\n      this.element.removeEventListener('scroll', this.scrollHandler)\r\n    }\r\n  }\r\n\r\n  private scrollHandler = () => {\r\n    const cookieId = this.id + 'st'\r\n    CookieComponent.set(cookieId, this.element.scrollTop, {})\r\n  }\r\n\r\n  private destroyScrollHandler = () => {\r\n    this.element.removeEventListener('scroll', this.scrollHandler)\r\n  }\r\n\r\n  private resetHeight = () => {\r\n    const heghtType = this.getHeightType()\r\n    if (heghtType) {\r\n      ElementStyleUtil.set(this.element, heghtType, '')\r\n    }\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  public update = () => {\r\n    // Activate/deactivate\r\n    if (\r\n      this.getOption('activate') === true ||\r\n      !this.element.hasAttribute('data-kt-scroll-activate')\r\n    ) {\r\n      this.setupHeight()\r\n      this.setupScrollHandler()\r\n      this.setupState()\r\n    } else {\r\n      this.resetHeight()\r\n      this.destroyScrollHandler()\r\n    }\r\n  }\r\n\r\n  public getHeight = () => {\r\n    const heightType = this.getHeightType()\r\n    const height = this.getOption(heightType || '')\r\n    if (height instanceof Function) {\r\n      return height.call(height)\r\n    } else if (height !== null && typeof height === 'string' && height.toLowerCase() === 'auto') {\r\n      return this.getAutoHeight()\r\n    } else {\r\n      return height\r\n    }\r\n  }\r\n\r\n  public getElement = () => {\r\n    return this.element\r\n  }\r\n\r\n  // Static methods\r\n  public static hasInstace(element: HTMLElement) {\r\n    return DataUtil.has(element, 'scroll')\r\n  }\r\n\r\n  public static getInstance(element: HTMLElement) {\r\n    if (element !== null && ScrollComponent.hasInstace(element)) {\r\n      return DataUtil.get(element, 'scroll')\r\n    }\r\n  }\r\n\r\n  // Create Instances\r\n  public static createInstances(selector: string) {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((element: Element) => {\r\n      const item = element as HTMLElement\r\n      let scroll = ScrollComponent.getInstance(item)\r\n      if (!scroll) {\r\n        scroll = new ScrollComponent(item, defaultScrollOptions)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static destroyAll(attr: string = '[data-kt-scroll=\"true\"]') {}\r\n\r\n  public static bootstrap(attr: string = '[data-kt-scroll=\"true\"]') {\r\n    ScrollComponent.createInstances(attr)\r\n    ScrollComponent.resize()\r\n  }\r\n\r\n  public static createInstance = (\r\n    element: HTMLElement,\r\n    options: ScrollOptions = defaultScrollOptions\r\n  ): ScrollComponent | undefined => {\r\n    let scroll = ScrollComponent.getInstance(element)\r\n    if (!scroll) {\r\n      scroll = new ScrollComponent(element, options)\r\n    }\r\n    return scroll\r\n  }\r\n\r\n  public static reinitialization(attr: string = '[data-kt-scroll=\"true\"]') {\r\n    ScrollComponent.createInstances(attr)\r\n  }\r\n\r\n  public static updateAll(){\r\n    const elements = document.body.querySelectorAll('[data-kt-scroll=\"true\"]')\r\n    elements.forEach((element: Element) => {\r\n      const instance = ScrollComponent.getInstance(element as HTMLElement)\r\n      if (instance) {\r\n        instance.update()\r\n      }\r\n    })\r\n  }\r\n\r\n  public static resize() {\r\n    // Window Resize Handling\r\n    window.addEventListener('resize', function () {\r\n      let timer\r\n      throttle(\r\n        timer,\r\n        () => {\r\n          // Locate and update Drawer instances on window resize\r\n          ScrollComponent.updateAll();\r\n        },\r\n        200\r\n      )\r\n    })\r\n  }\r\n}\r\n\r\nexport {ScrollComponent, defaultScrollOptions}\r\n","import {\r\n  getScrollTop,\r\n  getAttributeValueByBreakpoint,\r\n  throttle,\r\n  getObjectPropertyValueByKey,\r\n  stringSnakeToCamel,\r\n  getUniqueIdWithPrefix,\r\n  DataUtil,\r\n  ElementAnimateUtil,\r\n} from '../_utils/index'\r\n\r\nexport interface IScrollTopOptions {\r\n  offset: number\r\n  speed: number\r\n}\r\n\r\nconst defaultScrollTopOptions: IScrollTopOptions = {\r\n  offset: 200,\r\n  speed: 600,\r\n}\r\n\r\nclass ScrollTopComponent {\r\n  element: HTMLElement\r\n  options: IScrollTopOptions\r\n  instanceUid: string\r\n\r\n  constructor(_element: HTMLElement, options: IScrollTopOptions) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultScrollTopOptions, options)\r\n    this.instanceUid = getUniqueIdWithPrefix('scrolltop')\r\n\r\n    // Event Handlers\r\n    this._handlers()\r\n\r\n    // Bind Instance\r\n    DataUtil.set(this.element, 'scrolltop', this)\r\n  }\r\n\r\n  private _handlers = () => {\r\n    let timer: number\r\n    window.addEventListener('scroll', () => {\r\n      throttle(timer, () => {\r\n        this._scroll()\r\n      })\r\n    })\r\n\r\n    this.element.addEventListener('click', (e: Event) => {\r\n      e.preventDefault()\r\n      this._go()\r\n    })\r\n  }\r\n\r\n  private _scroll = () => {\r\n    const offset = parseInt(this._getOption('offset') as string)\r\n    const pos = getScrollTop() // current vertical position\r\n    if (pos > offset) {\r\n      if (!document.body.hasAttribute('data-kt-scrolltop')) {\r\n        document.body.setAttribute('data-kt-scrolltop', 'on')\r\n      }\r\n    } else {\r\n      if (document.body.hasAttribute('data-kt-scrolltop')) {\r\n        document.body.removeAttribute('data-kt-scrolltop')\r\n      }\r\n    }\r\n  }\r\n\r\n  private _go = () => {\r\n    const speed = parseInt(this._getOption('speed') as string)\r\n    ElementAnimateUtil.scrollTop(0, speed)\r\n  }\r\n\r\n  private _getOption = (name: string) => {\r\n    const attr = this.element.getAttribute(`data-kt-scrolltop-${name}`)\r\n    if (attr) {\r\n      const value = getAttributeValueByBreakpoint(attr)\r\n      return value !== null && String(value) === 'true'\r\n    }\r\n\r\n    const optionName = stringSnakeToCamel(name)\r\n    const option = getObjectPropertyValueByKey(this.options, optionName)\r\n    if (option) {\r\n      return getAttributeValueByBreakpoint(option)\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n\r\n  // Plugin API\r\n  public go = () => {\r\n    return this._go()\r\n  }\r\n\r\n  public getElement = () => {\r\n    return this.element\r\n  }\r\n\r\n  // Static methods\r\n  public static getInstance = (el: HTMLElement) => {\r\n    const scrollTop = DataUtil.get(el, 'scrolltop')\r\n    if (scrollTop) {\r\n      return scrollTop\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  public static createInstances = (selector: string) => {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((el) => {\r\n      const item = el as HTMLElement\r\n      let scrollTop = ScrollTopComponent.getInstance(item)\r\n      if (!scrollTop) {\r\n        scrollTop = new ScrollTopComponent(item, defaultScrollTopOptions)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string,\r\n    options: IScrollTopOptions = defaultScrollTopOptions\r\n  ): ScrollTopComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let scrollTop = ScrollTopComponent.getInstance(item)\r\n    if (!scrollTop) {\r\n      scrollTop = new ScrollTopComponent(item, options)\r\n    }\r\n    return scrollTop\r\n  }\r\n\r\n  public static bootstrap = () => {\r\n    ScrollTopComponent.createInstances('[data-kt-scrolltop=\"true\"]')\r\n  }\r\n\r\n  public static reinitialization = () => {\r\n    ScrollTopComponent.createInstances('[data-kt-scrolltop=\"true\"]')\r\n  }\r\n\r\n  public static goTop = () => {\r\n    ElementAnimateUtil.scrollTop(0, defaultScrollTopOptions.speed)\r\n  }\r\n}\r\nexport {ScrollTopComponent, defaultScrollTopOptions}\r\n","import {\r\n  getElementIndex,\r\n  getUniqueIdWithPrefix,\r\n  ElementAnimateUtil,\r\n  EventHandlerUtil,\r\n  DataUtil,\r\n  DOMEventHandlerUtil,\r\n  ElementStyleUtil,\r\n} from '../_utils/index'\r\n\r\nexport interface IStepperOptions {\r\n  startIndex: number\r\n  animation: boolean\r\n  animationSpeed: string\r\n  animationNextClass: string\r\n  animationPreviousClass: string\r\n}\r\n\r\nconst defaultStepperOptions: IStepperOptions = {\r\n  startIndex: 1,\r\n  animation: false,\r\n  animationSpeed: '0.3s',\r\n  animationNextClass: 'animate__animated animate__slideInRight animate__fast',\r\n  animationPreviousClass: 'animate__animated animate__slideInLeft animate__fast',\r\n}\r\n\r\nclass StepperComponent {\r\n  element: HTMLElement\r\n  options: IStepperOptions\r\n  instanceUid: string\r\n  steps: NodeListOf<HTMLElement>\r\n  btnNext: HTMLElement | null\r\n  btnPrev: HTMLElement | null\r\n  btnSubmit: HTMLElement | null\r\n  totatStepsNumber: number = 0\r\n  passedStepIndex: number = 0\r\n  currentStepIndex: number = 1\r\n\r\n  constructor(_element: HTMLElement, options: IStepperOptions) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultStepperOptions, options)\r\n    this.instanceUid = getUniqueIdWithPrefix('stepper')\r\n\r\n    // Elements\r\n    this.steps = this.element.querySelectorAll('[data-kt-stepper-element=\"nav\"]')\r\n    this.btnNext = this.element.querySelector('[data-kt-stepper-action=\"next\"]')\r\n    this.btnPrev = this.element.querySelector('[data-kt-stepper-action=\"previous\"]')\r\n    this.btnSubmit = this.element.querySelector('[data-kt-stepper-action=\"submit\"]')\r\n\r\n    // Variables\r\n    this.totatStepsNumber = this.steps?.length | 0\r\n    this.passedStepIndex = 0\r\n    this.currentStepIndex = 1\r\n\r\n    // Set Current Step\r\n    if (this.options.startIndex > 1) {\r\n      this._goTo(this.options.startIndex)\r\n    }\r\n\r\n    // Event Handlers\r\n    this.initHandlers()\r\n\r\n    // Bind Instance\r\n    DataUtil.set(this.element, 'stepper', this)\r\n  }\r\n\r\n  private _goTo = (index: number) => {\r\n    EventHandlerUtil.trigger(this.element, 'kt.stepper.change')\r\n    // Skip if this step is already shown\r\n    if (index === this.currentStepIndex || index > this.totatStepsNumber || index < 0) {\r\n      return\r\n    }\r\n\r\n    // Validate step number\r\n    index = parseInt(index.toString())\r\n    // Set current step\r\n    this.passedStepIndex = this.currentStepIndex\r\n    this.currentStepIndex = index\r\n\r\n    // Refresh elements\r\n    this.refreshUI()\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.stepper.changed')\r\n  }\r\n\r\n  private initHandlers = () => {\r\n    this.btnNext?.addEventListener('click', (e: Event) => {\r\n      e.preventDefault()\r\n\r\n      EventHandlerUtil.trigger(this.element, 'kt.stepper.next', e)\r\n    })\r\n\r\n    this.btnPrev?.addEventListener('click', (e: Event) => {\r\n      e.preventDefault()\r\n\r\n      EventHandlerUtil.trigger(this.element, 'kt.stepper.previous', e)\r\n    })\r\n\r\n    DOMEventHandlerUtil.on(this.element, '[data-kt-stepper-action=\"step\"]', 'click', (e: Event) => {\r\n      e.preventDefault()\r\n\r\n      if (this.steps && this.steps.length > 0) {\r\n        for (let i = 0; i < this.steps.length; i++) {\r\n          if ((this.steps[i] as HTMLElement) === this.element) {\r\n            let index = i + 1\r\n\r\n            const stepDirection = this._getStepDirection(index)\r\n            EventHandlerUtil.trigger(this.element, `stepper.${stepDirection}`, e)\r\n            return\r\n          }\r\n        }\r\n      }\r\n    })\r\n  }\r\n\r\n  private _getStepDirection = (index: number) => {\r\n    return index > this.currentStepIndex ? 'next' : 'previous'\r\n  }\r\n\r\n  private getStepContent = (index: number) => {\r\n    const content = this.element.querySelectorAll('[data-kt-stepper-element=\"content\"]')\r\n    if (!content) {\r\n      return false\r\n    }\r\n\r\n    if (content[index - 1]) {\r\n      return content[index - 1]\r\n    }\r\n\r\n    return false\r\n  }\r\n\r\n  private getLastStepIndex = () => {\r\n    return this.totatStepsNumber\r\n  }\r\n\r\n  private getTotalStepsNumber = () => {\r\n    return this.totatStepsNumber\r\n  }\r\n\r\n  private refreshUI = () => {\r\n    let state = ''\r\n\r\n    if (this.isLastStep()) {\r\n      state = 'last'\r\n    } else if (this.isFirstStep()) {\r\n      state = 'first'\r\n    } else {\r\n      state = 'between'\r\n    }\r\n\r\n    // Set state class\r\n    this.element.classList.remove('last')\r\n    this.element.classList.remove('first')\r\n    this.element.classList.remove('between')\r\n\r\n    this.element.classList.add(state)\r\n\r\n    // Step Items\r\n    const elements = this.element.querySelectorAll(\r\n      '[data-kt-stepper-element=\"nav\"], [data-kt-stepper-element=\"content\"], [data-kt-stepper-element=\"info\"]'\r\n    )\r\n\r\n    if (!elements || elements.length <= 0) {\r\n      return\r\n    }\r\n\r\n    for (var i = 0, len = elements.length; i < len; i++) {\r\n      var element = elements[i] as HTMLElement\r\n      var index = getElementIndex(element) + 1\r\n\r\n      element.classList.remove('current')\r\n      element.classList.remove('completed')\r\n      element.classList.remove('pending')\r\n\r\n      if (index === this.currentStepIndex) {\r\n        element.classList.add('current')\r\n\r\n        if (\r\n          this.options.animation !== false &&\r\n          element.getAttribute('data-kt-stepper-element') === 'content'\r\n        ) {\r\n          ElementStyleUtil.set(element, 'animationDuration', this.options.animationSpeed)\r\n\r\n          const animation =\r\n            this._getStepDirection(this.passedStepIndex) === 'previous'\r\n              ? this.options.animationPreviousClass\r\n              : this.options.animationNextClass\r\n          ElementAnimateUtil.animateClass(element, animation)\r\n        }\r\n      } else {\r\n        if (index < this.currentStepIndex) {\r\n          element.classList.add('completed')\r\n        } else {\r\n          element.classList.add('pending')\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  private isLastStep = () => {\r\n    return this.currentStepIndex === this.totatStepsNumber\r\n  }\r\n\r\n  private isFirstStep = () => {\r\n    return this.currentStepIndex === 1\r\n  }\r\n\r\n  private isBetweenStep = () => {\r\n    return this.isLastStep() === false && this.isFirstStep() === false\r\n  }\r\n\r\n  //   ///////////////////////\r\n  //   // ** Public API  ** //\r\n  //   ///////////////////////\r\n\r\n  //   // Plugin API\r\n  public goto = (index: number) => {\r\n    return this._goTo(index)\r\n  }\r\n\r\n  public goNext = () => {\r\n    return this.goto(this.getNextStepIndex())\r\n  }\r\n\r\n  public goPrev = () => {\r\n    return this.goto(this.getPrevStepIndex())\r\n  }\r\n\r\n  public goFirst = () => {\r\n    return this.goto(1)\r\n  }\r\n\r\n  public goLast = () => {\r\n    return this.goto(this.getLastStepIndex())\r\n  }\r\n\r\n  public getCurrentStepIndex = () => {\r\n    return this.currentStepIndex\r\n  }\r\n\r\n  public getNextStepIndex = () => {\r\n    if (this.totatStepsNumber >= this.currentStepIndex + 1) {\r\n      return this.currentStepIndex + 1\r\n    } else {\r\n      return this.totatStepsNumber\r\n    }\r\n  }\r\n\r\n  public getPassedStepIndex = () => {\r\n    return this.passedStepIndex\r\n  }\r\n\r\n  public getPrevStepIndex = () => {\r\n    if (this.currentStepIndex - 1 > 1) {\r\n      return this.currentStepIndex - 1\r\n    } else {\r\n      return 1\r\n    }\r\n  }\r\n\r\n  public getElement = (index: number) => {\r\n    return this.element\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  public destroy = () => {\r\n    console.log('destroy stepper')\r\n  }\r\n\r\n  public trigger = (name: string, event: Event) => {\r\n    return EventHandlerUtil.trigger(this.element, name, event)\r\n  }\r\n\r\n  // Static methods\r\n  public static hasInstace(element: HTMLElement): boolean {\r\n    return DataUtil.has(element, 'stepper')\r\n  }\r\n\r\n  public static getInstance(element: HTMLElement): StepperComponent | null {\r\n    if (element !== null && StepperComponent.hasInstace(element)) {\r\n      return DataUtil.get(element, 'stepper')\r\n    }\r\n    return null\r\n  }\r\n\r\n  // Create Instances\r\n  public static createInstances(selector: string): void {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((element) => {\r\n      const item = element as HTMLElement\r\n      let stepper = StepperComponent.getInstance(item)\r\n      if (!stepper) {\r\n        stepper = new StepperComponent(item, defaultStepperOptions)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    element: HTMLElement,\r\n    options: IStepperOptions = defaultStepperOptions\r\n  ): StepperComponent | null => {\r\n    if (!element) {\r\n      return null\r\n    }\r\n    let stepper = StepperComponent.getInstance(element)\r\n    if (!stepper) {\r\n      stepper = new StepperComponent(element, options)\r\n    }\r\n    return stepper\r\n  }\r\n\r\n  public static bootstrap(attr: string = '[data-kt-stepper]') {\r\n    StepperComponent.createInstances(attr)\r\n  }\r\n}\r\n\r\nexport {StepperComponent, defaultStepperOptions}\r\n","import {\r\n  getElementOffset,\r\n  getScrollTop,\r\n  getAttributeValueByBreakpoint,\r\n  getUniqueIdWithPrefix,\r\n  getObjectPropertyValueByKey,\r\n  stringSnakeToCamel,\r\n  getCSS,\r\n  DataUtil,\r\n  ElementAnimateUtil,\r\n  ElementStyleUtil,\r\n  EventHandlerUtil,\r\n} from '../_utils/index'\r\n\r\nexport interface StickyOptions {\r\n  offset: number\r\n  reverse: boolean\r\n  animation: boolean\r\n  animationSpeed: string\r\n  animationClass: string\r\n}\r\n\r\nconst defaultStickyOptions: StickyOptions = {\r\n  offset: 200,\r\n  reverse: false,\r\n  animation: true,\r\n  animationSpeed: '0.3s',\r\n  animationClass: 'animation-slide-in-down',\r\n}\r\n\r\nclass StickyComponent {\r\n  element: HTMLElement\r\n  options: StickyOptions\r\n  instanceUid: string\r\n  instanceName: string | null = ''\r\n  attributeName: string\r\n  eventTriggerState: boolean\r\n  lastScrollTop: number\r\n\r\n  constructor(_element: HTMLElement, options: StickyOptions) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultStickyOptions, options)\r\n    this.instanceUid = getUniqueIdWithPrefix('sticky')\r\n    this.instanceName = this.element.getAttribute('data-kt-sticky-name')\r\n    this.attributeName = 'data-kt-sticky-' + this.instanceName\r\n    this.eventTriggerState = true\r\n    this.lastScrollTop = 0\r\n\r\n    // Event Handlers\r\n    window.addEventListener('scroll', this.scroll)\r\n\r\n    // Initial Launch\r\n    this.scroll()\r\n\r\n    DataUtil.set(this.element, 'sticky', this)\r\n  }\r\n\r\n  private scroll = () => {\r\n    let offset = this.getOption('offset')\r\n    let reverse = this.getOption('reverse')\r\n\r\n    // Exit if false\r\n    if (offset === false) {\r\n      return\r\n    }\r\n\r\n    let offsetNum = 0\r\n    if (typeof offset === 'string') {\r\n      offsetNum = parseInt(offset)\r\n    }\r\n\r\n    const st = getScrollTop()\r\n\r\n    // Reverse scroll mode\r\n    if (reverse === true) {\r\n      // Release on reverse scroll mode\r\n      if (st > offsetNum && this.lastScrollTop < st) {\r\n        if (document.body.hasAttribute(this.attributeName) === false) {\r\n          this.enable()\r\n          document.body.setAttribute(this.attributeName, 'on')\r\n        }\r\n\r\n        if (this.eventTriggerState === true) {\r\n          EventHandlerUtil.trigger(this.element, 'kt.sticky.on')\r\n          EventHandlerUtil.trigger(this.element, 'kt.sticky.change')\r\n\r\n          this.eventTriggerState = false\r\n        }\r\n      } else {\r\n        // Back scroll mode\r\n        if (document.body.hasAttribute(this.attributeName)) {\r\n          this.disable()\r\n          document.body.removeAttribute(this.attributeName)\r\n        }\r\n\r\n        if (this.eventTriggerState === false) {\r\n          EventHandlerUtil.trigger(this.element, 'kt.sticky.off')\r\n          EventHandlerUtil.trigger(this.element, 'kt.sticky.change')\r\n\r\n          this.eventTriggerState = true\r\n        }\r\n      }\r\n\r\n      this.lastScrollTop = st\r\n      return\r\n    }\r\n\r\n    // Classic scroll mode\r\n    if (st > offsetNum) {\r\n      if (document.body.hasAttribute(this.attributeName) === false) {\r\n        this.enable()\r\n        document.body.setAttribute(this.attributeName, 'on')\r\n      }\r\n\r\n      if (this.eventTriggerState === true) {\r\n        EventHandlerUtil.trigger(this.element, 'kt.sticky.on')\r\n        EventHandlerUtil.trigger(this.element, 'kt.sticky.change')\r\n        this.eventTriggerState = false\r\n      }\r\n    } else {\r\n      // back scroll mode\r\n      if (document.body.hasAttribute(this.attributeName) === true) {\r\n        this.disable()\r\n        document.body.removeAttribute(this.attributeName)\r\n      }\r\n\r\n      if (this.eventTriggerState === false) {\r\n        EventHandlerUtil.trigger(this.element, 'kt.sticky.off')\r\n        EventHandlerUtil.trigger(this.element, 'kt.sticky.change')\r\n        this.eventTriggerState = true\r\n      }\r\n    }\r\n  }\r\n\r\n  private getOption = (name: string) => {\r\n    const dataStickyAttr = 'data-kt-sticky-' + name\r\n    if (this.element.hasAttribute(dataStickyAttr) === true) {\r\n      const attrValueInStr = this.element.getAttribute(dataStickyAttr)\r\n      const attrValue = getAttributeValueByBreakpoint(attrValueInStr || '')\r\n      if (attrValue !== null && String(attrValue) === 'true') {\r\n        return true\r\n      } else if (attrValue !== null && String(attrValue) === 'false') {\r\n        return false\r\n      }\r\n\r\n      return attrValue\r\n    } else {\r\n      const optionName = stringSnakeToCamel(name)\r\n      const option = getObjectPropertyValueByKey(this.options, optionName)\r\n      if (option) {\r\n        return getAttributeValueByBreakpoint(option)\r\n      }\r\n    }\r\n  }\r\n\r\n  private disable = () => {\r\n    ElementStyleUtil.remove(this.element, 'top')\r\n    ElementStyleUtil.remove(this.element, 'width')\r\n    ElementStyleUtil.remove(this.element, 'left')\r\n    ElementStyleUtil.remove(this.element, 'right')\r\n    ElementStyleUtil.remove(this.element, 'z-index')\r\n    ElementStyleUtil.remove(this.element, 'position')\r\n  }\r\n\r\n  private enable = (update: boolean = false) => {\r\n    const top = this.getOption('top')\r\n    const left = this.getOption('left')\r\n    // const right = this.getOption(\"right\");\r\n    let width = this.getOption('width')\r\n    const zindex = this.getOption('zindex')\r\n\r\n    if (update !== true && this.getOption('animation') === true) {\r\n      ElementStyleUtil.set(this.element, 'animationDuration', this.getOption('animationSpeed'))\r\n      ElementAnimateUtil.animateClass(this.element, 'animation ' + this.getOption('animationClass'))\r\n    }\r\n\r\n    if (zindex !== null) {\r\n      ElementStyleUtil.set(this.element, 'z-index', zindex)\r\n      ElementStyleUtil.set(this.element, 'position', 'fixed')\r\n    }\r\n\r\n    if (top !== null) {\r\n      ElementStyleUtil.set(this.element, 'top', top)\r\n    }\r\n\r\n    if (width !== null && width !== undefined) {\r\n      const widthTarget = getObjectPropertyValueByKey(width, 'target')\r\n      if (widthTarget) {\r\n        const targetElement = document.querySelector(widthTarget)\r\n        if (targetElement) {\r\n          width = getCSS(targetElement, 'width')\r\n        }\r\n      }\r\n      ElementStyleUtil.set(this.element, 'width', width)\r\n    }\r\n\r\n    if (left !== null) {\r\n      if (String(left).toLowerCase() === 'auto') {\r\n        var offsetLeft = getElementOffset(this.element).left\r\n\r\n        if (offsetLeft > 0) {\r\n          ElementStyleUtil.set(this.element, 'left', String(offsetLeft) + 'px')\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  public update = () => {\r\n    if (document.body.hasAttribute(this.attributeName) === true) {\r\n      this.disable()\r\n      document.body.removeAttribute(this.attributeName)\r\n      this.enable(true)\r\n      document.body.setAttribute(this.attributeName, 'on')\r\n    }\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, callBack: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, callBack)\r\n  }\r\n\r\n  public one = (name: string, callback: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, callback)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  public trigger = (name: string) => {\r\n    return EventHandlerUtil.trigger(this.element, name)\r\n  }\r\n\r\n  // Static methods\r\n  public static hasInstace(element: HTMLElement) {\r\n    return DataUtil.has(element, 'sticky')\r\n  }\r\n\r\n  public static getInstance(element: HTMLElement) {\r\n    if (element !== null && StickyComponent.hasInstace(element)) {\r\n      return DataUtil.get(element, 'sticky')\r\n    }\r\n  }\r\n\r\n  // Create Instances\r\n  public static createInstances(selector: string) {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((element) => {\r\n      const item = element as HTMLElement\r\n      let sticky = StickyComponent.getInstance(item)\r\n      if (!sticky) {\r\n        sticky = new StickyComponent(item, defaultStickyOptions)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string,\r\n    options: StickyOptions = defaultStickyOptions\r\n  ): StickyComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let sticky = StickyComponent.getInstance(item)\r\n    if (!sticky) {\r\n      sticky = new StickyComponent(item, options)\r\n    }\r\n    return sticky\r\n  }\r\n\r\n  public static bootstrap(attr: string = '[data-kt-sticky=\"true\"]') {\r\n    StickyComponent.createInstances(attr)\r\n  }\r\n\r\n  public static reInitialization(attr: string = '[data-kt-sticky=\"true\"]') {\r\n    StickyComponent.createInstances(attr)\r\n  }\r\n}\r\n\r\nexport {StickyComponent, defaultStickyOptions}\r\n","import {DataUtil, getUniqueIdWithPrefix, EventHandlerUtil} from '../_utils/index'\r\n// Helpers\r\nimport {CookieComponent} from './_CookieComponent'\r\n\r\nexport interface ToggleOptions {\r\n  saveState: boolean\r\n  targetState?: string\r\n  toggleState?: string\r\n  targetToggleMode?: string\r\n}\r\n\r\nconst defaultToggleOptions: ToggleOptions = {\r\n  saveState: false,\r\n}\r\n\r\nclass ToggleComponent {\r\n  element: HTMLElement\r\n  instanceUid: string\r\n  options: ToggleOptions\r\n  state: string = ''\r\n  target: HTMLElement | null = null\r\n  attribute: string = ''\r\n\r\n  constructor(_element: HTMLElement, options: ToggleOptions) {\r\n    this.options = Object.assign(defaultToggleOptions, options)\r\n    this.instanceUid = getUniqueIdWithPrefix('toggle')\r\n    this.element = _element\r\n\r\n    const elementTargetAttr = this.element.getAttribute('data-kt-toggle-target')\r\n    if (elementTargetAttr) {\r\n      this.target = document.querySelector(elementTargetAttr)\r\n    }\r\n    const elementToggleAttr = this.element.getAttribute('data-kt-toggle-state')\r\n    this.state = elementToggleAttr || ''\r\n    this.attribute = 'data-kt-' + this.element.getAttribute('data-kt-toggle-name')\r\n\r\n    // Event Handlers\r\n    this._handlers()\r\n\r\n    // Update Instance\r\n    // Bind Instance\r\n    DataUtil.set(this.element, 'toggle', this)\r\n  }\r\n\r\n  private _handlers = () => {\r\n    this.element.addEventListener('click', (e: Event) => {\r\n      e.preventDefault()\r\n      this._toggle()\r\n    })\r\n  }\r\n\r\n  // Event handlers\r\n  private _toggle = () => {\r\n    // Trigger \"after.toggle\" event\r\n    EventHandlerUtil.trigger(this.element, 'kt.toggle.change')\r\n\r\n    if (this._isEnabled()) {\r\n      this._disable()\r\n    } else {\r\n      this._enable()\r\n    }\r\n\r\n    // Trigger \"before.toggle\" event\r\n    EventHandlerUtil.trigger(this.element, 'kt.toggle.changed')\r\n    return this\r\n  }\r\n\r\n  private _enable = () => {\r\n    if (this._isEnabled()) {\r\n      return\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.toggle.enable')\r\n    this.target?.setAttribute(this.attribute, 'on')\r\n    if (this.state.length > 0) {\r\n      this.element.classList.add(this.state)\r\n    }\r\n\r\n    if (this.options.saveState) {\r\n      CookieComponent.set(this.attribute, 'on', {})\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.toggle.enabled')\r\n    return this\r\n  }\r\n\r\n  private _disable = () => {\r\n    if (!this._isEnabled()) {\r\n      return false\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.toggle.disable')\r\n    this.target?.removeAttribute(this.attribute)\r\n\r\n    if (this.state.length > 0) {\r\n      this.element.classList.remove(this.state)\r\n    }\r\n\r\n    if (this.options.saveState) {\r\n      CookieComponent.delete(this.attribute)\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.toggle.disabled')\r\n    return this\r\n  }\r\n\r\n  private _isEnabled = () => {\r\n    if (!this.target) {\r\n      return false\r\n    }\r\n\r\n    return String(this.target.getAttribute(this.attribute)).toLowerCase() === 'on'\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n\r\n  // Plugin API\r\n  // Plugin API\r\n  public toggle = () => {\r\n    return this._toggle()\r\n  }\r\n\r\n  public enable = () => {\r\n    return this._enable()\r\n  }\r\n\r\n  public disable = () => {\r\n    return this._disable()\r\n  }\r\n\r\n  public isEnabled = () => {\r\n    return this._isEnabled()\r\n  }\r\n\r\n  public goElement = () => {\r\n    return this.element\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  public trigger = (name: string, event?: Event) => {\r\n    return EventHandlerUtil.trigger(this.element, name, event)\r\n  }\r\n\r\n  // Static methods\r\n  public static getInstance = (el: HTMLElement) => {\r\n    const toggleElement = DataUtil.get(el, 'toggle')\r\n    if (toggleElement) {\r\n      return toggleElement\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  public static createInstances = (selector: string) => {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((el) => {\r\n      const item = el as HTMLElement\r\n      let toggleElement = ToggleComponent.getInstance(item)\r\n      if (!toggleElement) {\r\n        toggleElement = new ToggleComponent(item, defaultToggleOptions)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string,\r\n    options: ToggleOptions = defaultToggleOptions\r\n  ): ToggleComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let toggle = ToggleComponent.getInstance(item)\r\n    if (!toggle) {\r\n      toggle = new ToggleComponent(item, options)\r\n    }\r\n    return toggle\r\n  }\r\n\r\n  public static reinitialization = () => {\r\n    ToggleComponent.createInstances('[data-kt-toggle]')\r\n  }\r\n\r\n  public static bootstrap = () => {\r\n    ToggleComponent.createInstances('[data-kt-toggle]')\r\n  }\r\n}\r\n\r\nexport {ToggleComponent, defaultToggleOptions}\r\n","/* eslint-disable array-callback-return */\r\n/* eslint-disable no-useless-escape */\r\nimport {DataUtil} from '../_utils/index'\r\n\r\nexport interface IPasswordMeterOptions {\r\n  minLength: number\r\n  checkUppercase: boolean\r\n  checkLowercase: boolean\r\n  checkDigit: boolean\r\n  checkChar: boolean\r\n  scoreHighlightClass: string\r\n}\r\n\r\nexport interface IPasswordMeterQueries {\r\n  componentName: string\r\n  instanseQuery: string\r\n  inputQuery: string\r\n  visibilityQuery: string\r\n  highlightQuery: string\r\n}\r\n\r\nconst defaultPasswordMeterOptions = {\r\n  minLength: 8,\r\n  checkUppercase: true,\r\n  checkLowercase: true,\r\n  checkDigit: true,\r\n  checkChar: true,\r\n  scoreHighlightClass: 'active',\r\n}\r\n\r\nconst defaultPasswordMeterQueires: IPasswordMeterQueries = {\r\n  componentName: 'password-meter',\r\n  instanseQuery: '[data-kt-password-meter]',\r\n  inputQuery: 'input[type]',\r\n  visibilityQuery: '[data-kt-password-meter-control=\"visibility\"]',\r\n  highlightQuery: '[data-kt-password-meter-control=\"highlight\"]',\r\n}\r\n\r\nclass PasswordMeterComponent {\r\n  element: HTMLElement\r\n  inputElement: HTMLInputElement | null\r\n  visibilityElement: HTMLElement | null\r\n  highlightElement: HTMLElement | null\r\n  options: IPasswordMeterOptions\r\n  queries: IPasswordMeterQueries\r\n  score: number\r\n  checkSteps: number\r\n\r\n  constructor(\r\n    _element: HTMLElement,\r\n    _options: IPasswordMeterOptions,\r\n    _queries: IPasswordMeterQueries\r\n  ) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultPasswordMeterOptions, _options)\r\n    this.queries = _queries\r\n    this.score = 0\r\n    this.checkSteps = 5\r\n\r\n    // Elements\r\n    this.inputElement = this.element.querySelector(this.queries.inputQuery)\r\n    this.visibilityElement = this.element.querySelector(this.queries.visibilityQuery)\r\n    this.highlightElement = this.element.querySelector(this.queries.highlightQuery)\r\n\r\n    // Event Handlers\r\n    this.handlers()\r\n\r\n    DataUtil.set(this.element, this.queries.componentName, this)\r\n  }\r\n\r\n  private handlers(): void {\r\n    if (this.inputElement) {\r\n      this.inputElement.addEventListener('input', () => {\r\n        this.check()\r\n      })\r\n    }\r\n\r\n    if (this.visibilityElement) {\r\n      this.visibilityElement.addEventListener('click', () => {\r\n        this.visitbility()\r\n      })\r\n    }\r\n  }\r\n\r\n  private visitbility() {\r\n    if (this.visibilityElement && this.inputElement) {\r\n      const visibleIcon = this.visibilityElement.querySelector(\r\n        'i:not(.d-none), .svg-icon:not(.d-none)'\r\n      )\r\n\r\n      const hiddenIcon = this.visibilityElement.querySelector('i.d-none, .svg-icon.d-none')\r\n\r\n      const typeAttr = this.inputElement.getAttribute('type') || ''\r\n\r\n      if (typeAttr === 'password') {\r\n        this.inputElement.setAttribute('type', 'text')\r\n      } else {\r\n        this.inputElement.setAttribute('type', 'password')\r\n      }\r\n\r\n      visibleIcon?.classList.add('d-none')\r\n      hiddenIcon?.classList.remove('d-none')\r\n\r\n      this.inputElement.focus()\r\n    }\r\n  }\r\n\r\n  private checkScore(): number {\r\n    return 0\r\n  }\r\n\r\n  private checkLength(): boolean {\r\n    if (this.inputElement) {\r\n      return this.inputElement.value.length >= this.options.minLength // 20 score\r\n    }\r\n\r\n    return false\r\n  }\r\n\r\n  private checkLowerCase(): boolean {\r\n    const val = this.inputElement ? this.inputElement.value : ''\r\n    return /[a-z]/.test(val) // 20 score\r\n  }\r\n\r\n  private checkUppercase(): boolean {\r\n    const val = this.inputElement ? this.inputElement.value : ''\r\n    return /[A-Z]/.test(val) // 20 score\r\n  }\r\n\r\n  private checkDigit(): boolean {\r\n    const val = this.inputElement ? this.inputElement.value : ''\r\n    return /[0-9]/.test(val) // 20 score\r\n  }\r\n\r\n  private checkChar(): boolean {\r\n    const val = this.inputElement ? this.inputElement.value : ''\r\n    return /[~`!#$%\\^&*+=\\-\\[\\]\\\\';,/{}|\\\\\":<>\\?]/g.test(val) // 20 score\r\n  }\r\n\r\n  private getCheckScore(): number {\r\n    let count = 1\r\n    if (this.options.checkUppercase) {\r\n      count++\r\n    }\r\n\r\n    if (this.options.checkLowercase) {\r\n      count++\r\n    }\r\n\r\n    if (this.options.checkDigit) {\r\n      count++\r\n    }\r\n\r\n    if (this.options.checkChar) {\r\n      count++\r\n    }\r\n\r\n    this.checkSteps = count\r\n    return 100 / this.checkSteps\r\n  }\r\n\r\n  private highlight() {\r\n    const items = this.highlightElement\r\n      ? [].slice.call(this.highlightElement.querySelectorAll('div'))\r\n      : []\r\n    const total = items.length\r\n    let index = 0\r\n    const checkScore = this.getCheckScore()\r\n    const score = this.getScore()\r\n\r\n    items.map((item: HTMLElement) => {\r\n      index++\r\n      if (checkScore * index * (this.checkSteps / total) <= score) {\r\n        item.classList.add('active')\r\n      } else {\r\n        item.classList.remove('active')\r\n      }\r\n    })\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  public reset = () => {\r\n    this.score = 0\r\n    this.highlight()\r\n  }\r\n\r\n  public getScore() {\r\n    return this.score\r\n  }\r\n\r\n  public check() {\r\n    let score = 0\r\n    const checkScore = this.checkScore()\r\n    if (this.checkLength()) {\r\n      score = score + checkScore\r\n    }\r\n\r\n    if (this.options.checkUppercase && this.checkLowerCase()) {\r\n      score = score + checkScore\r\n    }\r\n\r\n    if (this.options.checkLowercase && this.checkUppercase()) {\r\n      score = score + checkScore\r\n    }\r\n\r\n    if (this.options.checkDigit && this.checkDigit()) {\r\n      score = score + checkScore\r\n    }\r\n\r\n    if (this.options.checkChar && this.checkChar()) {\r\n      score = score + checkScore\r\n    }\r\n\r\n    this.score = score\r\n    this.highlight()\r\n  }\r\n\r\n  // Static methods\r\n  public static getInstance = (\r\n    el: HTMLElement,\r\n    componentName: string = defaultPasswordMeterQueires.componentName\r\n  ) => {\r\n    const passwordMeter = DataUtil.get(el, componentName)\r\n    if (passwordMeter) {\r\n      return passwordMeter\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  public static createInstances = (\r\n    selector: string = defaultPasswordMeterQueires.instanseQuery,\r\n    options: IPasswordMeterOptions = defaultPasswordMeterOptions,\r\n    queries: IPasswordMeterQueries = defaultPasswordMeterQueires\r\n  ) => {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((el) => {\r\n      const item = el as HTMLElement\r\n      let passwordMeter = PasswordMeterComponent.getInstance(item)\r\n      if (!passwordMeter) {\r\n        passwordMeter = new PasswordMeterComponent(item, options, queries)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string = defaultPasswordMeterQueires.instanseQuery,\r\n    options: IPasswordMeterOptions = defaultPasswordMeterOptions,\r\n    queries: IPasswordMeterQueries = defaultPasswordMeterQueires\r\n  ): PasswordMeterComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let passwordMeter = PasswordMeterComponent.getInstance(item)\r\n    if (!passwordMeter) {\r\n      passwordMeter = new PasswordMeterComponent(item, options, queries)\r\n    }\r\n    return passwordMeter\r\n  }\r\n\r\n  public static bootstrap = (selector: string = defaultPasswordMeterQueires.instanseQuery) => {\r\n    PasswordMeterComponent.createInstances(selector)\r\n  }\r\n\r\n  public static reinitialization = (\r\n    selector: string = defaultPasswordMeterQueires.instanseQuery\r\n  ) => {\r\n    PasswordMeterComponent.createInstances(selector)\r\n  }\r\n}\r\nexport {PasswordMeterComponent, defaultPasswordMeterOptions, defaultPasswordMeterQueires}\r\n","import {\r\n  getAttributeValueByBreakpoint,\r\n  stringSnakeToCamel,\r\n  getObjectPropertyValueByKey,\r\n  EventHandlerUtil,\r\n  throttle,\r\n} from '../_utils/index'\r\n\r\nexport class SwapperStore {\r\n  static store: Map<string, SwapperComponent> = new Map()\r\n\r\n  public static set(instanceId: string, drawerComponentObj: SwapperComponent): void {\r\n    if (SwapperStore.has(instanceId)) {\r\n      return\r\n    }\r\n\r\n    SwapperStore.store.set(instanceId, drawerComponentObj);\r\n  }\r\n\r\n  public static get(instanceId: string): SwapperComponent | undefined {\r\n    if (!SwapperStore.has(instanceId)) {\r\n      return\r\n    }\r\n    return SwapperStore.store.get(instanceId);\r\n  }\r\n\r\n  public static remove(instanceId: string): void {\r\n    if (!SwapperStore.has(instanceId)) {\r\n      return\r\n    }\r\n\r\n    SwapperStore.store.delete(instanceId)\r\n  }\r\n\r\n  public static has(instanceId: string): boolean {\r\n    return SwapperStore.store.has(instanceId);\r\n  }\r\n\r\n  public static getAllInstances() {\r\n    return SwapperStore.store;\r\n  }\r\n}\r\n\r\nexport interface ISwapperOptions {\r\n  mode: string\r\n}\r\n\r\nexport interface ISwapperQueries {\r\n  componentName: string\r\n  instanseQuery: string\r\n  attrQuery: string\r\n}\r\n\r\nconst defaultSwapperOptions: ISwapperOptions = {\r\n  mode: 'append',\r\n}\r\n\r\nconst defaultSwapperQueires: ISwapperQueries = {\r\n  componentName: 'swapper',\r\n  instanseQuery: '[data-kt-swapper=\"true\"]',\r\n  attrQuery: 'data-kt-swapper-',\r\n}\r\n\r\nclass SwapperComponent {\r\n  element: HTMLElement\r\n  options: ISwapperOptions\r\n  queries: ISwapperQueries\r\n\r\n  constructor(_element: HTMLElement, _options: ISwapperOptions, _queries: ISwapperQueries) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultSwapperOptions, _options)\r\n    this.queries = _queries\r\n\r\n    // Initial update\r\n    this.update()\r\n\r\n    SwapperStore.set(this.element.id, this)\r\n  }\r\n\r\n  private getOption(name: string) {\r\n    const attr = this.element.getAttribute(`${this.queries.attrQuery}${name}`)\r\n    if (attr) {\r\n      let value = getAttributeValueByBreakpoint(attr)\r\n      if (attr != null && String(value) === 'true') {\r\n        return true\r\n      } else if (value !== null && String(value) === 'false') {\r\n        return false\r\n      }\r\n      return value\r\n    } else {\r\n      const optionName = stringSnakeToCamel(name)\r\n      const option = getObjectPropertyValueByKey(this.options, optionName)\r\n      if (option) {\r\n        return getAttributeValueByBreakpoint(option)\r\n      } else {\r\n        return null\r\n      }\r\n    }\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  public update = () => {\r\n    const parentSelector = this.getOption('parent')?.toString()\r\n    const mode = this.getOption('mode')\r\n    const parentElement = parentSelector ? document.querySelector(parentSelector) : null\r\n\r\n    if (parentElement && this.element.parentNode !== parentElement) {\r\n      if (mode === 'prepend') {\r\n        parentElement.prepend(this.element)\r\n      } else if (mode === 'append') {\r\n        parentElement.append(this.element)\r\n      }\r\n    }\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  public trigger = (name: string, event: Event) => {\r\n    return EventHandlerUtil.trigger(this.element, name, event)\r\n  }\r\n\r\n  // Static methods\r\n  public static getInstance = (\r\n    el: HTMLElement,\r\n    componentName: string = defaultSwapperQueires.componentName\r\n  ): SwapperComponent | null => {\r\n    const place = SwapperStore.get(el.id)\r\n    if (place) {\r\n      return place as SwapperComponent\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  public static createInstances = (\r\n    selector: string = defaultSwapperQueires.instanseQuery,\r\n    options: ISwapperOptions = defaultSwapperOptions,\r\n    queries: ISwapperQueries = defaultSwapperQueires\r\n  ) => {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((el) => {\r\n      const item = el as HTMLElement\r\n      let place = SwapperComponent.getInstance(item)\r\n      if (!place) {\r\n        place = new SwapperComponent(item, options, queries)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string = defaultSwapperQueires.instanseQuery,\r\n    options: ISwapperOptions = defaultSwapperOptions,\r\n    queries: ISwapperQueries = defaultSwapperQueires\r\n  ): SwapperComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let place = SwapperComponent.getInstance(item)\r\n    if (!place) {\r\n      place = new SwapperComponent(item, options, queries)\r\n    }\r\n    return place\r\n  }\r\n\r\n  public static bootstrap = (selector: string = defaultSwapperQueires.instanseQuery) => {\r\n    SwapperComponent.createInstances(selector)\r\n  }\r\n\r\n  public static reinitialization = (selector: string = defaultSwapperQueires.instanseQuery) => {\r\n    SwapperComponent.createInstances(selector)\r\n  }\r\n}\r\n\r\n// Window resize handler\r\nwindow.addEventListener('resize', function () {\r\n  let timer\r\n  throttle(\r\n    timer,\r\n    () => {\r\n      // Locate and update Offcanvas instances on window resize\r\n      const elements = document.querySelectorAll(defaultSwapperQueires.instanseQuery)\r\n      elements.forEach((el) => {\r\n        const place = SwapperComponent.getInstance(el as HTMLElement)\r\n        if (place) {\r\n          place.update()\r\n        }\r\n      })\r\n    },\r\n    200\r\n  )\r\n})\r\n\r\nexport {SwapperComponent, defaultSwapperOptions, defaultSwapperQueires}\r\n","import {createPopper, VirtualElement} from '@popperjs/core'\r\nimport {\r\n  getElementChild,\r\n  getElementParents,\r\n  getAttributeValueByBreakpoint,\r\n  getUniqueIdWithPrefix,\r\n  DataUtil,\r\n  ElementStyleUtil,\r\n  EventHandlerUtil,\r\n  insertAfterElement,\r\n  slideUp,\r\n  slideDown,\r\n  DOMEventHandlerUtil,\r\n  throttle,\r\n  getHighestZindex,\r\n} from '../_utils/index'\r\n\r\nexport interface MenuOptions {\r\n  dropdown: {\r\n    hoverTimeout: number\r\n    zindex: number\r\n  }\r\n  accordion: {\r\n    slideSpeed: number\r\n    expand: boolean\r\n  }\r\n}\r\n\r\nconst defaultMenuOptions: MenuOptions = {\r\n  dropdown: {\r\n    hoverTimeout: 200,\r\n    zindex: 105,\r\n  },\r\n  accordion: {\r\n    slideSpeed: 250,\r\n    expand: false,\r\n  },\r\n}\r\n\r\ntype PopperPlacement =\r\n  | 'right'\r\n  | 'auto'\r\n  | 'auto-start'\r\n  | 'auto-end'\r\n  | 'top'\r\n  | 'bottom'\r\n  | 'left'\r\n  | 'top-start'\r\n  | 'top-end'\r\n  | 'bottom-start'\r\n  | 'bottom-end'\r\n  | 'right-start'\r\n  | 'right-end'\r\n  | 'left-start'\r\n  | 'left-end'\r\n  | undefined\r\n\r\nclass MenuComponent {\r\n  element: HTMLElement\r\n  options: MenuOptions\r\n  instanceUid: string\r\n  triggerElement: HTMLElement | null = null\r\n\r\n  constructor(_element: HTMLElement, options: MenuOptions) {\r\n    this.element = _element\r\n    this.options = Object.assign(defaultMenuOptions, options)\r\n    this.instanceUid = getUniqueIdWithPrefix('menu')\r\n    // this.element.setAttribute('data-kt-menu', 'true')\r\n    this._setTriggerElement()\r\n    this._update()\r\n    DataUtil.set(this.element, 'menu', this)\r\n    return this\r\n  }\r\n\r\n  // Set external trigger element\r\n  private _setTriggerElement = () => {\r\n    const target = document.querySelector(\r\n      `[data-kt-menu-target=\"#${this.element.getAttribute('id')}\"`\r\n    )\r\n\r\n    if (target) {\r\n      this.triggerElement = target as HTMLElement\r\n    } else if (this.element.closest('[data-kt-menu-trigger]')) {\r\n      this.triggerElement = this.element.closest('[data-kt-menu-trigger]') as HTMLElement\r\n    } else if (\r\n      this.element.parentNode &&\r\n      getElementChild(this.element.parentNode as HTMLElement, '[data-kt-menu-trigger]')\r\n    ) {\r\n      const child = getElementChild(\r\n        this.element.parentNode as HTMLElement,\r\n        '[data-kt-menu-trigger]'\r\n      )\r\n      if (child) {\r\n        this.triggerElement = child\r\n      }\r\n    }\r\n\r\n    if (this.triggerElement) {\r\n      DataUtil.set(this.triggerElement, 'menu', this)\r\n    }\r\n  }\r\n\r\n  // Test if menu has external trigger element\r\n  private _isTriggerElement = (item: HTMLElement) => {\r\n    return this.triggerElement === item\r\n  }\r\n\r\n  // Get item option(through html attributes)\r\n  private _getItemOption = (item: HTMLElement, name: string) => {\r\n    let value: string | JSON | null | boolean = null\r\n    if (item && item.hasAttribute('data-kt-menu-' + name)) {\r\n      const attr = item.getAttribute('data-kt-menu-' + name) || ''\r\n      value = getAttributeValueByBreakpoint(attr)\r\n      if (value !== null && String(value) === 'true') {\r\n        value = true\r\n      } else if (value !== null && String(value) === 'false') {\r\n        value = false\r\n      }\r\n    }\r\n    return value\r\n  }\r\n\r\n  // Get item element\r\n  private _getItemElement = (_element: HTMLElement) => {\r\n    // Element is the external trigger element\r\n    if (this._isTriggerElement(_element)) {\r\n      return _element\r\n    }\r\n\r\n    // Element has item toggler attribute\r\n    if (_element.hasAttribute('data-kt-menu-trigger')) {\r\n      return _element\r\n    }\r\n\r\n    // Element has item DOM reference in it's data storage\r\n    const itemElement = DataUtil.get(_element, 'item')\r\n    if (itemElement) {\r\n      return itemElement\r\n    }\r\n\r\n    // Item is parent of element\r\n    const item = _element.closest('.menu-item[data-kt-menu-trigger]')\r\n    if (item) {\r\n      return item\r\n    }\r\n\r\n    // Element's parent has item DOM reference in it's data storage\r\n    const sub = _element.closest('.menu-sub')\r\n    if (sub) {\r\n      const subItem = DataUtil.get(sub as HTMLElement, 'item')\r\n      if (subItem) {\r\n        return subItem\r\n      }\r\n    }\r\n  }\r\n\r\n  // Get item parent element\r\n  private _getItemParentElement = (item: HTMLElement) => {\r\n    const sub = item.closest('.menu-sub')\r\n    if (!sub) {\r\n      return null\r\n    }\r\n\r\n    const subItem = DataUtil.get(sub as HTMLElement, 'item')\r\n    if (subItem) {\r\n      return subItem\r\n    }\r\n\r\n    const parentItem = sub.closest('.menu-item[data-kt-menu-trigger]')\r\n    if (sub && parentItem) {\r\n      return parentItem\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  // Get item parent elements\r\n  private _getItemParentElements = (item: HTMLElement) => {\r\n    const parents:Array<Element> = []\r\n    let parent:Element\r\n    let i = 0\r\n    let buffer:HTMLElement = item\r\n\r\n    do {\r\n      parent = this._getItemParentElement(buffer)\r\n      if (parent) {\r\n        parents.push(parent)\r\n        buffer = parent as HTMLElement\r\n      }\r\n\r\n      i++\r\n    } while (parent !== null && i < 20)\r\n\r\n    if (this.triggerElement) {\r\n      parents.unshift(this.triggerElement)\r\n    }\r\n\r\n    return parents\r\n  }\r\n\r\n  // Prepare popper config for dropdown(see: https://popper.js.org/docs/v2/)\r\n  private _getDropdownPopperConfig = (item: HTMLElement) => {\r\n    // Placement\r\n    const placementOption = this._getItemOption(item, 'placement')\r\n    let placement: PopperPlacement = 'right'\r\n    if (placementOption) {\r\n      placement = placementOption as PopperPlacement\r\n    }\r\n\r\n    // Flip\r\n    // const flipValue = this._getItemOption(item, 'flip')\r\n    // const flip = flipValue ? flipValue.toString().split(',') : []\r\n\r\n    // Offset\r\n    const offsetValue = this._getItemOption(item, 'offset')\r\n    const offset = offsetValue ? offsetValue.toString().split(',') : []\r\n\r\n    // Strategy\r\n    const strategy: 'absolute' | 'fixed' | undefined =\r\n      this._getItemOption(item, 'overflow') === true ? 'absolute' : 'fixed'\r\n\r\n    return {\r\n      placement: placement,\r\n      strategy: strategy,\r\n      modifiers: [\r\n        {\r\n          name: 'offset',\r\n          options: {\r\n            offset: offset,\r\n          },\r\n        },\r\n        {\r\n          name: 'preventOverflow'\r\n        },\r\n        {\r\n          name: 'flip',\r\n          options: {\r\n            // altBoundary: true,\r\n            // fallbackPlacements: flip,\r\n            flipVariations: false\r\n          },\r\n        },\r\n      ],\r\n    }\r\n  }\r\n\r\n  // Get item child element\r\n  private _getItemChildElement = (item: HTMLElement) => {\r\n    let selector = item\r\n\r\n    const subItem = DataUtil.get(item, 'sub')\r\n    if (subItem) {\r\n      selector = subItem\r\n    }\r\n\r\n    if (selector) {\r\n      //element = selector.querySelector('.show.menu-item[data-kt-menu-trigger]');\r\n      const element = selector.querySelector('.menu-item[data-kt-menu-trigger]')\r\n      if (element) {\r\n        return element\r\n      }\r\n    }\r\n    return null\r\n  }\r\n\r\n  // Get item child elements\r\n  private _getItemChildElements = (item: HTMLElement) => {\r\n    const children: Array<Element> = []\r\n    let child:Element | null\r\n    let i = 0\r\n    let buffer = item\r\n    do {\r\n      child = this._getItemChildElement(buffer)\r\n      if (child) {\r\n        children.push(child)\r\n        buffer = child as HTMLElement\r\n      }\r\n\r\n      i++\r\n    } while (child !== null && i < 20)\r\n\r\n    return children\r\n  }\r\n\r\n  // Get item sub element\r\n  private _getItemSubElement = (item: HTMLElement) => {\r\n    if (!item) {\r\n      return null\r\n    }\r\n\r\n    if (this._isTriggerElement(item)) {\r\n      return this.element\r\n    }\r\n\r\n    if (item.classList.contains('menu-sub')) {\r\n      return item\r\n    } else if (DataUtil.has(item, 'sub')) {\r\n      return DataUtil.get(item, 'sub')\r\n    } else {\r\n      return getElementChild(item, '.menu-sub')\r\n    }\r\n  }\r\n\r\n  private _getCss = (el: HTMLElement, styleProp: string) => {\r\n    const defaultView = (el.ownerDocument || document).defaultView\r\n    if (!defaultView) {\r\n      return ''\r\n    }\r\n\r\n    // sanitize property name to css notation\r\n    // (hyphen separated words eg. font-Size)\r\n    styleProp = styleProp.replace(/([A-Z])/g, '-$1').toLowerCase()\r\n\r\n    return defaultView.getComputedStyle(el, null).getPropertyValue(styleProp)\r\n  }\r\n\r\n  // Get item sub type\r\n  private _getItemSubType = (element: HTMLElement) => {\r\n    const sub = this._getItemSubElement(element)\r\n    if (sub && parseInt(this._getCss(sub, 'z-index')) > 0) {\r\n      return 'dropdown'\r\n    } else {\r\n      return 'accordion'\r\n    }\r\n  }\r\n\r\n  // Test if item's sub is shown\r\n  private _isItemSubShown = (item: HTMLElement) => {\r\n    let sub = this._getItemSubElement(item)\r\n    if (sub) {\r\n      if (this._getItemSubType(item) === 'dropdown') {\r\n        return sub.classList.contains('show') && sub.hasAttribute('data-popper-placement')\r\n      } else {\r\n        return item.classList.contains('show')\r\n      }\r\n    }\r\n\r\n    return false\r\n  }\r\n\r\n  // Test if item dropdown is permanent\r\n  private _isItemDropdownPermanent = (item: HTMLElement) => {\r\n    return this._getItemOption(item, 'permanent') === true\r\n  }\r\n\r\n  // Test if item's parent is shown\r\n  private _isItemParentShown = (item: HTMLElement) => {\r\n    return getElementParents(item, '.menu-item.show').length > 0\r\n  }\r\n\r\n  // Test of it is item sub element\r\n  private _isItemSubElement = (item: HTMLElement) => {\r\n    return item.classList.contains('menu-sub')\r\n  }\r\n\r\n  // Test if item has sub\r\n  private _hasItemSub = (item: HTMLElement) => {\r\n    return item.classList.contains('menu-item') && item.hasAttribute('data-kt-menu-trigger')\r\n  }\r\n\r\n  // Get link element\r\n  private _getItemLinkElement = (item: HTMLElement) => {\r\n    return getElementChild(item, '.menu-link')\r\n  }\r\n\r\n  // Get toggle element\r\n  private _getItemToggleElement = (item: HTMLElement) => {\r\n    if (this.triggerElement) {\r\n      return this.triggerElement\r\n    }\r\n\r\n    return this._getItemLinkElement(item)\r\n  }\r\n\r\n  // Show item dropdown\r\n  private _showDropdown = (item: HTMLElement) => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.menu.dropdown.show') === false) {\r\n      return\r\n    }\r\n\r\n    // Hide all currently shown dropdowns except current one\r\n    MenuComponent.hideDropdowns(item)\r\n\r\n    // const toggle = this._isTriggerElement(item) ? item : this._getItemLinkElement(item);\r\n    const sub = this._getItemSubElement(item)\r\n    const width = this._getItemOption(item, 'width')\r\n    const height = this._getItemOption(item, 'height')\r\n\r\n    let zindex = this.options.dropdown.zindex\r\n    const parentZindex = getHighestZindex(item) // update\r\n    // Apply a new z-index if dropdown's toggle element or it's parent has greater z-index // update\r\n    if (parentZindex !== null && parentZindex >= zindex) {\r\n      zindex = parentZindex + 1\r\n    }\r\n\r\n    if (zindex) {\r\n      ElementStyleUtil.set(sub, 'z-index', zindex)\r\n    }\r\n\r\n    if (width) {\r\n      ElementStyleUtil.set(sub, 'width', width)\r\n    }\r\n\r\n    if (height) {\r\n      ElementStyleUtil.set(sub, 'height', height)\r\n    }\r\n\r\n    this.initDropdownPopper(item, sub)\r\n\r\n    item.classList.add('show')\r\n    item.classList.add('menu-dropdown')\r\n    sub.classList.add('show')\r\n\r\n    // Append the sub the the root of the menu\r\n    if (this._getItemOption(item, 'overflow') === true) {\r\n      document.body.appendChild(sub)\r\n      DataUtil.set(item, 'sub', sub)\r\n      DataUtil.set(sub, 'item', item)\r\n      DataUtil.set(sub, 'menu', this)\r\n    } else {\r\n      DataUtil.set(sub, 'item', item)\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.menu.dropdown.shown')\r\n  }\r\n\r\n  // Init dropdown popper(new)\r\n  private initDropdownPopper = (item: HTMLElement, sub: HTMLElement) => {\r\n    // Setup popper instance\r\n    let reference\r\n    const attach = this._getItemOption(item, 'attach') as string\r\n\r\n    if (attach) {\r\n      if (attach === 'parent') {\r\n        reference = item.parentNode\r\n      } else {\r\n        reference = document.querySelector(attach)\r\n      }\r\n    } else {\r\n      reference = item\r\n    }\r\n\r\n    if (reference) {\r\n      const popper = createPopper(\r\n        reference as Element | VirtualElement,\r\n        sub,\r\n        this._getDropdownPopperConfig(item)\r\n      )\r\n      DataUtil.set(item, 'popper', popper)\r\n    }\r\n  }\r\n\r\n  // Hide item dropdown\r\n  private _hideDropdown = (item: HTMLElement) => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.menu.dropdown.hide') === false) {\r\n      return\r\n    }\r\n\r\n    const sub = this._getItemSubElement(item)\r\n    ElementStyleUtil.set(sub, 'z-index', '')\r\n    ElementStyleUtil.set(sub, 'width', '')\r\n    ElementStyleUtil.set(sub, 'height', '')\r\n    item.classList.remove('show')\r\n    item.classList.remove('menu-dropdown')\r\n    sub.classList.remove('show')\r\n\r\n    // Append the sub back to it's parent\r\n    if (this._getItemOption(item, 'overflow') === true) {\r\n      if (item.classList.contains('menu-item')) {\r\n        item.appendChild(sub)\r\n      } else {\r\n        insertAfterElement(this.element, item)\r\n      }\r\n\r\n      DataUtil.remove(item, 'sub')\r\n      DataUtil.remove(sub, 'item')\r\n      DataUtil.remove(sub, 'menu')\r\n    }\r\n\r\n    if (DataUtil.has(item, 'popper') === true) {\r\n      DataUtil.get(item, 'popper').destroy()\r\n      DataUtil.remove(item, 'popper')\r\n    }\r\n\r\n    // Destroy popper(new)\r\n    this.destroyDropdownPopper(item)\r\n    EventHandlerUtil.trigger(this.element, 'kt.menu.dropdown.hidden')\r\n  }\r\n\r\n  // Destroy dropdown popper(new)\r\n  private destroyDropdownPopper = (item: HTMLElement) => {\r\n    if (DataUtil.has(item, 'popper') === true) {\r\n      DataUtil.get(item, 'popper').destroy()\r\n      DataUtil.remove(item, 'popper')\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.menu.dropdown.hidden')\r\n  }\r\n\r\n  private _showAccordion = (item: HTMLElement) => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.menu.accordion.show') === false) {\r\n      return\r\n    }\r\n\r\n    if (this.options.accordion.expand === false) {\r\n      this._hideAccordions(item)\r\n    }\r\n\r\n    if (DataUtil.has(item, 'popper') === true) {\r\n      this._hideDropdown(item)\r\n    }\r\n\r\n    item.classList.add('hover') // updateWW\r\n    item.classList.add('showing')\r\n\r\n    const subElement = this._getItemSubElement(item)\r\n    if (subElement) {\r\n      const sub = subElement as HTMLElement\r\n      slideDown(sub, this.options.accordion.slideSpeed, () => {\r\n        item.classList.remove('showing')\r\n        item.classList.add('show')\r\n        sub.classList.add('show')\r\n        EventHandlerUtil.trigger(this.element, 'kt.menu.accordion.shown')\r\n      })\r\n    }\r\n  }\r\n\r\n  private _hideAccordion = (item: HTMLElement) => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.menu.accordion.hide') === false) {\r\n      return\r\n    }\r\n\r\n    const sub = this._getItemSubElement(item)\r\n    item.classList.add('hiding')\r\n\r\n    if (sub) {\r\n      slideUp(sub, this.options.accordion.slideSpeed, () => {\r\n        item.classList.remove('hiding')\r\n        item.classList.remove('show')\r\n        sub.classList.remove('show')\r\n        item.classList.remove('hover') // update\r\n        EventHandlerUtil.trigger(this.element, 'kt.menu.accordion.hidden')\r\n      })\r\n    }\r\n  }\r\n\r\n  // Hide all shown accordions of item\r\n  private _hideAccordions = (item: HTMLElement) => {\r\n    const itemsToHide = this.element.querySelectorAll('.show[data-kt-menu-trigger]')\r\n    if (itemsToHide && itemsToHide.length > 0) {\r\n      for (var i = 0, len = itemsToHide.length; i < len; i++) {\r\n        const itemToHide = itemsToHide[i] as HTMLElement\r\n\r\n        if (\r\n          this._getItemSubType(itemToHide) === 'accordion' &&\r\n          itemToHide !== item &&\r\n          item.contains(itemToHide) === false &&\r\n          itemToHide.contains(item) === false\r\n        ) {\r\n          this._hideAccordion(itemToHide)\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  // Event Handlers\r\n  // Reset item state classes if item sub type changed\r\n  private _reset = (item: HTMLElement) => {\r\n    if (this._hasItemSub(item) === false) {\r\n      return\r\n    }\r\n\r\n    const sub = this._getItemSubElement(item)\r\n\r\n    // Reset sub state if sub type is changed during the window resize\r\n    if (DataUtil.has(item, 'type') && DataUtil.get(item, 'type') !== this._getItemSubType(item)) {\r\n      // updated\r\n      item.classList.remove('hover')\r\n      item.classList.remove('show')\r\n      item.classList.remove('show')\r\n      if (sub && sub.removeClass) {\r\n        sub.removeClass(sub, 'show')\r\n      }\r\n    } // updated\r\n  }\r\n\r\n  // TODO: not done\r\n  private _destroy = () => {}\r\n\r\n  // Update all item state classes if item sub type changed\r\n  private _update = () => {\r\n    const items = this.element.querySelectorAll('.menu-item[data-kt-menu-trigger]')\r\n    items.forEach((el) => this._reset(el as HTMLElement))\r\n  }\r\n\r\n  // Hide item sub\r\n  private _hide = (item: HTMLElement) => {\r\n    if (!item) {\r\n      return\r\n    }\r\n\r\n    if (this._isItemSubShown(item) === false) {\r\n      return\r\n    }\r\n\r\n    if (this._getItemSubType(item) === 'dropdown') {\r\n      this._hideDropdown(item)\r\n    } else if (this._getItemSubType(item) === 'accordion') {\r\n      this._hideAccordion(item)\r\n    }\r\n  }\r\n\r\n  // Show item sub\r\n  private _show = (item: HTMLElement) => {\r\n    if (!item) {\r\n      return\r\n    }\r\n\r\n    if (this._isItemSubShown(item) === true) {\r\n      return\r\n    }\r\n\r\n    if (this._getItemSubType(item) === 'dropdown') {\r\n      this._showDropdown(item) // // show current dropdown\r\n    } else if (this._getItemSubType(item) === 'accordion') {\r\n      this._showAccordion(item)\r\n    }\r\n\r\n    // Remember last submenu type\r\n\r\n    DataUtil.set(item, 'type', this._getItemSubType(item)) // updated\r\n  }\r\n\r\n  // Toggle item sub\r\n  private _toggle = (item: HTMLElement) => {\r\n    if (!item) {\r\n      return\r\n    }\r\n\r\n    if (this._isItemSubShown(item) === true) {\r\n      this._hide(item)\r\n    } else {\r\n      this._show(item)\r\n    }\r\n  }\r\n\r\n  // Mouseout handle\r\n  private _mouseout = (element: HTMLElement, e: MouseEvent) => {\r\n    const item = this._getItemElement(element)\r\n    if (!item) {\r\n      return\r\n    }\r\n\r\n    if (this._getItemOption(item, 'trigger') !== 'hover') {\r\n      return\r\n    }\r\n\r\n    const timeout = setTimeout(() => {\r\n      if (DataUtil.get(item, 'hover') === '1') {\r\n        this._hide(item)\r\n      }\r\n    }, this.options.dropdown.hoverTimeout)\r\n\r\n    DataUtil.set(item, 'hover', '1')\r\n    DataUtil.set(item, 'timeout', timeout)\r\n  }\r\n\r\n  // Mouseover handle\r\n  private _mouseover = (element: HTMLElement, e: MouseEvent) => {\r\n    const item = this._getItemElement(element)\r\n    if (!item) {\r\n      return\r\n    }\r\n\r\n    if (this._getItemOption(item, 'trigger') !== 'hover') {\r\n      return\r\n    }\r\n\r\n    if (DataUtil.get(item, 'hover') === '1') {\r\n      clearTimeout(DataUtil.get(item, 'timeout'))\r\n      DataUtil.remove(item, 'hover')\r\n      DataUtil.remove(item, 'timeout')\r\n    }\r\n\r\n    this._show(item)\r\n  }\r\n\r\n  // Dismiss handler\r\n  private _dismiss = (element: HTMLElement, e: Event) => {\r\n    const item = this._getItemElement(element)\r\n    const items = this._getItemChildElements(item)\r\n    //if ( item !== null && _getItemOption(item, 'trigger') === 'click' &&  _getItemSubType(item) === 'dropdown' ) {\r\n    const itemSubType = this._getItemSubType(item)\r\n    if (item !== null && itemSubType === 'dropdown') {\r\n      this._hide(item) // hide items dropdown\r\n\r\n      // Hide all child elements as well\r\n      if (items.length > 0) {\r\n        for (let i = 0, len = items.length; i < len; i++) {\r\n          //if ( _getItemOption(item, 'trigger') === 'click' &&  _getItemSubType(item) === 'dropdown' ) {\r\n          if (items[i] !== null && this._getItemSubType(items[i] as HTMLElement) === 'dropdown') {\r\n            this._hide(items[i] as HTMLElement)\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  // Link handler\r\n  private _link = (element: HTMLElement, e: Event) => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.menu.link.click') === false) {\r\n      return\r\n    }\r\n\r\n    // Dismiss all shown dropdowns\r\n    MenuComponent.hideDropdowns(undefined)\r\n    EventHandlerUtil.trigger(this.element, 'kt.menu.link.clicked')\r\n  }\r\n\r\n  private _click = (element: HTMLElement, e: Event) => {\r\n    e.preventDefault()\r\n    const item = this._getItemElement(element)\r\n    if (this._getItemOption(item, 'trigger') !== 'click') {\r\n      return\r\n    }\r\n\r\n    if (this._getItemOption(item, 'toggle') === false) {\r\n      this._show(item)\r\n    } else {\r\n      this._toggle(item)\r\n    }\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  public click = (element: HTMLElement, e: Event) => {\r\n    return this._click(element, e)\r\n  }\r\n\r\n  public link = (element: HTMLElement, e: Event) => {\r\n    return this._link(element, e)\r\n  }\r\n\r\n  public dismiss = (element: HTMLElement, e: Event) => {\r\n    return this._dismiss(element, e)\r\n  }\r\n\r\n  public mouseover = (element: HTMLElement, e: Event) => {\r\n    return this._mouseover(element, e as MouseEvent)\r\n  }\r\n\r\n  public mouseout = (element: HTMLElement, e: Event) => {\r\n    return this._mouseout(element, e as MouseEvent)\r\n  }\r\n\r\n  // General Methods\r\n  public getItemTriggerType = (item: HTMLElement) => {\r\n    return this._getItemOption(item, 'trigger')\r\n  }\r\n\r\n  public getItemSubType = (element: HTMLElement) => {\r\n    return this._getItemSubType(element)\r\n  }\r\n\r\n  public show = (item: HTMLElement) => {\r\n    return this._show(item)\r\n  }\r\n\r\n  public hide = (item: HTMLElement) => {\r\n    return this._hide(item)\r\n  }\r\n\r\n  public reset = (item: HTMLElement) => {\r\n    return this._reset(item)\r\n  }\r\n\r\n  public update = () => {\r\n    return this._update()\r\n  }\r\n\r\n  public getElement = () => {\r\n    return this.element\r\n  }\r\n\r\n  public getItemLinkElement = (item: HTMLElement) => {\r\n    return this._getItemLinkElement(item)\r\n  }\r\n\r\n  public getItemToggleElement = (item: HTMLElement) => {\r\n    return this._getItemToggleElement(item)\r\n  }\r\n\r\n  public getItemSubElement = (item: HTMLElement) => {\r\n    return this._getItemSubElement(item)\r\n  }\r\n\r\n  public getItemParentElements = (item: HTMLElement) => {\r\n    return this._getItemParentElements(item)\r\n  }\r\n\r\n  public isItemSubShown = (item: HTMLElement) => {\r\n    return this._isItemSubShown(item)\r\n  }\r\n\r\n  public isItemParentShown = (item: HTMLElement) => {\r\n    return this._isItemParentShown(item)\r\n  }\r\n\r\n  public getTriggerElement = () => {\r\n    return this.triggerElement\r\n  }\r\n\r\n  public isItemDropdownPermanent = (item: HTMLElement) => {\r\n    return this._isItemDropdownPermanent(item)\r\n  }\r\n\r\n  // Accordion Mode Methods\r\n  public hideAccordions = (item: HTMLElement) => {\r\n    return this._hideAccordions(item)\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: any) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: any) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  // public static methods\r\n  // Get KTMenu instance by element\r\n  public static getInstance = (element: HTMLElement) => {\r\n    // Element has menu DOM reference in it's DATA storage\r\n    const elementMenu = DataUtil.get(element, 'menu')\r\n    if (elementMenu) {\r\n      return elementMenu\r\n    }\r\n\r\n    // Element has .menu parent\r\n    const menu = element.closest('.menu')\r\n    if (menu) {\r\n      const menuData = DataUtil.get(menu as HTMLElement, 'menu')\r\n      if (menuData) {\r\n        return menuData\r\n      }\r\n    }\r\n\r\n    // Element has a parent with DOM reference to .menu in it's DATA storage\r\n    if (element.classList.contains('menu-link')) {\r\n      const sub = element.closest('.menu-sub')\r\n      if (sub) {\r\n        const subMenu = DataUtil.get(sub as HTMLElement, 'menu')\r\n        if (subMenu) {\r\n          return subMenu\r\n        }\r\n      }\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  // Hide all dropdowns and skip one if provided\r\n  public static hideDropdowns = (skip: HTMLElement | undefined) => {\r\n    const items = document.querySelectorAll('.show.menu-dropdown[data-kt-menu-trigger]')\r\n\r\n    if (items && items.length > 0) {\r\n      for (let i = 0, len = items.length; i < len; i++) {\r\n        const item = items[i]\r\n        const menu = MenuComponent.getInstance(item as HTMLElement)\r\n\r\n        if (menu && menu.getItemSubType(item) === 'dropdown') {\r\n          if (skip) {\r\n            if (\r\n              menu.getItemSubElement(item).contains(skip) === false &&\r\n              item.contains(skip) === false &&\r\n              item !== skip\r\n            ) {\r\n              menu.hide(item)\r\n            }\r\n          } else {\r\n            menu.hide(item)\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  public static updateDropdowns = () => {\r\n    const items = document.querySelectorAll('.show.menu-dropdown[data-kt-menu-trigger]')\r\n    if (items && items.length > 0) {\r\n      for (var i = 0, len = items.length; i < len; i++) {\r\n        var item = items[i]\r\n\r\n        if (DataUtil.has(item as HTMLElement, 'popper')) {\r\n          DataUtil.get(item as HTMLElement, 'popper').forceUpdate()\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  // Global handlers\r\n  public static createInstances = (selector: string) => {\r\n    // Initialize menus\r\n    document.querySelectorAll(selector).forEach((el) => {\r\n      const menuItem = el as HTMLElement\r\n      let menuInstance = MenuComponent.getInstance(menuItem)\r\n      if (!menuInstance) {\r\n        menuInstance = new MenuComponent(el as HTMLElement, defaultMenuOptions)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static initGlobalHandlers = () => {\r\n    // Dropdown handler\r\n    document.addEventListener('click', (e) => {\r\n      const menuItems = document.querySelectorAll('.show.menu-dropdown[data-kt-menu-trigger]')\r\n      if (menuItems && menuItems.length > 0) {\r\n        for (let i = 0; i < menuItems.length; i++) {\r\n          const item = menuItems[i] as HTMLElement\r\n          const menuObj = MenuComponent.getInstance(item) as MenuComponent\r\n          if (menuObj && menuObj.getItemSubType(item) === 'dropdown') {\r\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n            const menu = menuObj.getElement()\r\n            const sub = menuObj.getItemSubElement(item) as HTMLElement\r\n            if (item === e.target || item.contains(e.target as HTMLElement)) {\r\n              continue\r\n            }\r\n\r\n            if (sub && (sub === e.target || sub.contains(e.target as HTMLElement))) {\r\n              continue\r\n            }\r\n            menuObj.hide(item)\r\n          }\r\n        }\r\n      }\r\n    })\r\n\r\n    // Sub toggle handler\r\n    DOMEventHandlerUtil.on(\r\n      document.body,\r\n      '.menu-item[data-kt-menu-trigger] > .menu-link, [data-kt-menu-trigger]:not(.menu-item):not([data-kt-menu-trigger=\"auto\"])',\r\n      'click',\r\n      function (this: HTMLElement, e: Event) {\r\n        const menu = MenuComponent.getInstance(this) as MenuComponent\r\n        if (menu) {\r\n          return menu.click(this, e)\r\n        }\r\n      }\r\n    )\r\n\r\n    // // Link handler\r\n    DOMEventHandlerUtil.on(\r\n      document.body,\r\n      '.menu-item:not([data-kt-menu-trigger]) > .menu-link',\r\n      'click',\r\n      function (this: HTMLElement, e: Event) {\r\n        e.stopPropagation()\r\n        const menu = MenuComponent.getInstance(this)\r\n        if (menu && menu.link) {\r\n          return menu.link(this, e)\r\n        }\r\n      }\r\n    )\r\n\r\n    // Dismiss handler\r\n    DOMEventHandlerUtil.on(\r\n      document.body,\r\n      '[data-kt-menu-dismiss=\"true\"]',\r\n      'click',\r\n      function (this: HTMLElement, e: Event) {\r\n        const menu = MenuComponent.getInstance(this) as MenuComponent\r\n        if (menu) {\r\n          return menu.dismiss(this, e)\r\n        }\r\n      }\r\n    )\r\n\r\n    // Mouseover handler\r\n    DOMEventHandlerUtil.on(\r\n      document.body,\r\n      '[data-kt-menu-trigger], .menu-sub',\r\n      'mouseover',\r\n      function (this: HTMLElement, e: Event) {\r\n        const menu = MenuComponent.getInstance(this) as MenuComponent\r\n        if (menu && menu.getItemSubType(this) === 'dropdown') {\r\n          return menu.mouseover(this, e)\r\n        }\r\n      }\r\n    )\r\n\r\n    // Mouseout handler\r\n    DOMEventHandlerUtil.on(\r\n      document.body,\r\n      '[data-kt-menu-trigger], .menu-sub',\r\n      'mouseout',\r\n      function (this: HTMLElement, e: Event) {\r\n        const menu = MenuComponent.getInstance(this) as MenuComponent\r\n        if (menu && menu.getItemSubType(this) === 'dropdown') {\r\n          return menu.mouseout(this, e)\r\n        }\r\n      }\r\n    )\r\n\r\n    // Resize handler\r\n    window.addEventListener('resize', () => {\r\n      let timer\r\n      throttle(\r\n        timer,\r\n        () => {\r\n          // Locate and update Drawer instances on window resize\r\n          const elements = document.querySelectorAll('[data-kt-menu=\"true\"]')\r\n          elements.forEach((el) => {\r\n            const menu = MenuComponent.getInstance(el as HTMLElement)\r\n            if (menu) {\r\n              menu.update()\r\n            }\r\n          })\r\n        },\r\n        200\r\n      )\r\n    })\r\n  }\r\n\r\n  public static bootstrap = () => {\r\n    MenuComponent.initGlobalHandlers()\r\n    MenuComponent.createInstances('[data-kt-menu=\"true\"]')\r\n  }\r\n\r\n  public static reinitialization = () => {\r\n    MenuComponent.createInstances('[data-kt-menu=\"true\"]')\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string,\r\n    options: MenuOptions = defaultMenuOptions\r\n  ): MenuComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let menu = MenuComponent.getInstance(item)\r\n    if (!menu) {\r\n      menu = new MenuComponent(item, options)\r\n    }\r\n    return menu\r\n  }\r\n}\r\n\r\nexport {MenuComponent, defaultMenuOptions}\r\n","import {\r\n  EventHandlerUtil,\r\n  DataUtil,\r\n  getBreakpoint,\r\n  getAttributeValueByBreakpoint,\r\n  stringSnakeToCamel,\r\n  getObjectPropertyValueByKey,\r\n  getViewPort,\r\n  isVisibleElement,\r\n  throttle,\r\n} from '../_utils/index'\r\n\r\nimport {MenuComponent, defaultMenuOptions} from './MenuComponent'\r\n\r\nexport interface ISearchOptions {\r\n  minLength: number // Miniam text lenght to query search\r\n  keypress: boolean // Enable search on keypress\r\n  enter: boolean // Enable search on enter key press\r\n  layout: 'menu' | 'inline' // Use 'menu' or 'inline' layout options to display search results\r\n  responsive?: number // Pass integer value or bootstrap compatible breakpoint key(sm,md,lg,xl,xxl) to enable reponsive form mode for device width below the breakpoint value\r\n  showOnFocus: boolean // Always show menu on input focus\r\n}\r\n\r\nexport interface ISearchQueries {\r\n  componentName: string\r\n  instanseQuery: string\r\n  attrQuery: string\r\n}\r\n\r\nconst defaultSearchOptions: ISearchOptions = {\r\n  minLength: 2, // Miniam text lenght to query search\r\n  keypress: true, // Enable search on keypress\r\n  enter: true, // Enable search on enter key press\r\n  layout: 'menu', // Use 'menu' or 'inline' layout options to display search results\r\n  showOnFocus: true, // Always show menu on input focus\r\n}\r\n\r\nconst defaultSearchQueires: ISearchQueries = {\r\n  componentName: 'search',\r\n  instanseQuery: '[data-kt-search]',\r\n  attrQuery: 'data-kt-search-',\r\n}\r\n\r\nclass SearchComponent {\r\n  element: HTMLElement\r\n  contentElement: HTMLElement\r\n  formElement: HTMLFormElement\r\n  inputElement: HTMLInputElement\r\n  spinnerElement: HTMLElement\r\n  clearElement: HTMLElement\r\n  toggleElement: HTMLElement\r\n  submitElement: HTMLElement\r\n  toolbarElement: HTMLElement\r\n  resultsElement: HTMLElement\r\n  suggestionElement: HTMLElement\r\n  emptyElement: HTMLElement\r\n  layout: any\r\n\r\n  options: ISearchOptions\r\n  queries: ISearchQueries\r\n\r\n  processing: boolean = false\r\n  menuObject: MenuComponent | undefined\r\n\r\n  constructor(_element: HTMLElement, _options: ISearchOptions, _queries: ISearchQueries) {\r\n    // Variables\r\n    this.options = Object.assign(defaultSearchOptions, _options)\r\n    this.queries = _queries\r\n\r\n    // Elements\r\n    this.element = _element\r\n    this.contentElement = this._getElement('content') as HTMLElement\r\n    this.formElement = this._getElement('form') as HTMLFormElement\r\n    this.inputElement = this._getElement('input') as HTMLInputElement\r\n    this.spinnerElement = this._getElement('spinner') as HTMLElement\r\n    this.clearElement = this._getElement('clear') as HTMLElement\r\n    this.toggleElement = this._getElement('toggle') as HTMLElement\r\n    this.submitElement = this._getElement('submit') as HTMLElement\r\n    this.toolbarElement = this._getElement('toolbar') as HTMLElement\r\n\r\n    this.resultsElement = this._getElement('results') as HTMLElement\r\n    this.suggestionElement = this._getElement('suggestion') as HTMLElement\r\n    this.emptyElement = this._getElement('empty') as HTMLElement\r\n\r\n    // Layout\r\n    this.layout = this.getOption('layout')\r\n    if (this.layout === 'menu') {\r\n      this.menuObject = new MenuComponent(this.contentElement, defaultMenuOptions)\r\n    }\r\n\r\n    // Update\r\n    this.update()\r\n\r\n    // Event Handlers\r\n    this.handlers()\r\n\r\n    DataUtil.set(this.element, this.queries.componentName, this)\r\n  }\r\n\r\n  private _getElement = (name: string) => {\r\n    return this.element.querySelector('[data-kt-search-element=\"' + name + '\"]')\r\n  }\r\n\r\n  // Get option\r\n  private getOption = (name: string) => {\r\n    const attr = this.element.getAttribute(`${this.queries.attrQuery}${name}`)\r\n    if (attr) {\r\n      let value = getAttributeValueByBreakpoint(attr)\r\n\r\n      if (value !== null && String(value) === 'true') {\r\n        return true\r\n      } else if (value !== null && String(value) === 'false') {\r\n        return false\r\n      }\r\n\r\n      return value\r\n    } else {\r\n      const optionName = stringSnakeToCamel(name)\r\n\r\n      const option = getObjectPropertyValueByKey(this.options, optionName)\r\n      if (option) {\r\n        return getAttributeValueByBreakpoint(option)\r\n      } else {\r\n        return null\r\n      }\r\n    }\r\n  }\r\n\r\n  // Check if responsive form mode is enabled\r\n  private getResponsiveFormMode = () => {\r\n    const responsive = this.getOption('responsive') as string\r\n    const width = getViewPort().width\r\n\r\n    if (!responsive) {\r\n      return null\r\n    }\r\n\r\n    const breakpoint = getBreakpoint(responsive)\r\n    let breakPointNum = -1\r\n    if (!breakpoint) {\r\n      breakPointNum = parseInt(responsive)\r\n    } else {\r\n      breakPointNum = +breakpoint\r\n    }\r\n\r\n    if (width < breakPointNum) {\r\n      return 'on'\r\n    } else {\r\n      return 'off'\r\n    }\r\n  }\r\n\r\n  // Focus\r\n  private focus = () => {\r\n    this.element.classList.add('focus')\r\n\r\n    if (\r\n      this.getOption('show-on-focus') === true ||\r\n      this.inputElement.value.length >= this.options.minLength\r\n    ) {\r\n      this.show()\r\n    }\r\n  }\r\n\r\n  // Blur\r\n  private blur = () => {\r\n    this.element.classList.remove('focus')\r\n  }\r\n\r\n  // Enter\r\n  private enter = (e: KeyboardEvent) => {\r\n    const key = e.charCode || e.keyCode || 0\r\n\r\n    if (key === 13) {\r\n      e.preventDefault()\r\n\r\n      this.search()\r\n    }\r\n  }\r\n\r\n  // Input\r\n  private input = () => {\r\n    if (this.getOption('min-length')) {\r\n      const minLength = parseInt(this.getOption('min-length') as string)\r\n\r\n      if (this.inputElement.value.length >= minLength) {\r\n        this.search()\r\n      } else if (this.inputElement.value.length === 0) {\r\n        this.clear()\r\n      }\r\n    }\r\n  }\r\n\r\n  private handlers(): void {\r\n    const context = this;\r\n\r\n    // Focus\r\n    this.inputElement.addEventListener('focus', this.focus)\r\n\r\n    // Blur\r\n    this.inputElement.addEventListener('blur', this.blur)\r\n\r\n    // Keypress\r\n    if (this.getOption('keypress') === true) {\r\n      this.inputElement.addEventListener('input', this.input)\r\n    }\r\n\r\n    // Submit\r\n    if (this.submitElement) {\r\n      this.submitElement.addEventListener('click', this.search)\r\n    }\r\n\r\n    // Enter\r\n    if (this.getOption('enter') === true) {\r\n      this.inputElement.addEventListener('keypress', this.enter)\r\n    }\r\n\r\n    // Clear\r\n    if (this.clearElement) {\r\n      this.clearElement.addEventListener('click', this.clear)\r\n    }\r\n\r\n    // Menu\r\n    if (this.menuObject) {\r\n      // Toggle menu\r\n      if (this.toggleElement) {\r\n        this.toggleElement.addEventListener('click', this.show)\r\n\r\n        this.menuObject.on('kt.menu.dropdown.show', function () {\r\n          // @ts-ignore\r\n          if (isVisibleElement(context.toggleElement)) {\r\n            // @ts-ignore\r\n            context.toggleElement.classList.add('active')\r\n            // @ts-ignore\r\n            context.toggleElement.classList.add('show')\r\n          }\r\n        })\r\n\r\n        this.menuObject.on('kt.menu.dropdown.hide', function () {\r\n          // @ts-ignore\r\n          if (isVisibleElement(context.toggleElement)) {\r\n            // @ts-ignore\r\n            context.toggleElement.classList.remove('active')\r\n            // @ts-ignore\r\n            context.toggleElement.classList.remove('show')\r\n          }\r\n        })\r\n      }\r\n\r\n      this.menuObject.on('kt.menu.dropdown.shown', function () {\r\n        // @ts-ignore\r\n        context.inputElement.focus()\r\n      })\r\n    }\r\n\r\n    // Window resize handling\r\n    window.addEventListener('resize', () => {\r\n      let timer\r\n\r\n      throttle(\r\n          timer,\r\n          () => {\r\n            this.update()\r\n          },\r\n          200\r\n      )\r\n    })\r\n  }\r\n\r\n  ///////////////////////\r\n  // ** Public API  ** //\r\n  ///////////////////////\r\n  // Update\r\n  public update = () => {\r\n    // Handle responsive form\r\n    if (this.layout === 'menu') {\r\n      let responsiveFormMode = this.getResponsiveFormMode()\r\n\r\n      if (responsiveFormMode === 'on' && !this.contentElement.contains(this.formElement)) {\r\n        this.contentElement.prepend(this.formElement)\r\n        this.formElement.classList.remove('d-none')\r\n      } else if (\r\n          responsiveFormMode === 'off' &&\r\n          this.contentElement.contains(this.formElement)\r\n      ) {\r\n        this.element.prepend(this.formElement)\r\n        this.formElement.classList.add('d-none')\r\n      }\r\n    }\r\n  }\r\n\r\n  // Show menu\r\n  public show = () => {\r\n    if (this.menuObject) {\r\n      this.update()\r\n\r\n      this.menuObject.show(this.element)\r\n    }\r\n  }\r\n\r\n  // Hide menu\r\n  public hide = () => {\r\n    if (this.menuObject) {\r\n      this.update()\r\n\r\n      this.menuObject.hide(this.element)\r\n    }\r\n  }\r\n\r\n  // Search\r\n  public search = () => {\r\n    if (!this.processing) {\r\n      // Show search spinner\r\n      if (this.spinnerElement) {\r\n        this.spinnerElement.classList.remove('d-none')\r\n      }\r\n\r\n      // Hide search clear button\r\n      if (this.clearElement) {\r\n        this.clearElement.classList.add('d-none')\r\n      }\r\n\r\n      // Hide search toolbar\r\n      if (this.toolbarElement) {\r\n        this.toolbarElement.classList.add('d-none')\r\n      }\r\n\r\n      // Focus input\r\n      this.inputElement.focus()\r\n\r\n      this.processing = true\r\n      EventHandlerUtil.trigger(this.element, 'kt.search.process', this);\r\n    }\r\n  }\r\n\r\n  // Complete\r\n  public complete = () => {\r\n    if (this.spinnerElement) {\r\n      this.spinnerElement.classList.add('d-none')\r\n    }\r\n\r\n    // Show search toolbar\r\n    if (this.clearElement) {\r\n      this.clearElement.classList.remove('d-none')\r\n    }\r\n\r\n    if (this.inputElement.value.length === 0) {\r\n      this.clear()\r\n    }\r\n\r\n    // Focus input\r\n    this.inputElement.focus()\r\n\r\n    this.show()\r\n\r\n    this.processing = false\r\n  }\r\n\r\n  // Clear\r\n  public clear = () => {\r\n    if (EventHandlerUtil.trigger(this.element, 'kt.search.clear') === false) {\r\n      return\r\n    }\r\n\r\n    // Clear and focus input\r\n    this.inputElement.value = ''\r\n    this.inputElement.focus()\r\n\r\n    // Hide clear icon\r\n    if (this.clearElement) {\r\n      this.clearElement.classList.add('d-none')\r\n    }\r\n\r\n    // Show search toolbar\r\n    if (this.toolbarElement) {\r\n      this.toolbarElement.classList.remove('d-none')\r\n    }\r\n\r\n    // Hide menu\r\n    if (this.getOption('show-on-focus') === false) {\r\n      this.hide()\r\n    }\r\n\r\n    EventHandlerUtil.trigger(this.element, 'kt.search.cleared')\r\n  }\r\n\r\n  public isProcessing = () => {\r\n    return this.processing\r\n  }\r\n\r\n  public getQuery = () => {\r\n    return this.inputElement.value\r\n  }\r\n\r\n  public getMenu = () => {\r\n    return this.menuObject\r\n  }\r\n\r\n  public getFormElement = () => {\r\n    return this.formElement\r\n  }\r\n\r\n  public getInputElement(): HTMLInputElement {\r\n    return this.inputElement\r\n  }\r\n\r\n  public getContentElement(): HTMLElement {\r\n    return this.contentElement\r\n  }\r\n\r\n  public getElement(): HTMLElement {\r\n    return this.element\r\n  }\r\n\r\n  // Event API\r\n  public on = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.on(this.element, name, handler)\r\n  }\r\n\r\n  public one = (name: string, handler: Function) => {\r\n    return EventHandlerUtil.one(this.element, name, handler)\r\n  }\r\n\r\n  public off = (name: string) => {\r\n    return EventHandlerUtil.off(this.element, name)\r\n  }\r\n\r\n  // Static methods\r\n  public static getInstance = (\r\n    el: HTMLElement,\r\n    componentName: string = defaultSearchQueires.componentName\r\n  ) => {\r\n    const Search = DataUtil.get(el, componentName)\r\n    if (Search) {\r\n      return Search\r\n    }\r\n\r\n    return null\r\n  }\r\n\r\n  public static createInstances = (\r\n    selector: string = defaultSearchQueires.instanseQuery,\r\n    options: ISearchOptions = defaultSearchOptions,\r\n    queries: ISearchQueries = defaultSearchQueires\r\n  ) => {\r\n    const elements = document.body.querySelectorAll(selector)\r\n    elements.forEach((el) => {\r\n      const item = el as HTMLElement\r\n      let Search = SearchComponent.getInstance(item)\r\n      if (!Search) {\r\n        Search = new SearchComponent(item, options, queries)\r\n      }\r\n    })\r\n  }\r\n\r\n  public static createInsance = (\r\n    selector: string = defaultSearchQueires.instanseQuery,\r\n    options: ISearchOptions = defaultSearchOptions,\r\n    queries: ISearchQueries = defaultSearchQueires\r\n  ): SearchComponent | undefined => {\r\n    const element = document.body.querySelector(selector)\r\n    if (!element) {\r\n      return\r\n    }\r\n    const item = element as HTMLElement\r\n    let Search = SearchComponent.getInstance(item)\r\n    if (!Search) {\r\n      Search = new SearchComponent(item, options, queries)\r\n    }\r\n    return Search\r\n  }\r\n\r\n  public static bootstrap = (selector: string = defaultSearchQueires.instanseQuery) => {\r\n    SearchComponent.createInstances(selector)\r\n  }\r\n\r\n  public static reinitialization = (selector: string = defaultSearchQueires.instanseQuery) => {\r\n    SearchComponent.createInstances(selector)\r\n  }\r\n}\r\nexport {SearchComponent, defaultSearchOptions, defaultSearchQueires}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, {useState} from 'react'\r\nimport {useDispatch} from 'react-redux'\r\nimport {useFormik} from 'formik'\r\nimport * as Yup from 'yup'\r\nimport clsx from 'clsx'\r\nimport * as auth from '../redux/AuthRedux'\r\nimport {register} from '../redux/AuthCRUD'\r\nimport {Link} from 'react-router-dom'\r\nimport {toAbsoluteUrl} from '../../../../_metronic/helpers'\r\n\r\nconst initialValues = {\r\n  firstname: '',\r\n  lastname: '',\r\n  email: '',\r\n  password: '',\r\n  changepassword: '',\r\n  acceptTerms: false,\r\n}\r\n\r\nconst registrationSchema = Yup.object().shape({\r\n  firstname: Yup.string()\r\n    .min(3, 'Minimum 3 symbols')\r\n    .max(50, 'Maximum 50 symbols')\r\n    .required('First name is required'),\r\n  email: Yup.string()\r\n    .email('Wrong email format')\r\n    .min(3, 'Minimum 3 symbols')\r\n    .max(50, 'Maximum 50 symbols')\r\n    .required('Email is required'),\r\n  lastname: Yup.string()\r\n    .min(3, 'Minimum 3 symbols')\r\n    .max(50, 'Maximum 50 symbols')\r\n    .required('Last name is required'),\r\n  password: Yup.string()\r\n    .min(3, 'Minimum 3 symbols')\r\n    .max(50, 'Maximum 50 symbols')\r\n    .required('Password is required'),\r\n  changepassword: Yup.string()\r\n    .required('Password confirmation is required')\r\n    .when('password', {\r\n      is: (val: string) => (val && val.length > 0 ? true : false),\r\n      then: Yup.string().oneOf([Yup.ref('password')], \"Password and Confirm Password didn't match\"),\r\n    }),\r\n  acceptTerms: Yup.bool().required('You must accept the terms and conditions'),\r\n})\r\n\r\nexport function Registration() {\r\n  const [loading, setLoading] = useState(false)\r\n  const dispatch = useDispatch()\r\n  const formik = useFormik({\r\n    initialValues,\r\n    validationSchema: registrationSchema,\r\n    onSubmit: (values, {setStatus, setSubmitting}) => {\r\n      setLoading(true)\r\n      setTimeout(() => {\r\n        register(values.email, values.firstname, values.lastname, values.password)\r\n          .then(({data: {accessToken}}) => {\r\n            setLoading(false)\r\n            dispatch(auth.actions.login(accessToken))\r\n          })\r\n          .catch(() => {\r\n            setLoading(false)\r\n            setSubmitting(false)\r\n            setStatus('Registration process has broken')\r\n          })\r\n      }, 1000)\r\n    },\r\n  })\r\n\r\n  return (\r\n    <form\r\n      className='form w-100 fv-plugins-bootstrap5 fv-plugins-framework'\r\n      noValidate\r\n      id='kt_login_signup_form'\r\n      onSubmit={formik.handleSubmit}\r\n    >\r\n      {/* begin::Heading */}\r\n      <div className='mb-10 text-center'>\r\n        {/* begin::Title */}\r\n        <h1 className='text-dark mb-3'>Create an Account</h1>\r\n        {/* end::Title */}\r\n\r\n        {/* begin::Link */}\r\n        <div className='text-gray-400 fw-bold fs-4'>\r\n          Already have an account?\r\n          <Link to='/auth/login' className='link-primary fw-bolder' style={{marginLeft: '5px'}}>\r\n            Forgot Password ?\r\n          </Link>\r\n        </div>\r\n        {/* end::Link */}\r\n      </div>\r\n      {/* end::Heading */}\r\n\r\n      {/* begin::Action */}\r\n      <button type='button' className='btn btn-light-primary fw-bolder w-100 mb-10'>\r\n        <img\r\n          alt='Logo'\r\n          src={toAbsoluteUrl('/media/svg/brand-logos/google-icon.svg')}\r\n          className='h-20px me-3'\r\n        />\r\n        Sign in with Google\r\n      </button>\r\n      {/* end::Action */}\r\n\r\n      <div className='d-flex align-items-center mb-10'>\r\n        <div className='border-bottom border-gray-300 mw-50 w-100'></div>\r\n        <span className='fw-bold text-gray-400 fs-7 mx-2'>OR</span>\r\n        <div className='border-bottom border-gray-300 mw-50 w-100'></div>\r\n      </div>\r\n\r\n      {formik.status && (\r\n        <div className='mb-lg-15 alert alert-danger'>\r\n          <div className='alert-text font-weight-bold'>{formik.status}</div>\r\n        </div>\r\n      )}\r\n\r\n      {/* begin::Form group Firstname */}\r\n      <div className='row fv-row mb-7'>\r\n        <div className='col-xl-6'>\r\n          <label className='class=\"form-label fw-bolder text-dark fs-6'>First name</label>\r\n          <input\r\n            placeholder='First name'\r\n            type='text'\r\n            autoComplete='off'\r\n            {...formik.getFieldProps('firstname')}\r\n            className={clsx(\r\n              'form-control form-control-lg form-control-solid',\r\n              {\r\n                'is-invalid': formik.touched.firstname && formik.errors.firstname,\r\n              },\r\n              {\r\n                'is-valid': formik.touched.firstname && !formik.errors.firstname,\r\n              }\r\n            )}\r\n          />\r\n          {formik.touched.firstname && formik.errors.firstname && (\r\n            <div className='fv-plugins-message-container'>\r\n              <div className='fv-help-block'>\r\n                <span role='alert'>{formik.errors.firstname}</span>\r\n              </div>\r\n            </div>\r\n          )}\r\n        </div>\r\n        <div className='col-xl-6'>\r\n          {/* begin::Form group Lastname */}\r\n          <div className='fv-row mb-5'>\r\n            <label className='form-label fw-bolder text-dark fs-6'>Last name</label>\r\n            <input\r\n              placeholder='Last name'\r\n              type='text'\r\n              autoComplete='off'\r\n              {...formik.getFieldProps('lastname')}\r\n              className={clsx(\r\n                'form-control form-control-lg form-control-solid',\r\n                {\r\n                  'is-invalid': formik.touched.lastname && formik.errors.lastname,\r\n                },\r\n                {\r\n                  'is-valid': formik.touched.lastname && !formik.errors.lastname,\r\n                }\r\n              )}\r\n            />\r\n            {formik.touched.lastname && formik.errors.lastname && (\r\n              <div className='fv-plugins-message-container'>\r\n                <div className='fv-help-block'>\r\n                  <span role='alert'>{formik.errors.lastname}</span>\r\n                </div>\r\n              </div>\r\n            )}\r\n          </div>\r\n          {/* end::Form group */}\r\n        </div>\r\n      </div>\r\n      {/* end::Form group */}\r\n\r\n      {/* begin::Form group Email */}\r\n      <div className='fv-row mb-7'>\r\n        <label className='form-label fw-bolder text-dark fs-6'>Email</label>\r\n        <input\r\n          placeholder='Email'\r\n          type='email'\r\n          autoComplete='off'\r\n          {...formik.getFieldProps('email')}\r\n          className={clsx(\r\n            'form-control form-control-lg form-control-solid',\r\n            {'is-invalid': formik.touched.email && formik.errors.email},\r\n            {\r\n              'is-valid': formik.touched.email && !formik.errors.email,\r\n            }\r\n          )}\r\n        />\r\n        {formik.touched.email && formik.errors.email && (\r\n          <div className='fv-plugins-message-container'>\r\n            <div className='fv-help-block'>\r\n              <span role='alert'>{formik.errors.email}</span>\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n      {/* end::Form group */}\r\n\r\n      {/* begin::Form group Password */}\r\n      <div className='mb-10 fv-row' data-kt-password-meter='true'>\r\n        <div className='mb-1'>\r\n          <label className='form-label fw-bolder text-dark fs-6'>Password</label>\r\n          <div className='position-relative mb-3'>\r\n            <input\r\n              type='password'\r\n              placeholder='Password'\r\n              autoComplete='off'\r\n              {...formik.getFieldProps('password')}\r\n              className={clsx(\r\n                'form-control form-control-lg form-control-solid',\r\n                {\r\n                  'is-invalid': formik.touched.password && formik.errors.password,\r\n                },\r\n                {\r\n                  'is-valid': formik.touched.password && !formik.errors.password,\r\n                }\r\n              )}\r\n            />\r\n            {formik.touched.password && formik.errors.password && (\r\n              <div className='fv-plugins-message-container'>\r\n                <div className='fv-help-block'>\r\n                  <span role='alert'>{formik.errors.password}</span>\r\n                </div>\r\n              </div>\r\n            )}\r\n          </div>\r\n        </div>\r\n      </div>\r\n      {/* end::Form group */}\r\n\r\n      {/* begin::Form group Confirm password */}\r\n      <div className='fv-row mb-5'>\r\n        <label className='form-label fw-bolder text-dark fs-6'>Confirm Password</label>\r\n        <input\r\n          type='password'\r\n          placeholder='Password confirmation'\r\n          autoComplete='off'\r\n          {...formik.getFieldProps('changepassword')}\r\n          className={clsx(\r\n            'form-control form-control-lg form-control-solid',\r\n            {\r\n              'is-invalid': formik.touched.changepassword && formik.errors.changepassword,\r\n            },\r\n            {\r\n              'is-valid': formik.touched.changepassword && !formik.errors.changepassword,\r\n            }\r\n          )}\r\n        />\r\n        {formik.touched.changepassword && formik.errors.changepassword && (\r\n          <div className='fv-plugins-message-container'>\r\n            <div className='fv-help-block'>\r\n              <span role='alert'>{formik.errors.changepassword}</span>\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n      {/* end::Form group */}\r\n\r\n      {/* begin::Form group */}\r\n      <div className='fv-row mb-10'>\r\n        <div className='form-check form-check-custom form-check-solid'>\r\n          <input\r\n            className='form-check-input'\r\n            type='checkbox'\r\n            id='kt_login_toc_agree'\r\n            {...formik.getFieldProps('acceptTerms')}\r\n          />\r\n          <label\r\n            className='form-check-label fw-bold text-gray-700 fs-6'\r\n            htmlFor='kt_login_toc_agree'\r\n          >\r\n            I Agree the{' '}\r\n            <Link to='/auth/terms' className='ms-1 link-primary'>\r\n              terms and conditions\r\n            </Link>\r\n            .\r\n          </label>\r\n          {formik.touched.acceptTerms && formik.errors.acceptTerms && (\r\n            <div className='fv-plugins-message-container'>\r\n              <div className='fv-help-block'>\r\n                <span role='alert'>{formik.errors.acceptTerms}</span>\r\n              </div>\r\n            </div>\r\n          )}\r\n        </div>\r\n      </div>\r\n      {/* end::Form group */}\r\n\r\n      {/* begin::Form group */}\r\n      <div className='text-center'>\r\n        <button\r\n          type='submit'\r\n          id='kt_sign_up_submit'\r\n          className='btn btn-lg btn-primary w-100 mb-5'\r\n          disabled={formik.isSubmitting || !formik.isValid || !formik.values.acceptTerms}\r\n        >\r\n          {!loading && <span className='indicator-label'>Submit</span>}\r\n          {loading && (\r\n            <span className='indicator-progress' style={{display: 'block'}}>\r\n              Please wait...{' '}\r\n              <span className='spinner-border spinner-border-sm align-middle ms-2'></span>\r\n            </span>\r\n          )}\r\n        </button>\r\n        <Link to='/auth/login'>\r\n          <button\r\n            type='button'\r\n            id='kt_login_signup_form_cancel_button'\r\n            className='btn btn-lg btn-light-primary w-100 mb-5'\r\n          >\r\n            Cancel\r\n          </button>\r\n        </Link>\r\n      </div>\r\n      {/* end::Form group */}\r\n    </form>\r\n  )\r\n}\r\n","import React, {useState} from 'react'\r\nimport * as Yup from 'yup'\r\nimport clsx from 'clsx'\r\nimport {Link} from 'react-router-dom'\r\nimport {useFormik} from 'formik'\r\nimport {requestPassword} from '../redux/AuthCRUD'\r\n\r\nconst initialValues = {\r\n  email: 'admin@demo.com',\r\n}\r\n\r\nconst forgotPasswordSchema = Yup.object().shape({\r\n  email: Yup.string()\r\n    .email('Wrong email format')\r\n    .min(3, 'Minimum 3 symbols')\r\n    .max(50, 'Maximum 50 symbols')\r\n    .required('Email is required'),\r\n})\r\n\r\nexport function ForgotPassword() {\r\n  const [loading, setLoading] = useState(false)\r\n  const [hasErrors, setHasErrors] = useState<boolean | undefined>(undefined)\r\n  const formik = useFormik({\r\n    initialValues,\r\n    validationSchema: forgotPasswordSchema,\r\n    onSubmit: (values, {setStatus, setSubmitting}) => {\r\n      setLoading(true)\r\n      setHasErrors(undefined)\r\n      setTimeout(() => {\r\n        requestPassword(values.email)\r\n          .then(({data: {result}}) => {\r\n            setHasErrors(false)\r\n            setLoading(false)\r\n          })\r\n          .catch(() => {\r\n            setHasErrors(true)\r\n            setLoading(false)\r\n            setSubmitting(false)\r\n            setStatus('The login detail is incorrect')\r\n          })\r\n      }, 1000)\r\n    },\r\n  })\r\n\r\n  return (\r\n    <>\r\n      <form\r\n        className='form w-100 fv-plugins-bootstrap5 fv-plugins-framework'\r\n        noValidate\r\n        id='kt_login_password_reset_form'\r\n        onSubmit={formik.handleSubmit}\r\n      >\r\n        <div className='text-center mb-10'>\r\n          {/* begin::Title */}\r\n          <h1 className='text-dark mb-3'>Forgot Password ?</h1>\r\n          {/* end::Title */}\r\n\r\n          {/* begin::Link */}\r\n          <div className='text-gray-400 fw-bold fs-4'>Enter your email to reset your password.</div>\r\n          {/* end::Link */}\r\n        </div>\r\n\r\n        {/* begin::Title */}\r\n        {hasErrors === true && (\r\n          <div className='mb-lg-15 alert alert-danger'>\r\n            <div className='alert-text font-weight-bold'>\r\n              Sorry, looks like there are some errors detected, please try again.\r\n            </div>\r\n          </div>\r\n        )}\r\n\r\n        {hasErrors === false && (\r\n          <div className='mb-10 bg-light-info p-8 rounded'>\r\n            <div className='text-info'>Sent password reset. Please check your email</div>\r\n          </div>\r\n        )}\r\n        {/* end::Title */}\r\n\r\n        {/* begin::Form group */}\r\n        <div className='fv-row mb-10'>\r\n          <label className='form-label fw-bolder text-gray-900 fs-6'>Email</label>\r\n          <input\r\n            type='email'\r\n            placeholder=''\r\n            autoComplete='off'\r\n            {...formik.getFieldProps('email')}\r\n            className={clsx(\r\n              'form-control form-control-lg form-control-solid',\r\n              {'is-invalid': formik.touched.email && formik.errors.email},\r\n              {\r\n                'is-valid': formik.touched.email && !formik.errors.email,\r\n              }\r\n            )}\r\n          />\r\n          {formik.touched.email && formik.errors.email && (\r\n            <div className='fv-plugins-message-container'>\r\n              <div className='fv-help-block'>\r\n                <span role='alert'>{formik.errors.email}</span>\r\n              </div>\r\n            </div>\r\n          )}\r\n        </div>\r\n        {/* end::Form group */}\r\n\r\n        {/* begin::Form group */}\r\n        <div className='d-flex flex-wrap justify-content-center pb-lg-0'>\r\n          <button\r\n            type='submit'\r\n            id='kt_password_reset_submit'\r\n            className='btn btn-lg btn-primary fw-bolder me-4'\r\n          >\r\n            <span className='indicator-label'>Submit</span>\r\n            {loading && (\r\n              <span className='indicator-progress'>\r\n                Please wait...\r\n                <span className='spinner-border spinner-border-sm align-middle ms-2'></span>\r\n              </span>\r\n            )}\r\n          </button>\r\n          <Link to='/auth/login'>\r\n            <button\r\n              type='button'\r\n              id='kt_login_password_reset_form_cancel_button'\r\n              className='btn btn-lg btn-light-primary fw-bolder'\r\n              disabled={formik.isSubmitting || !formik.isValid}\r\n            >\r\n              Cancel\r\n            </button>\r\n          </Link>{' '}\r\n        </div>\r\n        {/* end::Form group */}\r\n      </form>\r\n    </>\r\n  )\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, {useState} from 'react'\r\nimport {useDispatch} from 'react-redux'\r\nimport * as Yup from 'yup'\r\nimport clsx from 'clsx'\r\nimport {Link} from 'react-router-dom'\r\nimport {useFormik} from 'formik'\r\nimport * as auth from '../redux/AuthRedux'\r\nimport {login} from '../redux/AuthCRUD'\r\nimport {toAbsoluteUrl} from '../../../../_metronic/helpers'\r\n\r\nconst loginSchema = Yup.object().shape({\r\n  email: Yup.string()\r\n    .email('Wrong email format')\r\n    .min(3, 'Minimum 3 symbols')\r\n    .max(50, 'Maximum 50 symbols')\r\n    .required('Email is required'),\r\n  password: Yup.string()\r\n    .min(3, 'Minimum 3 symbols')\r\n    .max(50, 'Maximum 50 symbols')\r\n    .required('Password is required'),\r\n})\r\n\r\nconst initialValues = {\r\n  email: 'admin@demo.com',\r\n  password: 'demo',\r\n}\r\n\r\n/*\r\n  Formik+YUP+Typescript:\r\n  https://jaredpalmer.com/formik/docs/tutorial#getfieldprops\r\n  https://medium.com/@maurice.de.beijer/yup-validation-and-typescript-and-formik-6c342578a20e\r\n*/\r\n\r\nexport function Login() {\r\n  const [loading, setLoading] = useState(false)\r\n  const dispatch = useDispatch()\r\n  const formik = useFormik({\r\n    initialValues,\r\n    validationSchema: loginSchema,\r\n    onSubmit: (values, {setStatus, setSubmitting}) => {\r\n      setLoading(true)\r\n      setTimeout(() => {\r\n        login(values.email, values.password)\r\n          .then(({data: {accessToken}}) => {\r\n            setLoading(false)\r\n            dispatch(auth.actions.login(accessToken))\r\n          })\r\n          .catch(() => {\r\n            setLoading(false)\r\n            setSubmitting(false)\r\n            setStatus('The login detail is incorrect')\r\n          })\r\n      }, 1000)\r\n    },\r\n  })\r\n\r\n  return (\r\n    <form\r\n      className='form w-100'\r\n      onSubmit={formik.handleSubmit}\r\n      noValidate\r\n      id='kt_login_signin_form'\r\n    >\r\n      {/* begin::Heading */}\r\n      <div className='text-center mb-10'>\r\n        <h1 className='text-dark mb-3'>Sign In to Metronic</h1>\r\n        <div className='text-gray-400 fw-bold fs-4'>\r\n          New Here?{' '}\r\n          <Link to='/auth/registration' className='link-primary fw-bolder'>\r\n            Create an Account\r\n          </Link>\r\n        </div>\r\n      </div>\r\n      {/* begin::Heading */}\r\n\r\n      {formik.status ? (\r\n        <div className='mb-lg-15 alert alert-danger'>\r\n          <div className='alert-text font-weight-bold'>{formik.status}</div>\r\n        </div>\r\n      ) : (\r\n        <div className='mb-10 bg-light-info p-8 rounded'>\r\n          <div className='text-info'>\r\n            Use account <strong>admin@demo.com</strong> and password <strong>demo</strong> to\r\n            continue.\r\n          </div>\r\n        </div>\r\n      )}\r\n\r\n      {/* begin::Form group */}\r\n      <div className='fv-row mb-10'>\r\n        <label className='form-label fs-6 fw-bolder text-dark'>Email</label>\r\n        <input\r\n          placeholder='Email'\r\n          {...formik.getFieldProps('email')}\r\n          className={clsx(\r\n            'form-control form-control-lg form-control-solid',\r\n            {'is-invalid': formik.touched.email && formik.errors.email},\r\n            {\r\n              'is-valid': formik.touched.email && !formik.errors.email,\r\n            }\r\n          )}\r\n          type='email'\r\n          name='email'\r\n          autoComplete='off'\r\n        />\r\n        {formik.touched.email && formik.errors.email && (\r\n          <div className='fv-plugins-message-container'>\r\n            <span role='alert'>{formik.errors.email}</span>\r\n          </div>\r\n        )}\r\n      </div>\r\n      {/* end::Form group */}\r\n\r\n      {/* begin::Form group */}\r\n      <div className='fv-row mb-10'>\r\n        <div className='d-flex justify-content-between mt-n5'>\r\n          <div className='d-flex flex-stack mb-2'>\r\n            {/* begin::Label */}\r\n            <label className='form-label fw-bolder text-dark fs-6 mb-0'>Password</label>\r\n            {/* end::Label */}\r\n            {/* begin::Link */}\r\n            <Link\r\n              to='/auth/forgot-password'\r\n              className='link-primary fs-6 fw-bolder'\r\n              style={{marginLeft: '5px'}}\r\n            >\r\n              Forgot Password ?\r\n            </Link>\r\n            {/* end::Link */}\r\n          </div>\r\n        </div>\r\n        <input\r\n          type='password'\r\n          autoComplete='off'\r\n          {...formik.getFieldProps('password')}\r\n          className={clsx(\r\n            'form-control form-control-lg form-control-solid',\r\n            {\r\n              'is-invalid': formik.touched.password && formik.errors.password,\r\n            },\r\n            {\r\n              'is-valid': formik.touched.password && !formik.errors.password,\r\n            }\r\n          )}\r\n        />\r\n        {formik.touched.password && formik.errors.password && (\r\n          <div className='fv-plugins-message-container'>\r\n            <div className='fv-help-block'>\r\n              <span role='alert'>{formik.errors.password}</span>\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n      {/* end::Form group */}\r\n\r\n      {/* begin::Action */}\r\n      <div className='text-center'>\r\n        <button\r\n          type='submit'\r\n          id='kt_sign_in_submit'\r\n          className='btn btn-lg btn-primary w-100 mb-5'\r\n          disabled={formik.isSubmitting || !formik.isValid}\r\n        >\r\n          {!loading && <span className='indicator-label'>Continue</span>}\r\n          {loading && (\r\n            <span className='indicator-progress' style={{display: 'block'}}>\r\n              Please wait...\r\n              <span className='spinner-border spinner-border-sm align-middle ms-2'></span>\r\n            </span>\r\n          )}\r\n        </button>\r\n\r\n        {/* begin::Separator */}\r\n        <div className='text-center text-muted text-uppercase fw-bolder mb-5'>or</div>\r\n        {/* end::Separator */}\r\n\r\n        {/* begin::Google link */}\r\n        <a href='#' className='btn btn-flex flex-center btn-light btn-lg w-100 mb-5'>\r\n          <img\r\n            alt='Logo'\r\n            src={toAbsoluteUrl('/media/svg/brand-logos/google-icon.svg')}\r\n            className='h-20px me-3'\r\n          />\r\n          Continue with Google\r\n        </a>\r\n        {/* end::Google link */}\r\n\r\n        {/* begin::Google link */}\r\n        <a href='#' className='btn btn-flex flex-center btn-light btn-lg w-100 mb-5'>\r\n          <img\r\n            alt='Logo'\r\n            src={toAbsoluteUrl('/media/svg/brand-logos/facebook-4.svg')}\r\n            className='h-20px me-3'\r\n          />\r\n          Continue with Facebook\r\n        </a>\r\n        {/* end::Google link */}\r\n\r\n        {/* begin::Google link */}\r\n        <a href='#' className='btn btn-flex flex-center btn-light btn-lg w-100'>\r\n          <img\r\n            alt='Logo'\r\n            src={toAbsoluteUrl('/media/svg/brand-logos/apple-black.svg')}\r\n            className='h-20px me-3'\r\n          />\r\n          Continue with Apple\r\n        </a>\r\n        {/* end::Google link */}\r\n      </div>\r\n      {/* end::Action */}\r\n    </form>\r\n  )\r\n}\r\n","import {toAbsoluteUrl} from '../../../../_metronic/helpers'\r\nimport {UserModel} from '../models/UserModel'\r\n\r\nexport class UsersTableMock {\r\n  public static table: Array<UserModel> = [\r\n    {\r\n      id: 1,\r\n      username: 'admin',\r\n      password: 'demo',\r\n      email: 'admin@demo.com',\r\n      auth: {\r\n        accessToken: 'access-token-8f3ae836da744329a6f93bf20594b5cc',\r\n        refreshToken: 'access-token-f8c137a2c98743f48b643e71161d90aa',\r\n      },\r\n      roles: [1], // Administrator\r\n      pic: toAbsoluteUrl('/media/avatars/150-25.jpg'),\r\n      fullname: 'Sean S',\r\n      firstname: 'Sean',\r\n      lastname: 'Stark',\r\n      occupation: 'CEO',\r\n      companyName: 'Keenthemes',\r\n      phone: '456669067890',\r\n      language: 'en',\r\n      timeZone: 'International Date Line West',\r\n      website: 'https://keenthemes.com',\r\n      emailSettings: {\r\n        emailNotification: true,\r\n        sendCopyToPersonalEmail: false,\r\n        activityRelatesEmail: {\r\n          youHaveNewNotifications: false,\r\n          youAreSentADirectMessage: false,\r\n          someoneAddsYouAsAsAConnection: true,\r\n          uponNewOrder: false,\r\n          newMembershipApproval: false,\r\n          memberRegistration: true,\r\n        },\r\n        updatesFromKeenthemes: {\r\n          newsAboutKeenthemesProductsAndFeatureUpdates: false,\r\n          tipsOnGettingMoreOutOfKeen: false,\r\n          thingsYouMissedSindeYouLastLoggedIntoKeen: true,\r\n          newsAboutStartOnPartnerProductsAndOtherServices: true,\r\n          tipsOnStartBusinessProducts: true,\r\n        },\r\n      },\r\n      communication: {\r\n        email: true,\r\n        sms: true,\r\n        phone: false,\r\n      },\r\n      address: {\r\n        addressLine: 'L-12-20 Vertex, Cybersquare',\r\n        city: 'San Francisco',\r\n        state: 'California',\r\n        postCode: '45000',\r\n      },\r\n      socialNetworks: {\r\n        linkedIn: 'https://linkedin.com/admin',\r\n        facebook: 'https://facebook.com/admin',\r\n        twitter: 'https://twitter.com/admin',\r\n        instagram: 'https://instagram.com/admin',\r\n      },\r\n    },\r\n    {\r\n      id: 2,\r\n      username: 'user',\r\n      password: 'demo',\r\n      email: 'user@demo.com',\r\n      auth: {\r\n        accessToken: 'access-token-6829bba69dd3421d8762-991e9e806dbf',\r\n        refreshToken: 'access-token-f8e4c61a318e4d618b6c199ef96b9e55',\r\n      },\r\n      roles: [2], // Manager\r\n      pic: toAbsoluteUrl('/media/avatars/150-1.jpg'),\r\n      fullname: 'Megan F',\r\n      firstname: 'Megan',\r\n      lastname: 'Fox',\r\n      occupation: 'Deputy Head of Keenthemes in New York office',\r\n      companyName: 'Keenthemes',\r\n      phone: '456669067891',\r\n      language: 'en',\r\n      timeZone: 'International Date Line West',\r\n      communication: {\r\n        email: true,\r\n        sms: true,\r\n        phone: false,\r\n      },\r\n      emailSettings: {\r\n        emailNotification: true,\r\n        sendCopyToPersonalEmail: false,\r\n        activityRelatesEmail: {\r\n          youHaveNewNotifications: false,\r\n          youAreSentADirectMessage: false,\r\n          someoneAddsYouAsAsAConnection: true,\r\n          uponNewOrder: false,\r\n          newMembershipApproval: false,\r\n          memberRegistration: true,\r\n        },\r\n        updatesFromKeenthemes: {\r\n          newsAboutKeenthemesProductsAndFeatureUpdates: false,\r\n          tipsOnGettingMoreOutOfKeen: false,\r\n          thingsYouMissedSindeYouLastLoggedIntoKeen: true,\r\n          newsAboutStartOnPartnerProductsAndOtherServices: true,\r\n          tipsOnStartBusinessProducts: true,\r\n        },\r\n      },\r\n      address: {\r\n        addressLine: '3487  Ingram Road',\r\n        city: 'Greensboro',\r\n        state: 'North Carolina',\r\n        postCode: '27409',\r\n      },\r\n      socialNetworks: {\r\n        linkedIn: 'https://linkedin.com/user',\r\n        facebook: 'https://facebook.com/user',\r\n        twitter: 'https://twitter.com/user',\r\n        instagram: 'https://instagram.com/user',\r\n      },\r\n    },\r\n    {\r\n      id: 3,\r\n      username: 'guest',\r\n      password: 'demo',\r\n      email: 'guest@demo.com',\r\n      auth: {\r\n        accessToken: 'access-token-d2dff7b82f784de584b60964abbe45b9',\r\n        refreshToken: 'access-token-c999ccfe74aa40d0aa1a64c5e620c1a5',\r\n      },\r\n      roles: [3], // Guest\r\n      pic: toAbsoluteUrl('/media/avatars/150-5.jpg'),\r\n      fullname: 'Manu G',\r\n      firstname: 'Manu',\r\n      lastname: 'Ginobili',\r\n      occupation: 'CFO',\r\n      companyName: 'Keenthemes',\r\n      phone: '456669067892',\r\n      language: 'en',\r\n      timeZone: 'International Date Line West',\r\n      communication: {\r\n        email: true,\r\n        sms: true,\r\n        phone: false,\r\n      },\r\n      emailSettings: {\r\n        emailNotification: true,\r\n        sendCopyToPersonalEmail: false,\r\n        activityRelatesEmail: {\r\n          youHaveNewNotifications: false,\r\n          youAreSentADirectMessage: false,\r\n          someoneAddsYouAsAsAConnection: true,\r\n          uponNewOrder: false,\r\n          newMembershipApproval: false,\r\n          memberRegistration: true,\r\n        },\r\n        updatesFromKeenthemes: {\r\n          newsAboutKeenthemesProductsAndFeatureUpdates: false,\r\n          tipsOnGettingMoreOutOfKeen: false,\r\n          thingsYouMissedSindeYouLastLoggedIntoKeen: true,\r\n          newsAboutStartOnPartnerProductsAndOtherServices: true,\r\n          tipsOnStartBusinessProducts: true,\r\n        },\r\n      },\r\n      address: {\r\n        addressLine: '1467  Griffin Street',\r\n        city: 'Phoenix',\r\n        state: 'Arizona',\r\n        postCode: '85012',\r\n      },\r\n      socialNetworks: {\r\n        linkedIn: 'https://linkedin.com/guest',\r\n        facebook: 'https://facebook.com/guest',\r\n        twitter: 'https://twitter.com/guest',\r\n        instagram: 'https://instagram.com/guest',\r\n      },\r\n    },\r\n  ]\r\n}\r\n","import React, {useEffect} from 'react'\r\nimport {useDispatch} from 'react-redux'\r\nimport {Redirect, Switch} from 'react-router-dom'\r\nimport * as auth from './redux/AuthRedux'\r\n\r\nexport function Logout() {\r\n  const dispatch = useDispatch()\r\n  useEffect(() => {\r\n    dispatch(auth.actions.logout())\r\n    document.location.reload()\r\n  }, [dispatch])\r\n\r\n  return (\r\n    <Switch>\r\n      <Redirect to='/auth/login' />\r\n    </Switch>\r\n  )\r\n}\r\n","import {FC, useRef, useEffect, useState} from 'react'\r\nimport {shallowEqual, useSelector, connect, useDispatch, ConnectedProps} from 'react-redux'\r\nimport {LayoutSplashScreen} from '../../../../_metronic/layout/core'\r\nimport * as auth from './AuthRedux'\r\nimport {getUserByToken} from './AuthCRUD'\r\nimport {RootState} from '../../../../setup'\r\n\r\nconst mapState = (state: RootState) => ({auth: state.auth})\r\nconst connector = connect(mapState, auth.actions)\r\ntype PropsFromRedux = ConnectedProps<typeof connector>\r\n\r\nconst AuthInit: FC<PropsFromRedux> = (props) => {\r\n  const didRequest = useRef(false)\r\n  const dispatch = useDispatch()\r\n  const [showSplashScreen, setShowSplashScreen] = useState(true)\r\n  const accessToken = useSelector<RootState>(({auth}) => auth.accessToken, shallowEqual)\r\n\r\n  // We should request user by authToken before rendering the application\r\n  useEffect(() => {\r\n    const requestUser = async () => {\r\n      try {\r\n        if (!didRequest.current) {\r\n          const {data: user} = await getUserByToken()\r\n          dispatch(props.fulfillUser(user))\r\n        }\r\n      } catch (error) {\r\n        console.error(error)\r\n        if (!didRequest.current) {\r\n          dispatch(props.logout())\r\n        }\r\n      } finally {\r\n        setShowSplashScreen(false)\r\n      }\r\n\r\n      return () => (didRequest.current = true)\r\n    }\r\n\r\n    if (accessToken) {\r\n      requestUser()\r\n    } else {\r\n      dispatch(props.logout())\r\n      setShowSplashScreen(false)\r\n    }\r\n    // eslint-disable-next-line\r\n  }, [])\r\n\r\n  return showSplashScreen ? <LayoutSplashScreen /> : <>{props.children}</>\r\n}\r\n\r\nexport default connector(AuthInit)\r\n","import {all} from 'redux-saga/effects'\r\nimport {combineReducers} from 'redux'\r\n\r\nimport * as auth from '../../app/modules/auth'\r\n\r\nexport const rootReducer = combineReducers({\r\n  auth: auth.reducer,\r\n})\r\n\r\nexport type RootState = ReturnType<typeof rootReducer>\r\n\r\nexport function* rootSaga() {\r\n  yield all([auth.saga()])\r\n}\r\n","import {configureStore, getDefaultMiddleware} from '@reduxjs/toolkit'\r\nimport createSagaMiddleware from 'redux-saga'\r\nimport {reduxBatch} from '@manaflair/redux-batch'\r\nimport {persistStore} from 'redux-persist'\r\nimport {rootReducer, rootSaga} from './RootReducer'\r\n\r\nconst sagaMiddleware = createSagaMiddleware()\r\nconst middleware = [\r\n  ...getDefaultMiddleware({\r\n    immutableCheck: false,\r\n    serializableCheck: false,\r\n    thunk: true,\r\n  }),\r\n  sagaMiddleware,\r\n]\r\n\r\nconst store = configureStore({\r\n  reducer: rootReducer,\r\n  middleware,\r\n  devTools: process.env.NODE_ENV !== 'production',\r\n  enhancers: [reduxBatch],\r\n})\r\n\r\nexport type AppDispatch = typeof store.dispatch\r\n\r\n/**\r\n * @see https://github.com/rt2zz/redux-persist#persiststorestore-config-callback\r\n * @see https://github.com/rt2zz/redux-persist#persistor-object\r\n */\r\nexport const persistor = persistStore(store)\r\n\r\nsagaMiddleware.run(rootSaga)\r\n\r\nexport default store\r\n","import {FC} from 'react'\r\nimport {useLang} from './Metronici18n'\r\nimport {IntlProvider} from 'react-intl'\r\nimport '@formatjs/intl-relativetimeformat/polyfill'\r\nimport '@formatjs/intl-relativetimeformat/locale-data/en'\r\nimport '@formatjs/intl-relativetimeformat/locale-data/de'\r\nimport '@formatjs/intl-relativetimeformat/locale-data/es'\r\nimport '@formatjs/intl-relativetimeformat/locale-data/fr'\r\nimport '@formatjs/intl-relativetimeformat/locale-data/ja'\r\nimport '@formatjs/intl-relativetimeformat/locale-data/zh'\r\n\r\nimport deMessages from './messages/de.json'\r\nimport enMessages from './messages/en.json'\r\nimport viMessages from './messages/vi.json'\r\nimport esMessages from './messages/es.json'\r\nimport frMessages from './messages/fr.json'\r\nimport jaMessages from './messages/ja.json'\r\nimport zhMessages from './messages/zh.json'\r\n\r\nconst allMessages = {\r\n  de: deMessages,\r\n  es: esMessages,\r\n  vi: viMessages,\r\n  en: enMessages,\r\n  fr: frMessages,\r\n  ja: jaMessages,\r\n  zh: zhMessages,\r\n}\r\n\r\nconst I18nProvider: FC = ({children}) => {\r\n  const locale = useLang()\r\n  const messages = allMessages[locale]\r\n\r\n  return (\r\n    <IntlProvider locale={locale} messages={messages}>\r\n      {children}\r\n    </IntlProvider>\r\n  )\r\n}\r\n\r\nexport {I18nProvider}\r\n","import React, {useEffect} from 'react'\r\nimport {useLocation} from 'react-router'\r\nimport clsx from 'clsx'\r\nimport {DrawerComponent} from '../../assets/ts/components'\r\n\r\nconst Content: React.FC = ({children}) => {\r\n  const location = useLocation()\r\n  useEffect(() => {\r\n    DrawerComponent.hideAll()\r\n  }, [location])\r\n\r\n  return (\r\n    <div id='kt_content_container' className={clsx('content flex-row-fluid')}>\r\n      {children}\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {Content}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport { FC } from 'react'\r\nimport { useIntl } from 'react-intl'\r\nimport { Link } from 'react-router-dom'\r\n\r\n// const iconName = ['fb', 'ig', 'in', 'google', 'zalo']\r\nconst iconName = [\r\n  { icon: 'fb', linkIcon: 'https://www.facebook.com/blueskytech.link' },\r\n\r\n  { icon: 'zalo', linkIcon: 'https://zalo.me/3564384125545349191' },\r\n  { icon: 'youtube', linkIcon: 'https://www.youtube.com/channel/UCkPM0kjfpH8oGteDiWVJzBg' },\r\n]\r\n// {icon: 'ig', linkIcon: 'https://www.facebook.com/blueskytech.link'},\r\n// {icon: 'in', linkIcon: 'https://www.facebook.com/blueskytech.link'},\r\n// {icon: 'google', linkIcon: 'https://www.facebook.com/blueskytech.link'},\r\n\r\nconst linkAboutUs = [\r\n  { title: 'MENU.ABOUTUS', path: 'about' },\r\n  { title: 'MENU.SERVICES', path: 'services' },\r\n  { title: 'MENU.PROJECTS', path: 'projects' },\r\n  { title: 'MENU.CAREERS', path: 'careers' },\r\n]\r\n\r\nconst inforCompany = [\r\n  { title: 'FOOTER.TITLECODE', content: 'FOOTER.COMPANYCODE' },\r\n\r\n  {\r\n    title: 'FOOTER.TITLEADDRESS',\r\n    content: 'FOOTER.COMPANYADDRESS',\r\n  },\r\n]\r\n\r\nconst contactCompany = [\r\n  { title: 'AUTH.INPUT.EMAIL', content: 'truhuynh@blueskytech.vn' },\r\n  { title: 'FOOTER.TITLEPHONE', content: '0932 801 527' },\r\n]\r\n\r\nconst Footer: FC = () => {\r\n  const intl = useIntl()\r\n  return (\r\n    // <div className='footer py-4 d-flex flex-lg-column bg-gray-100 pt-5 pb-5 mt-5' id='kt_footer'>\r\n    <div\r\n      className='footer bg-gray-100'\r\n      id='kt_footer'\r\n      style={{ padding: '3rem 0 2rem', marginTop: '2rem' }}\r\n    >\r\n      {/* begin::Container */}\r\n      {/* end::Container */}\r\n      {/* <div className=\"p-footer\">\r\n        <h1> {intl.formatMessage({ id: 'GENERAL.GETINTOUCH' })}</h1>\r\n        <a href=\"mailto:truhuynh@blueskytech.vn\">truhuynh@blueskytech.vn</a>\r\n        <div className=\"p-footer_contentIcon\">\r\n          {iconName.map((cate, idx) => (\r\n            <span key={idx} className={`p-footer_icon p-footer_icon-${cate}`}></span>\r\n          ))}\r\n        </div>\r\n        <div className=\"p-footer_pic\">\r\n          <div className=\"p-footer_button\">\r\n            <a className=\"p-footer_button_explore\">{intl.formatMessage({ id: 'GENERAL.EXPLORER_OUR' })}</a>\r\n            <a className=\"p-footer_button_contact\">{intl.formatMessage({ id: 'GENERAL.CONTACTUS' })}</a>\r\n          </div>\r\n        </div>\r\n        <a className=\"p-footer_copyright\" >&copy; Copyright BlueSkyTech 2022. All rights reserved </a>\r\n      </div> */}\r\n      <div className='container pt-5'>\r\n        <div className='row'>\r\n          <div className='col-md-5 mb-5'>\r\n            <div className=''>\r\n              <img\r\n                alt='Logo'\r\n                src='/media/logos/Hori_Logo.png'\r\n                className='logo-sticky h-45px mb-4'\r\n              ></img>\r\n              <h2 className='fs-3 fw-bolder text-uppercase'>\r\n                {intl.formatMessage({ id: 'FOOTER.COMPANYNAME' })}\r\n              </h2>\r\n\r\n              {inforCompany.map((item, index) => {\r\n                return (\r\n                  <div className='mb-5 mt-5' key={index}>\r\n                    <p className='fs-4 text-gray-800 w-75'>\r\n                      <span className='fw-bold text-gray-900 text-capitalize'>\r\n                        {intl.formatMessage({ id: item.title })}:{' '}\r\n                      </span>\r\n                      {intl.formatMessage({ id: item.content })}\r\n                    </p>\r\n                  </div>\r\n                )\r\n              })}\r\n            </div>\r\n          </div>\r\n          <div className='col-md-3 mb-5'>\r\n            <h2 className='fs-2 text-gray-800 mb-5'>{intl.formatMessage({ id: 'MENU.ABOUTUS' })}</h2>\r\n            <div className='mb-5'>\r\n              <div className='my-2'>\r\n                {linkAboutUs.map((item, index) => {\r\n                  return (\r\n                    <div className='d-flex align-items-center mb-3' key={index}>\r\n                      <span className='bullet bullet-dot bg-info me-3 h-5px w-5px'></span>\r\n                      <div className='fw-bold fs-4'>\r\n                        <Link to={item.path} className='text-capitalize'>\r\n                          {intl.formatMessage({ id: item.title })}\r\n                        </Link>\r\n                      </div>\r\n                    </div>\r\n                  )\r\n                })}\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <div className='col-md-4'>\r\n            <div className='mb-5'>\r\n              <h2 className='fs-2 text-gray-800 mb-5'>\r\n                {' '}\r\n                {intl.formatMessage({ id: 'GENERAL.GETINTOUCH' })}\r\n              </h2>\r\n\r\n              {contactCompany.map((item, idx) => {\r\n                return (\r\n                  <div className='fs-4 text-gray-800 mb-2' key={idx}>\r\n                    <span className='fw-bold text-gray-900 text-capitalize'>\r\n                      {' '}\r\n                      {intl.formatMessage({ id: item.title })}:\r\n                    </span>{' '}\r\n                    {item.content}\r\n                  </div>\r\n                )\r\n              })}\r\n\r\n              <div className='mt-5'>\r\n                {/* <span key={idx} className={`p-footer_icon p-footer_icon-${cate}`}></span> */}\r\n                {iconName.map((cate, idx) => {\r\n                  return (\r\n                    <a href={cate.linkIcon} target='blank' key={idx}>\r\n                      <i className={`p-footer_icon p-footer_icon-${cate.icon}`}></i>\r\n                    </a>\r\n                  )\r\n                })}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <div className='container'>\r\n        <div className='text-center'>\r\n          <span className='p-footer_copyright fs-5'>\r\n            &copy; Copyright BlueSkyTech {new Date().getFullYear()}. All rights reserved{' '}\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport { Footer }\r\n","import React from 'react'\r\nimport {Link} from 'react-router-dom'\r\nimport {useLocation} from 'react-router'\r\nimport clsx from 'clsx'\r\nimport {checkIsActive, KTSVG} from '../../../helpers'\r\n\r\ntype Props = {\r\n  to: string\r\n  title: string\r\n  icon?: string\r\n  fontIcon?: string\r\n  hasArrow?: boolean\r\n  hasBullet?: boolean\r\n}\r\n\r\nconst MenuItem: React.FC<Props> = ({\r\n  to,\r\n  title,\r\n  icon,\r\n  fontIcon,\r\n  hasArrow = false,\r\n  hasBullet = false,\r\n}) => {\r\n  const {pathname} = useLocation()\r\n\r\n  return (\r\n    <div className='menu-item me-lg-1'>\r\n      <Link\r\n        className={clsx('menu-link py-3', {\r\n          active: checkIsActive(pathname, to),\r\n        })}\r\n        to={to}\r\n      >\r\n        {hasBullet && (\r\n          <span className='menu-bullet'>\r\n            <span className='bullet bullet-dot'></span>\r\n          </span>\r\n        )}\r\n\r\n        {icon && (\r\n          <span className='menu-icon'>\r\n            <KTSVG path={icon} className='svg-icon-2' />\r\n          </span>\r\n        )}\r\n\r\n        {fontIcon && (\r\n          <span className='menu-icon'>\r\n            <i className={clsx('bi fs-3', fontIcon)}></i>\r\n          </span>\r\n        )}\r\n\r\n        <span className='menu-title'>{title}</span>\r\n\r\n        {hasArrow && <span className='menu-arrow'></span>}\r\n      </Link>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {MenuItem}\r\n","import React from 'react'\r\n//import {MegaMenu} from './MegaMenu'\r\nimport { useIntl } from 'react-intl'\r\nimport { MenuItem } from './MenuItem'\r\n\r\nexport function MenuInner() {\r\n  const intl = useIntl()\r\n  return (\r\n    <>\r\n      {/* <h1>Tieu de</h1> */}\r\n      <MenuItem title={intl.formatMessage({ id: \"MENU.ABOUTUS\" })} to='/about' />\r\n      <MenuItem title={intl.formatMessage({ id: \"MENU.PROJECTS\" })} to='/projects' />\r\n      <MenuItem title={intl.formatMessage({ id: \"MENU.SERVICES\" })} to='/services' />\r\n      <MenuItem title={intl.formatMessage({ id: \"MENU.INSIGHTS\" })} to='/insights' />\r\n      <MenuItem title={intl.formatMessage({ id: \"MENU.CAREERS\" })} to='/careers' />\r\n\r\n      {/* <MenuInnerWithSub\r\n        title='Services'\r\n        to='/crafted'\r\n        menuPlacement='bottom-start'\r\n        menuTrigger='click'\r\n      >\r\n        <MenuInnerWithSub\r\n          title='Pages'\r\n          to='/crafted/pages'\r\n          icon='/media/icons/duotune/general/gen022.svg'\r\n          hasArrow={true}\r\n          menuPlacement='right-start'\r\n          menuTrigger={`{default:'click', lg: 'hover'}`}\r\n        >\r\n          <MenuInnerWithSub\r\n            title='Profile'\r\n            to='/crafted/pages/profile'\r\n            hasArrow={true}\r\n            hasBullet={true}\r\n            menuPlacement='right-start'\r\n            menuTrigger={`{default:'click', lg: 'hover'}`}\r\n          >\r\n            <MenuItem to='/crafted/pages/profile/overview' title='Overview' hasBullet={true} />\r\n            <MenuItem to='/crafted/pages/profile/projects' title='Projects' hasBullet={true} />\r\n            <MenuItem to='/crafted/pages/profile/campaigns' title='Campaigns' hasBullet={true} />\r\n            <MenuItem to='/crafted/pages/profile/documents' title='Documents' hasBullet={true} />\r\n            <MenuItem\r\n              to='/crafted/pages/profile/connections'\r\n              title='Connections'\r\n              hasBullet={true}\r\n            />\r\n          </MenuInnerWithSub>\r\n          <MenuInnerWithSub\r\n            title='Wizards'\r\n            to='/crafted/pages/wizards'\r\n            hasArrow={true}\r\n            hasBullet={true}\r\n            menuPlacement='right-start'\r\n            menuTrigger={`{default:'click', lg: 'hover'}`}\r\n          >\r\n            <MenuItem to='/crafted/pages/wizards/horizontal' title='Horizontal' hasBullet={true} />\r\n            <MenuItem to='/crafted/pages/wizards/vertical' title='Vertical' hasBullet={true} />\r\n          </MenuInnerWithSub>\r\n        </MenuInnerWithSub>\r\n\r\n        <MenuInnerWithSub\r\n          title='Accounts'\r\n          to='/crafted/accounts'\r\n          icon='/media/icons/duotune/communication/com006.svg'\r\n          hasArrow={true}\r\n          menuPlacement='right-start'\r\n          menuTrigger={`{default:'click', lg: 'hover'}`}\r\n        >\r\n          <MenuItem to='/crafted/account/overview' title='Overview' hasBullet={true} />\r\n          <MenuItem to='/crafted/account/settings' title='Settings' hasBullet={true} />\r\n        </MenuInnerWithSub>\r\n\r\n        <MenuInnerWithSub\r\n          title='Errors'\r\n          to='/error'\r\n          icon='/media/icons/duotune/technology/teh004.svg'\r\n          hasArrow={true}\r\n          menuPlacement='bottom-start'\r\n          menuTrigger={`{default:'click', lg: 'hover'}`}\r\n        >\r\n          <MenuItem to='/error/404' title='Error 404' hasBullet={true} />\r\n          <MenuItem to='/error/500' title='Error 500' hasBullet={true} />\r\n        </MenuInnerWithSub>\r\n\r\n        <MenuInnerWithSub\r\n          title='Widgets'\r\n          to='/crafted/widgets'\r\n          icon='/media/icons/duotune/general/gen025.svg'\r\n          hasArrow={true}\r\n          menuPlacement='right-start'\r\n          menuTrigger={`{default:'click', lg: 'hover'}`}\r\n        >\r\n          <MenuItem to='/crafted/widgets/lists' title='Lists' hasBullet={true} />\r\n          <MenuItem to='/crafted/widgets/statistics' title='Statistics' hasBullet={true} />\r\n          <MenuItem to='/crafted/widgets/charts' title='Charts' hasBullet={true} />\r\n          <MenuItem to='/crafted/widgets/mixed' title='Mixed' hasBullet={true} />\r\n          <MenuItem to='/crafted/widgets/tables' title='Tables' hasBullet={true} />\r\n          <MenuItem to='/crafted/widgets/feeds' title='Feeds' hasBullet={true} />\r\n        </MenuInnerWithSub>\r\n      </MenuInnerWithSub> */}      \r\n    </>\r\n  )\r\n}\r\n","import React, {FC} from 'react'\r\nimport {MenuInner} from './MenuInner'\r\n\r\nconst Header: FC = () => {\r\n  return (\r\n    <div\r\n      className='header-menu align-items-stretch'\r\n      data-kt-drawer='true'\r\n      data-kt-drawer-name='header-menu'\r\n      data-kt-drawer-activate='{default: true, lg: false}'\r\n      data-kt-drawer-overlay='true'\r\n      data-kt-drawer-width=\"{default:'200px', '300px': '250px'}\"\r\n      data-kt-drawer-direction='end'\r\n      data-kt-drawer-toggle='#kt_header_menu_mobile_toggle'\r\n      data-kt-swapper='true'\r\n      data-kt-swapper-mode='prepend'\r\n      data-kt-swapper-parent=\"{default: '#kt_body', lg: '#kt_header_nav'}\"\r\n    >\r\n      <div\r\n        className='menu menu-lg-rounded menu-column menu-lg-row menu-state-bg menu-title-gray-700 menu-state-title-primary menu-state-icon-primary menu-state-bullet-primary menu-arrow-gray-400 fw-bold my-5 my-lg-0 align-items-stretch'\r\n        id='#kt_header_menu'\r\n        data-kt-menu='true'\r\n      >\r\n        <MenuInner />\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {Header}\r\n","import React, {FC} from 'react'\r\nimport {Link} from 'react-router-dom'\r\nimport {useLayout} from '../../../core/LayoutProvider'\r\nimport {usePageData} from '../../../core/PageData'\r\n\r\nconst DefaultTitle: FC = () => {\r\n  const {pageTitle, pageDescription, pageBreadcrumbs} = usePageData()\r\n  const {config, attributes} = useLayout()\r\n  return (\r\n    <div {...attributes.pageTitle} className='page-title d-flex flex-column'>\r\n      {/* begin::Title */}\r\n      {pageTitle && (\r\n        <h1 className='d-flex text-white fw-bolder my-1 fs-3'>\r\n          {pageTitle}\r\n          {pageDescription && config.pageTitle && config.pageTitle.description && (\r\n            <>\r\n              <span className='h-20px border-gray-200 border-start ms-3 mx-2'></span>\r\n              <small className='text-muted fs-7 fw-bold my-1 ms-1'>{pageDescription}</small>\r\n            </>\r\n          )}\r\n        </h1>\r\n      )}\r\n      {/* end::Title */}\r\n\r\n      {pageBreadcrumbs &&\r\n        pageBreadcrumbs.length > 0 &&\r\n        config.pageTitle &&\r\n        config.pageTitle.breadCrumbs && (\r\n          <ul className='breadcrumb breadcrumb-separatorless fw-bold fs-7 my-1'>\r\n            {Array.from(pageBreadcrumbs).map((item, index) => (\r\n              <li className={'breadcrumb-item text-white opacity-75'} key={`${item.path}${index}`}>\r\n                {!item.isSeparator ? (\r\n                  <Link className='text-white text-hover-primary' to={item.path}>\r\n                    {item.title}\r\n                  </Link>\r\n                ) : (\r\n                  <span className='bullet bg-white opacity-75 w-5px h-2px'></span>\r\n                )}\r\n              </li>\r\n            ))}\r\n            <li className='text-white text-hover-primary'>{pageTitle}</li>\r\n          </ul>\r\n        )}\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {DefaultTitle}\r\n","import React, { FC } from 'react'\r\nimport { useIntl } from 'react-intl'\r\nimport { toAbsoluteUrl } from '../../../helpers'\r\nimport { setLanguage, useLang } from '../../../i18n/Metronici18n'\r\n//import { HeaderNotificationsMenu, HeaderUserMenu, QuickLinks, Search } from '../../../partials'\r\n//import { Languages } from '../../../partials/layout/header-menus/Languages'\r\n\r\n// const toolbarButtonMarginClass = 'ms-1 ms-lg-3',\r\n//   toolbarButtonHeightClass = 'w-30px h-30px w-md-40px h-md-40px',\r\n//   toolbarUserAvatarHeightClass = 'symbol-30px symbol-md-40px',\r\n//   toolbarButtonIconSizeClass = 'svg-icon-1'\r\nconst languages = [\r\n  {\r\n    lang: 'en',\r\n    name: 'EN',\r\n    flag: toAbsoluteUrl('/media/flags/united-states.svg'),\r\n  },\r\n  {\r\n    lang: 'vi',\r\n    name: 'VI',\r\n    flag: toAbsoluteUrl('/media/flags/vietnam.svg'),\r\n  },\r\n]\r\n\r\nconst Topbar: FC = () => {\r\n  const intl = useIntl();\r\n  const lang = useLang();\r\n  const currentLanguage = languages.find((x) => x.lang === lang)\r\n  const handleChange = (e: any) => {\r\n    setLanguage(e.target.value);\r\n  }\r\n  return (\r\n    <div className='d-flex align-items-stretch flex-shrink-0'>\r\n      <div className='topbar d-flex align-items-stretch flex-shrink-0'>\r\n        {/* Search */}\r\n        <a href='/contact' className=\"nav-input\"><span>{intl.formatMessage({ id: \"AUTH.GENERAL.CONTACT\" })}</span></a>\r\n        {/*  */}\r\n        <div className=\"select\">\r\n          <select className=\"selected disabled border-0\" onChange={handleChange} defaultValue={currentLanguage?.lang}>\r\n            {languages.map((item, idx) => (\r\n              <option key={idx}\r\n                value={item.lang} style={{ height: \"90px\" }}>\r\n                {item.name}\r\n              </option>\r\n            ))}\r\n          </select>\r\n        </div>\r\n        {/*  */}\r\n\r\n\r\n        {/* <div className={clsx('d-flex align-items-stretch', toolbarButtonMarginClass)}>\r\n     <Search />\r\n      </div> */}\r\n        {/* Activities */}\r\n        {/* <div className={clsx('d-flex align-items-center ', toolbarButtonMarginClass)}>\r\n  \r\n          <div\r\n            className={clsx(\r\n              'btn btn-icon btn-active-light-primary position-relative',\r\n              toolbarButtonHeightClass\r\n            )}\r\n            id='kt_activities_toggle'\r\n          >\r\n            <KTSVG\r\n              path='/media/icons/duotune/general/gen032.svg'\r\n              className={toolbarButtonIconSizeClass}\r\n            />\r\n          </div>\r\n    \r\n        </div> */}\r\n        {/* Quick links */}\r\n        {/* <div className={clsx('d-flex align-items-center', toolbarButtonMarginClass)}>\r\n  \r\n          <div\r\n            className={clsx(\r\n              'btn btn-icon btn-active-light-primary position-relative',\r\n              toolbarButtonHeightClass\r\n            )}\r\n            data-kt-menu-trigger='click'\r\n            data-kt-menu-attach='parent'\r\n            data-kt-menu-placement='bottom-end'\r\n            data-kt-menu-flip='bottom'\r\n          >\r\n            <KTSVG\r\n              path='/media/icons/duotune/general/gen025.svg'\r\n              className={toolbarButtonIconSizeClass}\r\n            />\r\n          </div>\r\n          <QuickLinks />\r\n        </div> */}\r\n\r\n        {/* CHAT */}\r\n        {/* <div className={clsx('d-flex align-items-center', toolbarButtonMarginClass)}>\r\n\r\n          <div\r\n            className={clsx(\r\n              'btn btn-icon btn-active-light-primary position-relative',\r\n              toolbarButtonHeightClass\r\n            )}\r\n            id='kt_drawer_chat_toggle'\r\n          >\r\n            <KTSVG\r\n              path='/media/icons/duotune/communication/com012.svg'\r\n              className={toolbarButtonIconSizeClass}\r\n            />\r\n\r\n            <span className='bullet bullet-dot bg-success h-6px w-6px position-absolute translate-middle top-0 start-50 animation-blink'></span>\r\n          </div>\r\n\r\n        </div> */}\r\n\r\n        {/* NOTIFICATIONS */}\r\n        {/* <div className={clsx('d-flex align-items-center', toolbarButtonMarginClass)}>\r\n          <div\r\n            className={clsx(\r\n              'btn btn-icon btn-active-light-primary position-relative',\r\n              toolbarButtonHeightClass\r\n            )}\r\n            data-kt-menu-trigger='click'\r\n            data-kt-menu-attach='parent'\r\n            data-kt-menu-placement='bottom-end'\r\n            data-kt-menu-flip='bottom'\r\n          >\r\n            <KTSVG\r\n              path='/media/icons/duotune/general/gen022.svg'\r\n              className={toolbarButtonIconSizeClass}\r\n            />\r\n          </div>\r\n          <HeaderNotificationsMenu />\r\n\r\n        </div> */}\r\n\r\n        {/* begin::User */}\r\n        {/* <div\r\n          className={clsx('d-flex align-items-center', toolbarButtonMarginClass)}\r\n          id='kt_header_user_menu_toggle'\r\n        >\r\n          <div\r\n            className={clsx('cursor-pointer symbol', toolbarUserAvatarHeightClass)}\r\n            data-kt-menu-trigger='click'\r\n            data-kt-menu-attach='parent'\r\n            data-kt-menu-placement='bottom-end'\r\n            data-kt-menu-flip='bottom'\r\n          >\r\n            <img\r\n              className='h-25px w-25px rounded'\r\n              src={toAbsoluteUrl('/media/avatars/150-25.jpg')}\r\n              alt='metronic'\r\n            />\r\n          </div>\r\n          <HeaderUserMenu />\r\n    \r\n        </div> */}\r\n        {/* end::User */}\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport { Topbar }\r\n\r\n","/* eslint-disable react-hooks/exhaustive-deps */\r\nimport clsx from 'clsx'\r\nimport React, {useEffect} from 'react'\r\nimport {Link, useLocation} from 'react-router-dom'\r\nimport {MenuComponent} from '../../../assets/ts/components'\r\nimport {KTSVG, toAbsoluteUrl} from '../../../helpers'\r\nimport {useLayout} from '../../core'\r\nimport {Header} from './Header'\r\nimport {DefaultTitle} from './page-title/DefaultTitle'\r\nimport {Topbar} from './Topbar'\r\nexport function HeaderWrapper() {\r\n  const {pathname} = useLocation()\r\n  const {config, classes, attributes} = useLayout()\r\n  const {header, aside} = config\r\n\r\n  useEffect(() => {\r\n    MenuComponent.reinitialization()\r\n  }, [pathname])\r\n\r\n  return (\r\n    <div\r\n      id='kt_header'\r\n      className={clsx('header', classes.header.join(' '), 'align-items-stretch')}\r\n      data-kt-sticky='true'\r\n      data-kt-sticky-name='header'\r\n      data-kt-sticky-offset=\"{default: '200px', lg: '300px'}\"\r\n      data-kt-sticky-homepage={pathname === \"/dashboard\" ? \"homepage\" : \"other\"}\r\n      {...attributes.headerMenu}\r\n    >\r\n      {/*  */}\r\n       {/* <div className={clsx(classes.headerContainer.join(' '), 'd-flex align-items-center')}></div> */}\r\n      <div className=' container-fluid d-flex align-items-center'>\r\n        {/* begin::Aside mobile toggle */}\r\n        {aside.display && (\r\n          <div className='d-flex align-items-center d-lg-none ms-n3 me-1' title='Show aside menu'>\r\n            <div\r\n              className='btn btn-icon btn-active-light-primary w-30px h-30px w-md-40px h-md-40px'\r\n              id='kt_aside_mobile_toggle'\r\n            >\r\n              <KTSVG path='/media/icons/duotune/abstract/abs015.svg' className='svg-icon-2x mt-1' />\r\n            </div>\r\n          </div>\r\n        )}\r\n        {/* end::Aside mobile toggle */}\r\n\r\n        <div\r\n          className='d-flex topbar align-items-center d-lg-none ms-n2 me-3'\r\n          title='Show aside menu'\r\n        >\r\n          <div\r\n            className='btn btn-icon btn-active-light-primary w-30px h-30px w-md-40px h-md-40px'\r\n            id='kt_header_menu_mobile_toggle'\r\n          >\r\n            <KTSVG path='/media/icons/duotune/abstract/abs015.svg' className='svg-icon-2x' />\r\n          </div>\r\n        </div>\r\n\r\n        <div className='header-logo me-5 me-md-10 flex-grow-1 flex-lg-grow-0'>\r\n          <Link to='/'>\r\n            <img\r\n              alt='Logo'\r\n              src={toAbsoluteUrl('/media/logos/Hori_Logo_White.png')}\r\n              className='logo-default h-25px'\r\n            />\r\n            <img\r\n              alt='Logo'\r\n              src={toAbsoluteUrl('/media/logos/Hori_Logo.png')}\r\n              className='logo-sticky h-25px'\r\n            />\r\n          </Link>\r\n        </div>\r\n\r\n        {/* begin::Wrapper */}\r\n        <div className='d-flex align-items-stretch justify-content-between flex-lg-grow-1' >\r\n          {/* begin::Navbar */}\r\n          {header.left === 'menu' && (\r\n            <div className='d-flex align-items-stretch nav-center' id='kt_header_nav'>\r\n              <Header />\r\n            </div>\r\n          )}\r\n\r\n          {header.left === 'page-title' && (\r\n            <div className='d-flex align-items-center' id='kt_header_nav'>\r\n              <DefaultTitle />\r\n            </div>\r\n          )}\r\n\r\n          <div className='d-flex align-items-stretch flex-shrink-0'>\r\n            <Topbar />\r\n          </div>\r\n        </div>\r\n        {/* end::Wrapper */}\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n","import React, {useEffect, useRef} from 'react'\r\nimport {useLocation} from 'react-router-dom'\r\nimport {\r\n  // ScrollComponent,\r\n  ScrollTopComponent,\r\n  MenuComponent,\r\n  DrawerComponent,\r\n  ToggleComponent,\r\n  StickyComponent,\r\n} from '../../assets/ts/components'\r\nimport {KTSVG} from '../../helpers'\r\n\r\nexport function ScrollTop() {\r\n  const {pathname} = useLocation()\r\n  const isFirstRun = useRef(true)\r\n\r\n  const pluginsReinitialization = () => {\r\n    setTimeout(() => {\r\n      // ScrollTopComponent.reinitialization()\r\n      MenuComponent.reinitialization()\r\n      StickyComponent.reInitialization()\r\n      setTimeout(() => {\r\n        ToggleComponent.reinitialization()\r\n        DrawerComponent.reinitialization()\r\n        // ScrollComponent.reinitialization()\r\n      }, 70)\r\n    }, 140)\r\n  }\r\n\r\n  const scrollTop = () => {\r\n    ScrollTopComponent.goTop()\r\n  }\r\n\r\n  const updateHeaderSticky = () => {\r\n    const stickyHeader = document.body.querySelectorAll(`[data-kt-sticky-name=\"header\"]`)\r\n    if (stickyHeader && stickyHeader.length > 0) {\r\n      const sticky = StickyComponent.getInstance(stickyHeader[0] as HTMLElement)\r\n      if (sticky) {\r\n        sticky.update()\r\n      }\r\n    }\r\n  }\r\n\r\n  useEffect(() => {\r\n    if (isFirstRun.current) {\r\n      isFirstRun.current = false\r\n    } else {\r\n      pluginsReinitialization()\r\n    }\r\n\r\n    updateHeaderSticky()\r\n    setTimeout(() => {\r\n      scrollTop()\r\n    }, 0)\r\n  }, [pathname])\r\n\r\n  return (\r\n    <div id='kt_scrolltop' className='scrolltop' data-kt-scrolltop='true'>\r\n      <KTSVG path='/media/icons/duotune/arrows/arr066.svg' />\r\n    </div>\r\n  )\r\n}\r\n","import {useEffect, useRef} from 'react'\r\nimport {\r\n  MenuComponent,\r\n  DrawerComponent,\r\n  ScrollComponent,\r\n  ScrollTopComponent,\r\n  StickyComponent,\r\n  ToggleComponent,\r\n} from '../assets/ts/components'\r\n\r\nimport {useLayout} from './core'\r\n\r\nexport function MasterInit() {\r\n  const {config} = useLayout()\r\n  const isFirstRun = useRef(true)\r\n  const pluginsInitialization = () => {\r\n    isFirstRun.current = false\r\n    setTimeout(() => {\r\n      ToggleComponent.bootstrap()\r\n      ScrollTopComponent.bootstrap()\r\n      DrawerComponent.bootstrap()\r\n      StickyComponent.bootstrap()\r\n      MenuComponent.bootstrap()\r\n      ScrollComponent.bootstrap()\r\n    }, 200)\r\n  }\r\n\r\n  useEffect(() => {\r\n    if (isFirstRun.current) {\r\n      isFirstRun.current = false\r\n      pluginsInitialization()\r\n    }\r\n  }, [config])\r\n\r\n  return <></>\r\n}\r\n","import clsx from 'clsx'\r\nimport React, { useEffect } from 'react'\r\nimport { useLocation } from 'react-router-dom'\r\nimport { MenuComponent } from '../../_metronic/assets/ts/components'\r\nimport {\r\n  ActivityDrawer, DrawerMessenger,\r\n  ExploreMain, InviteUsers, Main, UpgradePlan\r\n} from '../partials'\r\nimport { Content } from './components/Content'\r\nimport { Footer } from './components/Footer'\r\nimport { HeaderWrapper } from './components/header/HeaderWrapper'\r\nimport { ScrollTop } from './components/ScrollTop'\r\nimport { PageDataProvider } from './core'\r\nimport { MasterInit } from './MasterInit'\r\n\r\nconst MasterLayout: React.FC = ({ children }) => {\r\n  //const { classes } = useLayout()\r\n\r\n  const location = useLocation()\r\n  useEffect(() => {\r\n    MenuComponent.reinitialization()\r\n  }, [location.key])\r\n\r\n  return (\r\n    <PageDataProvider>\r\n      <div className='page d-flex flex-row flex-column-fluid'>\r\n        <div className='wrapper d-flex flex-column flex-row-fluid' id='kt_wrapper'>\r\n          <HeaderWrapper />\r\n\r\n          <div id='kt_content' className='content d-flex flex-column flex-column-fluid'>\r\n            {/* <Toolbar /> */}\r\n            <div\r\n              className={clsx(\r\n                ' d-flex flex-column-fluid align-items-start',\r\n                // classes.contentContainer.join(' ')\r\n              )}\r\n              id='kt_post'\r\n            >\r\n              {/* <AsideDefault /> */}\r\n              <Content>{children}</Content>\r\n            </div>\r\n          </div>\r\n          <Footer />\r\n        </div>\r\n      </div>\r\n\r\n      {/* begin:: Drawers */}\r\n      <ActivityDrawer />\r\n      <ExploreMain />\r\n      <DrawerMessenger />\r\n      {/* end:: Drawers */}\r\n\r\n      {/* begin:: Modals */}\r\n      <Main />\r\n      <InviteUsers />\r\n      <UpgradePlan />\r\n      {/* end:: Modals */}\r\n\r\n      <MasterInit />\r\n      <ScrollTop />\r\n    </PageDataProvider>\r\n  )\r\n}\r\n\r\nexport { MasterLayout }\r\n\r\n","import {FC} from 'react'\r\n\r\nconst Error500: FC = () => {\r\n  return (\r\n    <>\r\n      <h1 className='fw-bolder fs-4x text-gray-700 mb-10'>System Error</h1>\r\n\r\n      <div className='fw-bold fs-3 text-gray-400 mb-15'>\r\n        Something went wrong! <br /> Please try again later.\r\n      </div>\r\n    </>\r\n  )\r\n}\r\n\r\nexport {Error500}\r\n","import {FC} from 'react'\r\n\r\nconst Error404: FC = () => {\r\n  return (\r\n    <>\r\n      <h1 className='fw-bolder fs-4x text-gray-700 mb-10'>Page Not Found</h1>\r\n\r\n      <div className='fw-bold fs-3 text-gray-400 mb-15'>\r\n        The page you looked not found! <br /> Plan your blog post by choosing a topic\r\n      </div>\r\n    </>\r\n  )\r\n}\r\n\r\nexport {Error404}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from 'react'\r\nimport {Redirect, Route, Switch, useHistory} from 'react-router-dom'\r\nimport {Error500} from './components/Error500'\r\nimport {Error404} from './components/Error404'\r\nimport {toAbsoluteUrl} from '../../../_metronic/helpers'\r\n\r\nconst ErrorsPage: React.FC = () => {\r\n  const history = useHistory()\r\n  const redirectToDashboard = () => {\r\n    history.push('/')\r\n  }\r\n\r\n  return (\r\n    <div className='d-flex flex-column flex-root'>\r\n      <div\r\n        className='d-flex flex-column flex-column-fluid bgi-position-y-bottom position-x-center bgi-no-repeat bgi-size-contain bgi-attachment-fixed'\r\n        style={{backgroundImage: `url('${toAbsoluteUrl('/media/illustrations/progress-hd.png')}')`}}\r\n      >\r\n        <div className='d-flex flex-column flex-column-fluid text-center p-10 py-lg-20'>\r\n          <a href='/dashboard' className='mb-10 pt-lg-20'>\r\n            <img\r\n              alt='Logo'\r\n              src={toAbsoluteUrl('/media/logos/logo-1.svg')}\r\n              className='h-50px mb-5'\r\n            />\r\n          </a>\r\n          <div className='pt-lg-10 mb-10'>\r\n            <Switch>\r\n              <Route path='/error/404' exact={true}>\r\n                <Error404 />\r\n              </Route>\r\n              <Route path='/error/500' exact={true}>\r\n                <Error500 />\r\n              </Route>\r\n              <Redirect from='/error' exact={true} to='/error/404' />\r\n              <Redirect to='/error/404' />\r\n            </Switch>\r\n\r\n            <div className='text-center'>\r\n              <a onClick={redirectToDashboard} className='btn btn-lg btn-primary fw-bolder'>\r\n                Go to homepage\r\n              </a>\r\n            </div>\r\n          </div>\r\n          <div\r\n            className='\r\n          d-flex\r\n          flex-row-auto\r\n          bgi-no-repeat\r\n          bgi-position-x-center\r\n          bgi-size-contain\r\n          bgi-position-y-bottom\r\n          min-h-100px min-h-lg-350px\r\n        '\r\n            style={{\r\n              backgroundImage: `url('${toAbsoluteUrl('/media/illustrations/sketchy-1/17.png')}')`,\r\n            }}\r\n          ></div>\r\n        </div>\r\n\r\n        <div className='d-flex flex-center flex-column-auto p-10'>\r\n          <div className='d-flex align-items-center fw-bold fs-6'>\r\n            <a href='https://keenthemes.com' className='text-muted text-hover-primary px-2'>\r\n              About\r\n            </a>\r\n            <a href='mailto:support@keenthemes.com' className='text-muted text-hover-primary px-2'>\r\n              Contact\r\n            </a>\r\n            <a href='https://1.envato.market/EA4JP' className='text-muted text-hover-primary px-2'>\r\n              Contact Us\r\n            </a>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {ErrorsPage}\r\n","import React, { Fragment } from 'react';\r\nimport Marquee from \"react-fast-marquee\";\r\nimport { useIntl } from 'react-intl';\r\nimport { toAbsoluteUrl } from '../../../../../_metronic/helpers';\r\nimport './banner.scss';\r\n\r\nconst servicesData = [\r\n\t{ serviceId: 1, serviceName: \"E-Commerce\" },\r\n\t{ serviceId: 2, serviceName: \"Web Application\" },\r\n\t{ serviceId: 3, serviceName: \"Web Information\" },\r\n\t{ serviceId: 4, serviceName: \"Landing Page\" },\r\n\t{ serviceId: 5, serviceName: \"Mobile Application\" },\r\n\t{ serviceId: 6, serviceName: \"Game Application\" },\r\n\t{ serviceId: 7, serviceName: \"Logo Design\" },\r\n\t{ serviceId: 8, serviceName: \"Banner Design\" },\r\n\t{ serviceId: 9, serviceName: \"Template Design\" },\r\n\t{ serviceId: 10, serviceName: \"Event Design\" },\r\n]\r\n\r\nconst BannerWrapper = () => {\r\n\tconst intl = useIntl(); \r\n\treturn <>\r\n\t\t<div className=\"banner-container\">\r\n\t\t\t<video src={toAbsoluteUrl(`/media/videos/banner/bg-video-${Math.floor(Math.random() * 2) + 1}.mp4`)} autoPlay loop muted preload=\"none\" />\r\n\t\t\t<h1>{intl.formatMessage({ id: \"HOME.VIDEO.SLOGAN\" })}</h1>\r\n\t\t\t<p>{intl.formatMessage({ id: \"HOME.VIDEO.SLOGAN_DESC\" })}</p>\r\n\t\t\t<div className=\"banner-btn\">\r\n        <a href='#kt_explore'>\r\n          <p>{intl.formatMessage({ id: \"HOME.EXPLOER_MORE\" })}</p>\r\n          <div className=\"arrow\"/>\r\n        </a>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t<Marquee className=\"banner-fields\" gradient={false} >\r\n\t\t\t{\r\n\t\t\t\tservicesData.map(item => {\r\n\t\t\t\t\treturn <Fragment key={item.serviceId}>\r\n\t\t\t\t\t\t<div className=\"field-items\"><p>{item.serviceName}</p></div>\r\n\t\t\t\t\t\t<div className=\"field-divider\">\r\n\t\t\t\t\t\t\t<img alt='' src={toAbsoluteUrl('/media/images/banner/dots-menu.png')}/>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</Fragment>\r\n\t\t\t\t})\r\n\t\t\t}\r\n\t\t</Marquee>\r\n\t</>\r\n}\r\n\r\nexport { BannerWrapper };\r\n\r\n","import React, {FC} from 'react'\r\nimport {useIntl} from 'react-intl'\r\nimport ProjectContent from '../../../projects/ProjectContent'\r\nimport YouTubePlayer from 'react-player/youtube'\r\n\r\nconst ProjectsWrapper: FC = () => {\r\n  const intl = useIntl()\r\n  return (\r\n    <div className='project-home'>\r\n      <div className='project-home-text'>\r\n        <div className='col-xxl-8 col-lg-9 col-sm-11 col-10 text-center project-auto'>\r\n          <span className='position-relative'>\r\n            <img src='media/images/home-page/Path.svg' alt='' className='w-100 position-absolute' />\r\n            {intl.formatMessage({id: 'HOME.PROJECT.SAYING'})}\r\n          </span>\r\n        </div>\r\n      </div>\r\n      <div className='project-home-text'>\r\n        <div className='col-xxl-8 col-lg-9 col-sm-11 col-10 project-auto'>\r\n          <YouTubePlayer\r\n            className='youtube-player'\r\n            url={process.env.REACT_APP_YOUTUBE_URL}\r\n            width='100%'\r\n            // height='500px'\r\n            controls={true}\r\n          />\r\n        </div>\r\n      </div>\r\n      <ProjectContent />\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {ProjectsWrapper}\r\n","import React, {FC} from 'react'\r\nimport { useIntl } from 'react-intl'\r\nimport './aboutUs.scss'\r\n\r\nconst AboutUsWrapper: FC = () => {\r\n  const intl = useIntl()\r\n  return (\r\n    <>\r\n      <div className='project-teams d-flex'>\r\n        <div className='col-xxl-6'>\r\n          <div className='d-flex flex-wrap'>\r\n            {/* <div className='col-xxl-6 col-lg-6 col-sm-6 col-6  project-teams-hover-img'>\r\n              <img\r\n                src='assets/images/Home-page/img_07.jpg'\r\n                className='w-100' alt=\"We also work as blended teams\"\r\n              />\r\n            </div> */}\r\n            <div className='col-xxl-6 col-lg-6 col-sm-6 col-6 project-teams-hover-img'>\r\n              <img alt=\"projects-of-blueskytech\"\r\n                src='media/images/home-page/img_07_1.jpg'\r\n                className='w-100 h-100 object-fit-img'\r\n              />\r\n            </div>\r\n            <div className='col-xxl-6 col-lg-6 col-sm-6 col-6 project-teams-hover-img'>\r\n              <img alt=\"projects-of-blueskytech\"\r\n                 src='media/images/home-page/img_07_2.jpg'\r\n                className='w-100 h-100 object-fit-img'\r\n              />\r\n            </div>\r\n            <div className='col-xxl-6 col-lg-6 col-sm-6 col-6 project-teams-hover-img'>\r\n              <img alt=\"projects-of-blueskytech\"\r\n                     src='media/images/home-page/img_07_3.jpg'\r\n                className='w-100 h-100 object-fit-img'\r\n              />\r\n            </div>\r\n            <div className='col-xxl-6 col-lg-6 col-sm-6 col-6 project-teams-hover-img'>\r\n              <img alt=\"projects-of-blueskytech\"\r\n               src='media/images/home-page/img_07_4.jpg'\r\n                className='w-100 h-100 object-fit-img'\r\n              />\r\n            </div>\r\n          </div>\r\n        </div>\r\n        {/* text */}\r\n        <div className='col-xxl-6 color-text-right'>\r\n          <h2 className='text-white'>{intl.formatMessage({ id: 'ABOUTUS.NAME' })}</h2>\r\n          <div className='col-xl-10 project-teams-span-padding'>\r\n            <span className='text-white'>\r\n            {intl.formatMessage({ id: 'ABOUTUS.DESC' })}\r\n            </span>\r\n          </div>\r\n          <div className='d-flex align-items-end'>\r\n            <div>\r\n              <a href='about' className='fs-6 text-start text-white '>\r\n              {intl.formatMessage({ id: 'ABOUTUS.EXPLOREMORE' })}\r\n              </a>\r\n            </div>\r\n            <div className='line-width-icon-2 justify-content-end'>\r\n              <i className='arrow right-icon-2'></i>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div> \r\n    </>\r\n  )\r\n}\r\n\r\nexport {AboutUsWrapper}\r\n","import React, { FC } from 'react'\r\nimport { useIntl } from 'react-intl'\r\nimport Slider from 'react-slick'\r\nimport 'slick-carousel/slick/slick-theme.css'\r\n// import'./slick.js';\r\nimport 'slick-carousel/slick/slick.css'\r\nimport './clients.scss'\r\n\r\nconst ClientsWrapper: FC = () => {\r\n  const intl = useIntl()\r\n  var settings = {\r\n    dots: true,\r\n    infinite: false,\r\n    rows: 2,\r\n    slidesToShow: 4,\r\n    slidesToScroll: 4,\r\n    // initialSlide: 4,\r\n    arrows: false,\r\n    speed: 1000,\r\n    responsive: [\r\n      {\r\n        breakpoint: 1025,\r\n        settings: {\r\n          slidesToShow: 3.2,\r\n          slidesToScroll: 3,\r\n          slidesToclick: 2,\r\n          infinite: true,\r\n          dots: true,\r\n        },\r\n      },\r\n      {\r\n        breakpoint: 768,\r\n        settings: {\r\n          slidesToShow: 2.5,\r\n          slidesToScroll: 3,\r\n          initialSlide: 2,\r\n          Swipe: true,\r\n        },\r\n      },\r\n      {\r\n        breakpoint: 600,\r\n        settings: {\r\n          slidesToShow: 2.2,\r\n          slidesToScroll: 3,\r\n          initialSlide: 2,\r\n        },\r\n      },\r\n      {\r\n        breakpoint: 480,\r\n        settings: {\r\n          slidesToShow: 1.5,\r\n          slidesToScroll: 1.2,\r\n          dots: false,\r\n        },\r\n      },\r\n      {\r\n        breakpoint: 360,\r\n        settings: {\r\n          slidesToShow: 1.2,\r\n          slidesToScroll: 1.2,\r\n          dots: false,\r\n        },\r\n      },\r\n      {\r\n        breakpoint: 280,\r\n        settings: {\r\n          slidesToShow: 1.2,\r\n          slidesToScroll: 1.2,\r\n        },\r\n      },\r\n    ],\r\n  }\r\n  return (\r\n    <>\r\n      {/* We are trusted by... */}\r\n      <div className='project-trusted'>\r\n        <div className='container'>\r\n          <h2>{intl.formatMessage({ id: 'CLIENTS.TRUSTED' })}</h2>\r\n          <div className='col-xxl-7'>\r\n            <p>\r\n              {intl.formatMessage({ id: 'CLIENTS.TRUSTED.CONTENT' })}\r\n            </p>\r\n          </div>\r\n          <div className='row padding-project-trusted'>\r\n            <Slider {...settings}>\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-123bay.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-property24.vn.svg\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>  \r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-phamngocthachct.edu.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-123bay.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-property24.vn.svg\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              \r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-phamngocthachct.edu.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-123bay.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-property24.vn.svg\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n             \r\n            \r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-phamngocthachct.edu.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-123bay.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-property24.vn.svg\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>              \r\n              \r\n              {/*  */}\r\n              <div className='col-xxl-3'>\r\n                <button className='project-trusted-button'>\r\n                  <img src=\"media/images/logo/logo-phamngocthachct.edu.vn.png\" alt=\"\" />\r\n                </button>\r\n                <div className='trusted-hover-buttom fw-bolder d-flex'>\r\n                  <a href='./project-detail'>{intl.formatMessage({ id: 'CLIENTS.TRUSTED.SHOWCASE' })}</a>\r\n                  <div className='line-width-icon-3 '>\r\n                    <i className='arrow right-icon-3'></i>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </Slider>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </>\r\n  )\r\n}\r\n\r\nexport { ClientsWrapper }\r\n\r\n","import React, {FC} from 'react'\r\nimport './index.scss'\r\n\r\ninterface Article {\r\n  img?: string\r\n  date?: string\r\n  type?: string\r\n  title?: string\r\n  height?: number\r\n}\r\n\r\nconst Item: FC<Article> = (props: Article) => {\r\n  return (\r\n    <div className='item' style={{height: props.height}}>\r\n      <div className='content'>\r\n        <div className='time'>\r\n          {props.type} • {props.date}\r\n        </div>\r\n        <div className='title'>{props.title}</div>\r\n      </div>\r\n      <div className='background' id='background'>\r\n        <img alt='projects-of-blueskytech' src={props.img} />\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {Item}\r\n","import {FC, useEffect, useState} from 'react'\r\nimport {Col, Row} from 'react-bootstrap-v5'\r\nimport {useIntl} from 'react-intl'\r\nimport {Link} from 'react-router-dom'\r\nimport {IInsight, Insights} from '../../../../../assets/InsightData'\r\nimport {transferTitleToAlias} from '../../../../common/utilities'\r\nimport './insights.scss'\r\nimport {Item} from './items/index'\r\n\r\nconst InsightsWrapper: FC = () => {\r\n  const intl = useIntl()\r\n  const currentLang = intl.locale\r\n\r\n  const [sizeLeft, setSizeLeft] = useState(150)\r\n  const [sizeRight, setSizeRight] = useState(150)\r\n\r\n  const [insightData, setInsightData] = useState<IInsight[]>([])\r\n  const [highlightInsight, setHighlightInsight] = useState<IInsight>()\r\n  const [normalInsight, setNormalInsight] = useState<IInsight[]>([])\r\n\r\n  const dashboardInsigt =\r\n    Insights.filter((x) => x.languageCode === currentLang)\r\n      ?.sort((a, b) => (a.id > b.id ? 1 : -1))\r\n      ?.slice(0, 5) || []\r\n\r\n  useEffect(() => {\r\n    if ((intl.locale || intl.locale !== '') && insightData.length > 0) {\r\n      const ins = insightData.filter((x) => x.languageCode === intl.locale) || []\r\n      if (ins.length > 0) {\r\n        setHighlightInsight(ins.shift()) // expect an object\r\n        setNormalInsight(ins) // rest items will be in array\r\n      }\r\n    }\r\n  }, [intl.locale, insightData])\r\n\r\n  useEffect(() => {\r\n    setInsightData(dashboardInsigt)\r\n    // only execute all the code below in client side\r\n    if (typeof window !== undefined) {\r\n      // Handler to call on window resize\r\n      const handleResize = () => {\r\n        if (window.innerWidth > 768) {\r\n          setSizeLeft(600)\r\n          setSizeRight(286)\r\n        } else {\r\n          setSizeLeft(200)\r\n          setSizeRight(200)\r\n        }\r\n      }\r\n\r\n      // Add event listener\r\n      window.addEventListener('resize', handleResize)\r\n\r\n      // Call handler right away so state gets updated with initial window size\r\n      handleResize()\r\n\r\n      // Remove event listener on cleanup\r\n      return () => window.removeEventListener('resize', handleResize)\r\n    }\r\n  }, [])\r\n\r\n  return (\r\n    <div className='insights'>\r\n      <div className='container'>\r\n        <div className='title'>Insights</div>\r\n        <Row className='content'>\r\n          <Col sm={12} lg={4} className='left'>\r\n            {highlightInsight && (\r\n              <Link\r\n                to={`insights/${transferTitleToAlias(highlightInsight.title)}_${\r\n                  highlightInsight.uniquePostKey\r\n                }.html`}\r\n              >\r\n                <Item\r\n                  img={highlightInsight.thumbnail}\r\n                  date={highlightInsight.date}\r\n                  height={sizeLeft}\r\n                  title={highlightInsight.name}\r\n                  type={highlightInsight.type}\r\n                />\r\n              </Link>\r\n            )}\r\n          </Col>\r\n          <Col sm={12} lg={8} className='right '>\r\n            <Row className='items'>\r\n              {normalInsight.length > 0 &&\r\n                normalInsight.map((item, index) => {\r\n                  if (index < 2) {\r\n                    return (\r\n                      <Col\r\n                        key={item.id}\r\n                        sm={6}\r\n                        lg={6}\r\n                        className='col-6 col-mobile'\r\n                        style={{paddingBottom: 'calc(1.5rem * .5)'}}\r\n                      >\r\n                        <Link\r\n                          to={`insights/${transferTitleToAlias(item.title)}_${\r\n                            item.uniquePostKey\r\n                          }.html`}\r\n                        >\r\n                          <Item\r\n                            img={item.thumbnail}\r\n                            date={item.date}\r\n                            height={sizeRight}\r\n                            title={item.name}\r\n                            type={item.type}\r\n                          />\r\n                        </Link>\r\n                      </Col>\r\n                    )\r\n                  } else if (index >= 2 && index < 4) {\r\n                    return (\r\n                      <Col\r\n                        key={item.id}\r\n                        sm={6}\r\n                        lg={6}\r\n                        className='col-6 col-mobile'\r\n                        style={{paddingTop: 'calc(1.5rem * .5)'}}\r\n                      >\r\n                        <Link\r\n                          to={`insights/${transferTitleToAlias(item.title)}_${\r\n                            item.uniquePostKey\r\n                          }.html`}\r\n                        >\r\n                          <Item\r\n                            img={item.thumbnail}\r\n                            date={item.date}\r\n                            height={sizeRight}\r\n                            title={item.name}\r\n                            type={item.type}\r\n                          />\r\n                        </Link>\r\n                      </Col>\r\n                    )\r\n                  }\r\n                  return false\r\n                })}\r\n            </Row>\r\n          </Col>\r\n        </Row>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {InsightsWrapper}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, {FC} from 'react'\r\nimport {useIntl} from 'react-intl'\r\nimport {PageTitle} from '../../../_metronic/layout/core'\r\nimport {BannerWrapper} from './components/Banner/Banner'\r\nimport ServicesWrapper from '../services/Services'\r\nimport {ProjectsWrapper} from './components/Projects/Project'\r\nimport {AboutUsWrapper} from './components/AboutUs/AboutUs'\r\nimport {ClientsWrapper} from './components/Clients/Clients'\r\nimport {InsightsWrapper} from './components/Insights/Insights'\r\n\r\nconst DashboardPage: FC = () => (\r\n  <>\r\n    {/* begin::Row */}\r\n    <BannerWrapper />\r\n    {/* end::Row */}\r\n\r\n    {/* begin::Row */}\r\n    <ServicesWrapper isHome />\r\n    {/* end::Row */}\r\n\r\n    {/* begin::Row */}\r\n    <ProjectsWrapper />\r\n    {/* end::Row */}\r\n\r\n    {/* begin::Row */}\r\n    <AboutUsWrapper />\r\n    {/* end::Row */}\r\n\r\n    {/* begin::Row */}\r\n    <ClientsWrapper />\r\n    {/* end::Row */}\r\n\r\n    {/* begin::Row */}\r\n    <InsightsWrapper />\r\n    {/* end::Row */}\r\n  </>\r\n)\r\n\r\nconst DashboardWrapper: FC = () => {\r\n  const intl = useIntl()\r\n  return (\r\n    <>\r\n      <PageTitle breadcrumbs={[]}>{intl.formatMessage({id: 'MENU.DASHBOARD'})}</PageTitle>\r\n      <DashboardPage />\r\n    </>\r\n  )\r\n}\r\n\r\nexport {DashboardWrapper}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport { FC } from 'react'\r\n\r\nconst MenuTestPage: FC = () => {\r\n  return (\r\n    <div className='row'>\r\n      {/* <div className='card card-custom'>\r\n        <div className='card-body p-9'>\r\n          <div className='d-flex align-items-stretch mb-20'>\r\n            <div\r\n              className='header-menu align-items-stretch'\r\n              data-kt-drawer='true'\r\n              data-kt-drawer-name='header-menu'\r\n              data-kt-drawer-activate='{default: true, lg: false}'\r\n              data-kt-drawer-overlay='true'\r\n              data-kt-drawer-width=\"{default:'200px', '300px': '250px'}\"\r\n              data-kt-drawer-direction='start'\r\n              data-kt-drawer-toggle='#kt_header_menu_toggle'\r\n            >\r\n              <div\r\n                className='menu menu-lg-rounded menu-column menu-lg-row menu-state-bg menu-title-gray-700 menu-state-title-primary menu-state-icon-primary menu-state-bullet-primary menu-arrow-gray-400 fw-bold my-5 my-lg-0 align-items-stretch'\r\n                id='#kt_header_menu'\r\n                data-kt-menu='true'\r\n              >\r\n                <div className='menu-item me-lg-2'>\r\n                  <a\r\n                    className='menu-link active py-3'\r\n                    href='/keenthemes/products/themes/start/html/demo2/dist/?page=index'\r\n                  >\r\n                    <span className='menu-title'>Dashboard</span>\r\n                  </a>\r\n                </div>\r\n                <div\r\n                  data-kt-menu-trigger='click'\r\n                  data-kt-menu-placement='bottom-start'\r\n                  className='menu-item me-lg-2'\r\n                >\r\n                  <span className='menu-link py-3'>\r\n                    <span className='menu-title'>Pages</span>\r\n                    <span className='menu-arrow d-lg-none'></span>\r\n                  </span>\r\n                  <div\r\n                    className='menu-sub menu-sub-lg-down-accordion menu-sub-lg-dropdown menu-rounded-0 py-lg-4 w-100 w-lg-225px'\r\n                    style={{margin: '0px'}}\r\n                  >\r\n                    <div\r\n                      data-kt-menu-trigger='click'\r\n                      data-kt-menu-placement='right-start'\r\n                      className='menu-item'\r\n                    >\r\n                      <span className='menu-link py-3'>\r\n                        <span className='menu-icon'>\r\n                          <span className='svg-icon'>\r\n                            <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                          </span>\r\n                        </span>\r\n                        <span className='menu-title'>Profile</span>\r\n                        <span className='menu-arrow'></span>\r\n                      </span>\r\n                      <div\r\n                        className='menu-sub menu-sub-accordion menu-sub-lg-dropdown menu-active-bg py-4 w-100 w-lg-225px'\r\n                        style={{margin: '0px'}}\r\n                      >\r\n                        <div className='menu-item'>\r\n                          <span className='menu-link py-3'>\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Overview</span>\r\n                          </span>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/projects'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Projects</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/campaigns'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Campaigns</span>\r\n                          </a>\r\n                        </div>\r\n                        <div\r\n                          data-kt-menu-trigger='click'\r\n                          data-kt-menu-placement='right-start'\r\n                          className='menu-item'\r\n                        >\r\n                          <span className='menu-link py-3'>\r\n                            <span className='menu-icon'>\r\n                              <span className='svg-icon'>\r\n                                <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                              </span>\r\n                            </span>\r\n                            <span className='menu-title'>Profile -</span>\r\n                            <span className='menu-arrow'></span>\r\n                          </span>\r\n                          <div className='menu-sub menu-sub-accordion menu-sub-lg-dropdown menu-active-bg py-4 w-100 w-lg-225px'>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/overview'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Overview</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/projects'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Projects</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/campaigns'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Campaigns</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/documents'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Documents</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/followers'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Followers</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/activity'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Activity</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/dashboard'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Dashboard</span>\r\n                              </a>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/documents'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Documents</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/followers'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Followers</span>\r\n                          </a>\r\n                        </div>\r\n                        <div\r\n                          data-kt-menu-trigger='hover'\r\n                          data-kt-menu-placement='right-start'\r\n                          className='menu-item'\r\n                        >\r\n                          <span className='menu-link py-3'>\r\n                            <span className='menu-icon'>\r\n                              <span className='svg-icon'>\r\n                                <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                              </span>\r\n                            </span>\r\n                            <span className='menu-title'>Profile -</span>\r\n                            <span className='menu-arrow'></span>\r\n                          </span>\r\n                          <div className='menu-sub menu-sub-accordion menu-sub-lg-dropdown menu-active-bg py-4 w-100 w-lg-225px'>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/overview'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Overview</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/projects'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Projects</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/campaigns'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Campaigns</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/documents'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Documents</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/followers'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Followers</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/activity'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Activity</span>\r\n                              </a>\r\n                            </div>\r\n                            <div className='menu-item'>\r\n                              <a\r\n                                className='menu-link py-3'\r\n                                href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/dashboard'\r\n                              >\r\n                                <span className='menu-bullet'>\r\n                                  <span className='bullet bullet-dot'></span>\r\n                                </span>\r\n                                <span className='menu-title'>Dashboard</span>\r\n                              </a>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/activity'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Activity</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/dashboard'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Dashboard</span>\r\n                          </a>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div\r\n                      data-kt-menu-trigger='click'\r\n                      data-kt-menu-placement='right-start'\r\n                      className='menu-item'\r\n                    >\r\n                      <span className='menu-link py-3'>\r\n                        <span className='menu-icon'>\r\n                          <span className='svg-icon'>\r\n                            <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                          </span>\r\n                        </span>\r\n                        <span className='menu-title'>Projects</span>\r\n                        <span className='menu-arrow'></span>\r\n                      </span>\r\n                      <div className='menu-sub menu-sub-accordion menu-sub-lg-dropdown py-4 w-100 w-lg-225px'>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/overview'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Overview</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/lists'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Lists</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/activity'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Activity</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/files'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Files</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/users'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Users</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/targets'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Targets</span>\r\n                          </a>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div data-kt-menu-trigger='click' className='menu-item'>\r\n                      <span className='menu-link py-3'>\r\n                        <span className='menu-icon'>\r\n                          <span className='svg-icon'>\r\n                            <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                          </span>\r\n                        </span>\r\n                        <span className='menu-title'>Wizards</span>\r\n                        <span className='menu-arrow'></span>\r\n                      </span>\r\n                      <div className='menu-sub menu-sub-accordion'>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/wizards/wizard-vertical'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Wizard Vertical</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/wizards/wizard-horizontal'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Wizard Horizontal</span>\r\n                          </a>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div data-kt-menu-trigger='click' className='menu-item'>\r\n                      <span className='menu-link py-3'>\r\n                        <span className='menu-icon'>\r\n                          <span className='svg-icon'>\r\n                            <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                          </span>\r\n                        </span>\r\n                        <span className='menu-title'>Search</span>\r\n                        <span className='menu-arrow'></span>\r\n                      </span>\r\n                      <div className='menu-sub menu-sub-accordion'>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/search/search-horizontal'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Search Horizontal</span>\r\n                          </a>\r\n                        </div>\r\n                        <div className='menu-item'>\r\n                          <a\r\n                            className='menu-link py-3'\r\n                            href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/search/search-vertical'\r\n                          >\r\n                            <span className='menu-bullet'>\r\n                              <span className='bullet bullet-dot'></span>\r\n                            </span>\r\n                            <span className='menu-title'>Search Vertical</span>\r\n                          </a>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <div\r\n                  data-kt-menu-trigger='click'\r\n                  data-kt-menu-placement='bottom-start'\r\n                  className='menu-item me-lg-2'\r\n                >\r\n                  <span className='menu-link py-3'>\r\n                    <span className='menu-title'>Resources</span>\r\n                    <span className='menu-arrow d-lg-none'></span>\r\n                  </span>\r\n                  <div\r\n                    className='menu-sub menu-sub-lg-down-accordion menu-sub-lg-dropdown menu-rounded-0 py-lg-4 w-100 w-lg-225px'\r\n                    style={{margin: '0px'}}\r\n                  >\r\n                    <div className='menu-item'>\r\n                      <a\r\n                        className='menu-link py-3'\r\n                        href='/keenthemes/products/themes/start/html/demo2/dist/?page=documentation/getting-started'\r\n                      >\r\n                        <span className='menu-icon'>\r\n                          <span className='svg-icon svg-icon-1'>\r\n                            <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                          </span>\r\n                        </span>\r\n                        <span className='menu-title'>Documentation</span>\r\n                      </a>\r\n                    </div>\r\n                    <div className='menu-item'>\r\n                      <a\r\n                        className='menu-link py-3'\r\n                        href='/keenthemes/products/themes/start/html/demo2/dist/?page=layout-builder'\r\n                      >\r\n                        <span className='menu-icon'>\r\n                          <span className='svg-icon svg-icon-1'>\r\n                            <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                          </span>\r\n                        </span>\r\n                        <span className='menu-title'>Layout Builder</span>\r\n                      </a>\r\n                    </div>\r\n                    <div className='menu-item'>\r\n                      <a\r\n                        className='menu-link py-3'\r\n                        href='/keenthemes/products/themes/start/html/demo2/dist/?page=documentation/getting-started/changelog'\r\n                      >\r\n                        <span className='menu-icon'>\r\n                          <span className='svg-icon svg-icon-1'>\r\n                            <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                          </span>\r\n                        </span>\r\n                        <span className='menu-title'>Changelog</span>\r\n                      </a>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <div\r\n                  data-kt-menu-trigger='click'\r\n                  data-kt-menu-placement='bottom-start'\r\n                  className='menu-item me-lg-2'\r\n                >\r\n                  <span className='menu-link py-3'>\r\n                    <span className='menu-title'>Mega Menu</span>\r\n                    <span className='menu-arrow d-lg-none'></span>\r\n                  </span>\r\n                  <div\r\n                    className='menu-sub menu-sub-lg-down-accordion menu-sub-lg-dropdown w-100 w-lg-600px p-5 p-lg-5'\r\n                    style={{margin: '0px'}}\r\n                  >\r\n                    <div className='row' data-kt-menu-dismiss='true'>\r\n                      <div className='col-lg-4 border-left-lg-1'>\r\n                        <div className='menu-inline menu-column menu-active-bg'>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                      <div className='col-lg-4'>\r\n                        <div className='menu-inline menu-column menu-active-bg'>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                          <div className='menu-item'>\r\n                            <a href='#' className='menu-link'>\r\n                              <span className='menu-bullet'>\r\n                                <span className='bullet bullet-dot'></span>\r\n                              </span>\r\n                              <span className='menu-title'>Example link</span>\r\n                            </a>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                      <div className='col-lg-4'>\r\n                        It is a long established fact that a reader will be distracted by the\r\n                        readable content of a page when looking at its layout. The point of using\r\n                        Lorem Ipsum is that it has a more-or-less normal distribution of letters, as\r\n                        opposed to using 'Content here, content here', making it look like readable\r\n                        English.\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <div className='mb-20 w-200px'>\r\n            <div\r\n              className='d-flex align-items-center ms-1 ms-lg-3'\r\n              data-kt-menu-target='#kt_header_search_menu'\r\n              data-kt-menu-trigger='click'\r\n              data-kt-menu-permanent='true'\r\n              data-kt-menu-placement='bottom-start'\r\n            >\r\n              <div className='btn btn-icon btn-active-light-primary w-30px h-30px w-lg-40px h-lg-40px'>\r\n                <span className='svg-icon svg-icon-2 svg-icon-lg-1'>\r\n                  <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <div\r\n              className='menu menu-sub menu-sub-dropdown w-250px w-lg-300px px-7 py-5'\r\n              data-kt-menu='true'\r\n              id='kt_header_search_menu'\r\n              style={{margin: '0px'}}\r\n            >\r\n              <div\r\n                id='kt_header_search'\r\n                data-kt-search-keypress='true'\r\n                data-kt-search-min-length='3'\r\n                data-kt-search-enter='enter'\r\n                data-kt-search-mode='inline'\r\n                data-kt-search-input-focus='true'\r\n                data-kt-search-trigger='#kt_header_search_trigger'\r\n                data-kt-search-input='#kt_header_search_input'\r\n                data-kt-search-spinner='#kt_header_search_spinner'\r\n                data-kt-search-clear='#kt_header_search_clear'\r\n                data-kt-search-results='#kt_header_search_results'\r\n                data-kt-search-suggestions='#kt_header_search_suggestions'\r\n                data-kt-search-empty='#kt_header_search_empty'\r\n              >\r\n                <div className='position-relative'>\r\n                  <span className='svg-icon svg-icon-1 svg-icon-gray-500 position-absolute top-50 translate-middle-y ms-0'>\r\n                    <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                  </span>\r\n                  <input\r\n                    type='text'\r\n                    className='form-control form-control-flush ps-10'\r\n                    name='search'\r\n                    value=''\r\n                    placeholder='Search...'\r\n                    id='kt_header_search_input'\r\n                    onChange={() => {}}\r\n                  />\r\n                  <span\r\n                    className='position-absolute top-50 end-0 translate-middle-y lh-0 d-none me-1'\r\n                    id='kt_header_search_spinner'\r\n                  >\r\n                    <span className='spinner-border h-15px w-15px align-middle text-gray-400'></span>\r\n                  </span>\r\n                  <span\r\n                    className='btn btn-flush btn-active-color-primary position-absolute top-50 end-0 translate-middle-y lh-0 d-none'\r\n                    id='kt_header_search_clear'\r\n                  >\r\n                    <span className='svg-icon svg-icon-1 me-0'>\r\n                      <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                    </span>\r\n                  </span>\r\n                </div>\r\n                <div id='kt_header_search_results' className='d-none'></div>\r\n\r\n                <div id='kt_header_search_suggestions'>Suggestions</div>\r\n                <div id='kt_header_search_empty' className='d-none'>\r\n                  Sorry, no results found\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <div className='w-250px bg-light rounded py-5'>\r\n            <div\r\n              className='menu menu-column menu-title-gray-700 menu-state-title-primary menu-state-icon-primary menu-state-bullet-primary menu-arrow-gray-500'\r\n              id='#kt_aside_menu'\r\n              data-kt-menu='true'\r\n            >\r\n              <div className='menu-item'>\r\n                <a\r\n                  className='menu-link active'\r\n                  href='/keenthemes/products/themes/start/html/demo2/dist/?page=index'\r\n                >\r\n                  <span className='menu-icon'>\r\n                    <span className='svg-icon svg-icon-1'>\r\n                      <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                    </span>\r\n                  </span>\r\n                  <span className='menu-title'>Dashboard</span>\r\n                </a>\r\n              </div>\r\n              <div className='menu-item pt-5'>\r\n                <div className='menu-content'>\r\n                  <span className='menu-section text-muted text-uppercase fs-8'>Custom</span>\r\n                </div>\r\n              </div>\r\n              <div data-kt-menu-trigger='click' className='menu-item'>\r\n                <span className='menu-link'>\r\n                  <span className='menu-icon'>\r\n                    <span className='svg-icon svg-icon-1'>\r\n                      <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                    </span>\r\n                  </span>\r\n                  <span className='menu-title'>Pages</span>\r\n                  <span className='menu-arrow'></span>\r\n                </span>\r\n                <div className='menu-sub menu-sub-accordion menu-active-bg'>\r\n                  <div\r\n                    data-kt-menu-trigger='click'\r\n                    data-kt-menu-placement='right-start'\r\n                    data-kt-menu-overflow='true'\r\n                    className='menu-item'\r\n                  >\r\n                    <span className='menu-link'>\r\n                      <span className='menu-bullet'>\r\n                        <span className='bullet bullet-dot'></span>\r\n                      </span>\r\n                      <span className='menu-title'>Profile</span>\r\n                      <span className='menu-arrow'></span>\r\n                    </span>\r\n                    <div className='menu-sub menu-sub-dropdown w-200px menu-active-bg menu-title-gray-700 menu-state-title-primary menu-state-icon-primary menu-state-bullet-primary menu-arrow-gray-500'>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/overview'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Overview</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/projects'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Projects</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/campaigns'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Campaigns</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/documents'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Documents</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/followers'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Followers</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/activity'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Activity</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/profile/dashboard'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Dashboard</span>\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div data-kt-menu-trigger='click' className='menu-item'>\r\n                    <span className='menu-link'>\r\n                      <span className='menu-bullet'>\r\n                        <span className='bullet bullet-dot'></span>\r\n                      </span>\r\n                      <span className='menu-title'>Projects</span>\r\n                      <span className='menu-arrow'></span>\r\n                    </span>\r\n                    <div className='menu-sub menu-sub-accordion menu-active-bg'>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/overview'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Overview</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/lists'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Lists</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/activity'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Activity</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/files'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Files</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/users'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Users</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/projects/targets'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Targets</span>\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div data-kt-menu-trigger='click' className='menu-item'>\r\n                    <span className='menu-link'>\r\n                      <span className='menu-bullet'>\r\n                        <span className='bullet bullet-dot'></span>\r\n                      </span>\r\n                      <span className='menu-title'>Wizards</span>\r\n                      <span className='menu-arrow'></span>\r\n                    </span>\r\n                    <div className='menu-sub menu-sub-accordion menu-active-bg'>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/wizards/wizard-vertical'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Wizard Vertical</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/wizards/wizard-horizontal'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Wizard Horizontal</span>\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div data-kt-menu-trigger='click' className='menu-item'>\r\n                    <span className='menu-link'>\r\n                      <span className='menu-bullet'>\r\n                        <span className='bullet bullet-dot'></span>\r\n                      </span>\r\n                      <span className='menu-title'>Search</span>\r\n                      <span className='menu-arrow'></span>\r\n                    </span>\r\n                    <div className='menu-sub menu-sub-accordion menu-active-bg'>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/search/search-horizontal'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Search Horizontal</span>\r\n                        </a>\r\n                      </div>\r\n                      <div className='menu-item'>\r\n                        <a\r\n                          className='menu-link'\r\n                          href='/keenthemes/products/themes/start/html/demo2/dist/?page=pages/search/search-vertical'\r\n                        >\r\n                          <span className='menu-bullet'>\r\n                            <span className='bullet bullet-dot'></span>\r\n                          </span>\r\n                          <span className='menu-title'>Search Vertical</span>\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              <div className='menu-item'>\r\n                <div className='menu-content'>\r\n                  <div className='separator mx-1 my-4 opacity-10'></div>\r\n                </div>\r\n              </div>\r\n              <div className='menu-item'>\r\n                <a\r\n                  className='menu-link'\r\n                  href='/keenthemes/products/themes/start/html/demo2/dist/?page=documentation/getting-started'\r\n                >\r\n                  <span className='menu-icon'>\r\n                    <span className='svg-icon svg-icon-1'>\r\n                      <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                    </span>\r\n                  </span>\r\n                  <span className='menu-title'>Documentation</span>\r\n                </a>\r\n              </div>\r\n              <div className='menu-item'>\r\n                <a\r\n                  className='menu-link'\r\n                  href='/keenthemes/products/themes/start/html/demo2/dist/?page=layout-builder'\r\n                >\r\n                  <span className='menu-icon'>\r\n                    <span className='svg-icon svg-icon-1'>\r\n                      <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                    </span>{' '}\r\n                  </span>\r\n                  <span className='menu-title'>Layout Builder</span>\r\n                </a>\r\n              </div>\r\n              <div className='menu-item'>\r\n                <a\r\n                  className='menu-link'\r\n                  href='/keenthemes/products/themes/start/html/demo2/dist/?page=documentation/getting-started/changelog'\r\n                >\r\n                  <span className='menu-icon'>\r\n                    <span className='svg-icon svg-icon-1'>\r\n                      <SVG src={toAbsoluteUrl('/media/logos/logo-compact.svg')} />\r\n                    </span>\r\n                  </span>\r\n                  <span className='menu-title'>Changelog</span>\r\n                </a>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div> */}\r\n    </div>\r\n  )\r\n}\r\n\r\nexport { MenuTestPage }\r\n\r\n","import React, {Suspense, lazy} from 'react'\r\nimport {Redirect, Route, Switch} from 'react-router-dom'\r\nimport {FallbackView} from '../../_metronic/partials'\r\nimport {DashboardWrapper} from '../pages/dashboard/DashboardWrapper'\r\nimport {MenuTestPage} from '../pages/MenuTestPage'\r\n\r\nexport function PrivateRoutes() {\r\n  const BuilderPageWrapper = lazy(() => import('../pages/layout-builder/BuilderPageWrapper'))\r\n  const AboutWrapper = lazy(() => import('../pages/about-us/About'))\r\n  const InsightsWrapper = lazy(() => import('../pages/insights/index'))\r\n  const ProjectsPageWrapper = lazy(() => import('../pages/projects/ProjectsPageWrapper'))\r\n  const ProjectDetailPage = lazy(() => import('../pages/projects/ProjectDetailPage'))\r\n  const ServicesWrapper = lazy(() => import('../pages/services/Services'))\r\n  const ProductDesignServiceWrapper = lazy(() => import('../pages/services/ProductDesignService'))\r\n  const SoftwareDevelopmentService = lazy(\r\n    () => import('../pages/services/SoftwareDevelopmentService')\r\n  )\r\n  const ERPService = lazy(() => import('../pages/services/ERPService'))\r\n  const CareersPageWrapper = lazy(() => import('../pages/careers/CareersPageWrapper'))\r\n  const ProfilePage = lazy(() => import('../modules/profile/ProfilePage'))\r\n  const WizardsPage = lazy(() => import('../modules/wizards/WizardsPage'))\r\n  const AccountPage = lazy(() => import('../modules/accounts/AccountPage'))\r\n  const WidgetsPage = lazy(() => import('../modules/widgets/WidgetsPage'))\r\n  const ChatPage = lazy(() => import('../modules/apps/chat/ChatPage'))\r\n  const Contact = lazy(() => import('../pages/contact/contact'))\r\n\r\n  return (\r\n    <Suspense fallback={<FallbackView />}>\r\n      <Switch>\r\n        <Route path='/dashboard' component={DashboardWrapper} />\r\n        <Route path='/builder' component={BuilderPageWrapper} />\r\n        <Route path='/about' component={AboutWrapper} />\r\n        <Route path='/insights' component={InsightsWrapper} />\r\n        <Route path='/projects' component={ProjectsPageWrapper} />\r\n        <Route path='/project-detail/:alias' component={ProjectDetailPage} />\r\n        <Route path='/careers' component={CareersPageWrapper} />\r\n        <Route path='/services' component={ServicesWrapper} />\r\n        <Route path='/product-design' component={ProductDesignServiceWrapper} />\r\n        <Route path='/solutions-software-development' component={SoftwareDevelopmentService} />\r\n        <Route path='/erp-development' component={ERPService} />\r\n        <Route path='/crafted/pages/profile' component={ProfilePage} />\r\n        <Route path='/crafted/pages/wizards' component={WizardsPage} />\r\n        <Route path='/crafted/widgets' component={WidgetsPage} />\r\n        <Route path='/crafted/account' component={AccountPage} />\r\n        <Route path='/apps/chat' component={ChatPage} />\r\n        <Route path='/menu-test' component={MenuTestPage} />\r\n        <Route path='/contact' component={Contact} />\r\n        <Redirect from='/auth' to='/dashboard' />\r\n        <Redirect exact from='/' to='/dashboard' />\r\n        <Redirect exact from='/index.html' to='/dashboard' />\r\n        <Redirect to='error/404' />\r\n      </Switch>\r\n    </Suspense>\r\n  )\r\n}\r\n","/**\r\n * High level router.\r\n *\r\n * Note: It's recommended to compose related routes in internal router\r\n * components (e.g: `src/app/modules/Auth/pages/AuthPage`, `src/app/BasePage`).\r\n */\r\n\r\nimport React, { FC } from 'react'\r\nimport { Route, Switch } from 'react-router-dom'\r\nimport { MasterLayout } from '../../_metronic/layout/MasterLayout'\r\nimport { Logout } from '../modules/auth'\r\nimport { ErrorsPage } from '../modules/errors/ErrorsPage'\r\nimport { PrivateRoutes } from './PrivateRoutes'\r\n\r\nconst Routes: FC = () => {\r\n  //const isAuthorized = useSelector<RootState>(({auth}) => auth.user, shallowEqual)\r\n\r\n  return (\r\n    <Switch>\r\n      {/* {!isAuthorized ? (\r\n        <Route>\r\n          <AuthPage />\r\n        </Route>\r\n      ) : (\r\n        <Redirect from='/auth' to='/' />\r\n      )} */}\r\n\r\n      <Route path='/error' component={ErrorsPage} />\r\n      <Route path='/logout' component={Logout} />\r\n\r\n      {/* {!isAuthorized ? (\r\n        <Redirect to='/auth/login' />\r\n      ) : ( */}\r\n        <MasterLayout>\r\n          <PrivateRoutes />\r\n        </MasterLayout>\r\n      {/* )} */}\r\n    </Switch>\r\n  )\r\n}\r\n\r\nexport { Routes }\r\n\r\n","import React, { Suspense } from 'react'\r\nimport { Helmet } from 'react-helmet'\r\nimport { BrowserRouter } from 'react-router-dom'\r\nimport { I18nProvider } from '../_metronic/i18n/i18nProvider'\r\nimport { LayoutProvider, LayoutSplashScreen } from '../_metronic/layout/core'\r\nimport AuthInit from './modules/auth/redux/AuthInit'\r\nimport { Routes } from './routing/Routes'\r\n\r\ntype Props = {\r\n  basename: string\r\n}\r\n\r\nconst App: React.FC<Props> = ({ basename }) => {\r\n  return (\r\n    <Suspense fallback={<LayoutSplashScreen />}>\r\n      <Helmet>\r\n        <link rel=\"canonical\" href={process.env.REACT_APP_OFFICAL_URL} />\r\n        <title>Technology for a better life | BlueSkyTech</title>\r\n        <meta name=\"description\"\r\n          content=\"BlueSkyTech is a company specializing in serving and building web applications, software on mobile and web platforms. In addition, we also offer digital transformation solutions for small and medium businesses.\" />\r\n        <meta name=\"keywords\" content=\"BlueSky, BlueSkyTech, Outsourcing, Freelancer, Software\" />\r\n\r\n        <meta property=\"og:title\" content=\"Technology for a better life | BlueSkyTech\" />\r\n        <meta property=\"og:description\"\r\n          content=\"BlueSkyTech is a company specializing in serving and building web applications, software on mobile and web platforms. In addition, we also offer digital transformation solutions for small and medium businesses.\" />\r\n        <meta property=\"og:image\" content=\"/media/images/common/thumbnail-seo-2.png\" />\r\n        <meta property=\"og:url\" content={process.env.REACT_APP_OFFICAL_URL} />\r\n        <meta property=\"og:site_name\" content=\"BlueSky Technology Vietnam\" />\r\n        <meta property=\"og:type\" content=\"website\" />\r\n        <meta property=\"og:locale\" content=\"vi_VN\" />\r\n      </Helmet>\r\n      <BrowserRouter basename={basename}>\r\n        <I18nProvider>\r\n          <LayoutProvider>\r\n            <AuthInit>\r\n              <Routes />\r\n            </AuthInit>\r\n          </LayoutProvider>\r\n        </I18nProvider>\r\n      </BrowserRouter>\r\n    </Suspense>\r\n  )\r\n}\r\n\r\nexport { App }\r\n","import {AxiosInstance} from 'axios'\r\nimport MockAdapter from 'axios-mock-adapter'\r\nimport {mockAuth} from '../../app/modules/auth'\r\n\r\nexport default function mockAxios(axios: AxiosInstance) {\r\n  const mock = new MockAdapter(axios, {delayResponse: 300})\r\n  mockAuth(mock)\r\n  return mock\r\n}\r\n","import MockAdapter from 'axios-mock-adapter'\r\nimport {UserModel} from '../models/UserModel'\r\nimport {\r\n  LOGIN_URL,\r\n  GET_USER_BY_ACCESSTOKEN_URL,\r\n  REGISTER_URL,\r\n  REQUEST_PASSWORD_URL,\r\n} from '../redux/AuthCRUD'\r\nimport {UsersTableMock} from './usersTableMock'\r\n\r\nexport function mockAuth(mock: MockAdapter) {\r\n  mock.onPost(LOGIN_URL).reply(({data}) => {\r\n    const {email, password} = JSON.parse(data)\r\n\r\n    if (email && password) {\r\n      const user = UsersTableMock.table.find(\r\n        (x) => x.email.toLowerCase() === email.toLowerCase() && x.password === password\r\n      )\r\n\r\n      if (user) {\r\n        const auth = user.auth\r\n        return [200, {...auth, password: undefined}]\r\n      }\r\n    }\r\n\r\n    return [400]\r\n  })\r\n\r\n  mock.onPost(REGISTER_URL).reply(({data}) => {\r\n    const {email, firstname, lastname, password} = JSON.parse(data)\r\n\r\n    if (email && firstname && lastname && password) {\r\n      const user: UserModel = {\r\n        id: generateUserId(),\r\n        email,\r\n        firstname,\r\n        lastname,\r\n        username: `${firstname}-${lastname}`,\r\n        password,\r\n        roles: [2], // Manager\r\n        auth: {\r\n          accessToken: 'access-token-' + Math.random(),\r\n          refreshToken: 'access-token-' + Math.random(),\r\n        },\r\n        pic: process.env.PUBLIC_URL + '/media/users/default.jpg',\r\n      }\r\n\r\n      UsersTableMock.table.push(user)\r\n      const auth = user.auth\r\n\r\n      return [200, {...auth, password: undefined}]\r\n    }\r\n\r\n    return [400]\r\n  })\r\n\r\n  mock.onPost(REQUEST_PASSWORD_URL).reply(({data}) => {\r\n    const {email} = JSON.parse(data)\r\n\r\n    if (email) {\r\n      const user = UsersTableMock.table.find((x) => x.email.toLowerCase() === email.toLowerCase())\r\n      let result = false\r\n      if (user) {\r\n        user.password = undefined\r\n        result = true\r\n        return [200, {result, password: undefined}]\r\n      }\r\n    }\r\n\r\n    return [400]\r\n  })\r\n\r\n  mock.onGet(GET_USER_BY_ACCESSTOKEN_URL).reply(({headers: {Authorization}}) => {\r\n    const accessToken =\r\n      Authorization && Authorization.startsWith('Bearer ') && Authorization.slice('Bearer '.length)\r\n\r\n    if (accessToken) {\r\n      const user = UsersTableMock.table.find((x) => x.auth?.accessToken === accessToken)\r\n\r\n      if (user) {\r\n        return [200, {...user, password: undefined}]\r\n      }\r\n    }\r\n\r\n    return [401]\r\n  })\r\n\r\n  function generateUserId(): number {\r\n    const ids = UsersTableMock.table.map((el) => el.id)\r\n    const maxId = Math.max(...ids)\r\n    return maxId + 1\r\n  }\r\n}\r\n","import React from 'react'\r\nimport ReactDOM from 'react-dom'\r\n// Redux\r\n// https://github.com/rt2zz/redux-persist\r\nimport {PersistGate} from 'redux-persist/integration/react'\r\nimport {Provider} from 'react-redux'\r\nimport * as _redux from './setup'\r\nimport store, {persistor} from './setup/redux/Store'\r\n// Axios\r\nimport axios from 'axios'\r\nimport {Chart, registerables} from 'chart.js'\r\n\r\n// Apps\r\nimport {App} from './app/App'\r\nimport ReactLightbox from 'simple-react-lightbox'\r\nimport {MetronicI18nProvider} from './_metronic/i18n/Metronici18n'\r\n/**\r\n * TIP: Replace this style import with dark styles to enable dark mode\r\n *\r\n * import './_metronic/assets/sass/style.dark.scss'\r\n *\r\n * TIP: Replace this style import with rtl styles to enable rtl mode\r\n *\r\n * import './_metronic/assets/css/style.rtl.css'\r\n **/\r\nimport './_metronic/assets/sass/style.scss'\r\nimport './_metronic/assets/sass/style.react.scss'\r\n/**\r\n * Base URL of the website.\r\n *\r\n * @see https://facebook.github.io/create-react-app/docs/using-the-public-folder\r\n */\r\nconst {PUBLIC_URL} = process.env\r\n/**\r\n * Creates `axios-mock-adapter` instance for provided `axios` instance, add\r\n * basic Metronic mocks and returns it.\r\n *\r\n * @see https://github.com/ctimmerm/axios-mock-adapter\r\n */\r\n\r\n/* const mock = */ _redux.mockAxios(axios)\r\n/**\r\n * Inject Metronic interceptors for axios.\r\n *\r\n * @see https://github.com/axios/axios#interceptors\r\n */\r\n_redux.setupAxios(axios, store)\r\n\r\nChart.register(...registerables)\r\n\r\nReactDOM.render(\r\n  <MetronicI18nProvider>\r\n    <Provider store={store}>\r\n      {/* Asynchronously persist redux stores and show `SplashScreen` while it's loading. */}\r\n      <PersistGate persistor={persistor} loading={<div>Loading...</div>}>\r\n        <ReactLightbox>\r\n          <App basename={PUBLIC_URL} />\r\n        </ReactLightbox>\r\n      </PersistGate>\r\n    </Provider>\r\n  </MetronicI18nProvider>,\r\n  document.getElementById('root')\r\n)\r\n","export default function setupAxios(axios: any, store: any) {\r\n  axios.interceptors.request.use(\r\n    (config: any) => {\r\n      const {\r\n        auth: {accessToken},\r\n      } = store.getState()\r\n\r\n      if (accessToken) {\r\n        config.headers.Authorization = `Bearer ${accessToken}`\r\n      }\r\n\r\n      return config\r\n    },\r\n    (err: any) => Promise.reject(err)\r\n  )\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from 'react'\r\n\r\nexport function Dropdown1() {\r\n  return (\r\n    <div className='menu menu-sub menu-sub-dropdown w-250px w-md-300px' data-kt-menu='true'>\r\n      <div className='px-7 py-5'>\r\n        <div className='fs-5 text-dark fw-bolder'>Filter Options</div>\r\n      </div>\r\n\r\n      <div className='separator border-gray-200'></div>\r\n\r\n      <div className='px-7 py-5'>\r\n        <div className='mb-10'>\r\n          <label className='form-label fw-bold'>Status:</label>\r\n\r\n          <div>\r\n            <select\r\n              className='form-select form-select-solid'\r\n              data-kt-select2='true'\r\n              data-placeholder='Select option'\r\n              data-allow-clear='true'\r\n              defaultValue={'1'}\r\n            >\r\n              <option></option>\r\n              <option value='1'>Approved</option>\r\n              <option value='2'>Pending</option>\r\n              <option value='3'>In Process</option>\r\n              <option value='4'>Rejected</option>\r\n            </select>\r\n          </div>\r\n        </div>\r\n\r\n        <div className='mb-10'>\r\n          <label className='form-label fw-bold'>Member Type:</label>\r\n\r\n          <div className='d-flex'>\r\n            <label className='form-check form-check-sm form-check-custom form-check-solid me-5'>\r\n              <input className='form-check-input' type='checkbox' value='1' />\r\n              <span className='form-check-label'>Author</span>\r\n            </label>\r\n\r\n            <label className='form-check form-check-sm form-check-custom form-check-solid'>\r\n              <input className='form-check-input' type='checkbox' value='2' defaultChecked={true} />\r\n              <span className='form-check-label'>Customer</span>\r\n            </label>\r\n          </div>\r\n        </div>\r\n\r\n        <div className='mb-10'>\r\n          <label className='form-label fw-bold'>Notifications:</label>\r\n\r\n          <div className='form-check form-switch form-switch-sm form-check-custom form-check-solid'>\r\n            <input\r\n              className='form-check-input'\r\n              type='checkbox'\r\n              value=''\r\n              name='notifications'\r\n              defaultChecked={true}\r\n            />\r\n            <label className='form-check-label'>Enabled</label>\r\n          </div>\r\n        </div>\r\n\r\n        <div className='d-flex justify-content-end'>\r\n          <button\r\n            type='reset'\r\n            className='btn btn-sm btn-white btn-active-light-primary me-2'\r\n            data-kt-menu-dismiss='true'\r\n          >\r\n            Reset\r\n          </button>\r\n\r\n          <button type='submit' className='btn btn-sm btn-primary' data-kt-menu-dismiss='true'>\r\n            Apply\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n","import axios from 'axios'\r\nimport {AuthModel} from '../models/AuthModel'\r\nimport {UserModel} from '../models/UserModel'\r\n\r\nconst API_URL = process.env.REACT_APP_API_URL || 'api'\r\n\r\nexport const GET_USER_BY_ACCESSTOKEN_URL = `${API_URL}/auth/get-user`\r\nexport const LOGIN_URL = `${API_URL}/auth/login`\r\nexport const REGISTER_URL = `${API_URL}/auth/register`\r\nexport const REQUEST_PASSWORD_URL = `${API_URL}/auth/forgot-password`\r\n\r\n// Server should return AuthModel\r\nexport function login(email: string, password: string) {\r\n  return axios.post(LOGIN_URL, {email, password})\r\n}\r\n\r\n// Server should return AuthModel\r\nexport function register(email: string, firstname: string, lastname: string, password: string) {\r\n  return axios.post<AuthModel>(REGISTER_URL, {\r\n    email,\r\n    firstname,\r\n    lastname,\r\n    password,\r\n  })\r\n}\r\n\r\n// Server should return object => { result: boolean } (Is Email in DB)\r\nexport function requestPassword(email: string) {\r\n  return axios.post<{result: boolean}>(REQUEST_PASSWORD_URL, {email})\r\n}\r\n\r\nexport function getUserByToken() {\r\n  // Authorization head should be fulfilled in interceptor.\r\n  // Check common redux folder => setupAxios\r\n  return axios.get<UserModel>(GET_USER_BY_ACCESSTOKEN_URL)\r\n}\r\n","import { DefaultLayoutConfig } from './DefaultLayoutConfig'\r\nimport {\r\n  IAside,\r\n  IContent,\r\n  IFooter,\r\n  IHeader, ILayout,\r\n  ILayoutCSSClasses, ILayoutCSSVariables, ILayoutHTMLAttributes, IPageTitle, IToolbar\r\n} from './LayoutModels'\r\n\r\nconst LAYOUT_CONFIG_KEY = process.env.REACT_APP_BASE_LAYOUT_CONFIG_KEY || 'LayoutConfig'\r\n\r\nexport function getLayout(): ILayout {\r\n  const ls = localStorage.getItem(LAYOUT_CONFIG_KEY)\r\n  if (ls) {\r\n    try {\r\n      return JSON.parse(ls) as ILayout\r\n    } catch (er) {\r\n      console.error(er)\r\n    }\r\n  }\r\n  return DefaultLayoutConfig\r\n}\r\n\r\nfunction setLayout(config: ILayout): void {\r\n  try {\r\n    localStorage.setItem(LAYOUT_CONFIG_KEY, JSON.stringify(config))\r\n  } catch (er) {\r\n    console.error(er)\r\n  }\r\n}\r\n\r\nexport function getEmptyCssClasses() {\r\n  return {\r\n    header: [],\r\n    headerContainer: [],\r\n    headerMobile: [],\r\n    headerMenu: [],\r\n    aside: [],\r\n    asideMenu: [],\r\n    asideToggle: [],\r\n    toolbar: [],\r\n    toolbarContainer: [],\r\n    content: [],\r\n    contentContainer: [],\r\n    footerContainer: [],\r\n    sidebar: [],\r\n    pageTitle: [],\r\n  }\r\n}\r\n\r\nexport function getEmptyHTMLAttributes() {\r\n  return {\r\n    asideMenu: new Map(),\r\n    headerMobile: new Map(),\r\n    headerMenu: new Map(),\r\n    headerContainer: new Map(),\r\n    pageTitle: new Map(),\r\n  }\r\n}\r\n\r\nexport function getEmptyCSSVariables() {\r\n  return {\r\n    body: new Map(),\r\n  }\r\n}\r\n\r\nexport class LayoutSetup {\r\n  public static isLoaded: boolean = false\r\n  public static config: ILayout = getLayout()\r\n  public static classes: ILayoutCSSClasses = getEmptyCssClasses()\r\n  public static attributes: ILayoutHTMLAttributes = getEmptyHTMLAttributes()\r\n  public static cssVariables: ILayoutCSSVariables = getEmptyCSSVariables()\r\n\r\n  private static initCSSClasses(): void {\r\n    LayoutSetup.classes = getEmptyCssClasses()\r\n  }\r\n\r\n  private static initHTMLAttributes(): void {\r\n    LayoutSetup.attributes = Object.assign({}, getEmptyHTMLAttributes())\r\n  }\r\n\r\n  private static initCSSVariables(): void {\r\n    LayoutSetup.cssVariables = getEmptyCSSVariables()\r\n  }\r\n\r\n  private static initLayout(config: ILayout): void {\r\n    Array.from(document.body.attributes).forEach((attr) => {\r\n      document.body.removeAttribute(attr.name)\r\n    })\r\n    // document.body.style.backgroundImage = `url(${toAbsoluteUrl('/media/patterns/header-bg.jpg')})`\r\n    document.body.setAttribute('id', 'kt_body')\r\n    if (config.main?.body?.backgroundImage) {\r\n      document.body.style.backgroundImage = `url('${config.main.body.backgroundImage}')`\r\n    }\r\n\r\n    if (config.main?.body?.class) {\r\n      document.body.classList.add(config.main.body.class)\r\n    }\r\n\r\n    // if (config.loader.display) {\r\n    //   document.body.classList.add('page-loading')\r\n    //   document.body.classList.add('page-loading-enabled')\r\n    // }\r\n  }\r\n\r\n  private static initHeader(config: IHeader): void {\r\n    LayoutSetup.classes.headerContainer.push(\r\n      config.width === 'fluid' ? 'container-fluid' : 'container'\r\n    )\r\n\r\n    if (config.fixed.desktop) {\r\n      document.body.classList.add('header-fixed')\r\n    }\r\n\r\n    if (config.fixed.tabletAndMobile) {\r\n      document.body.classList.add('header-tablet-and-mobile-fixed')\r\n    }\r\n  }\r\n\r\n  private static initToolbar(config: IToolbar): void {\r\n    if (!config.display) {\r\n      return\r\n    }\r\n\r\n    document.body.classList.add('toolbar-enabled')\r\n    LayoutSetup.classes.toolbarContainer.push(\r\n      config.width === 'fluid' ? 'container-fluid' : 'container'\r\n    )\r\n\r\n    if (config.fixed.desktop) {\r\n      document.body.classList.add('toolbar-fixed')\r\n    }\r\n\r\n    if (config.fixed.tabletAndMobileMode) {\r\n      document.body.classList.add('toolbar-tablet-and-mobile-fixed')\r\n    }\r\n\r\n    // Height setup\r\n    const type = config.layout\r\n    const typeOptions = config.layouts[type]\r\n    if (typeOptions) {\r\n      let bodyStyles: string = ''\r\n      if (typeOptions.height) {\r\n        bodyStyles += ` --kt-toolbar-height: ${typeOptions.height};`\r\n      }\r\n\r\n      if (typeOptions.heightAndTabletMobileMode) {\r\n        bodyStyles += ` --kt-toolbar-height-tablet-and-mobile: ${typeOptions.heightAndTabletMobileMode};`\r\n      }\r\n      document.body.style.cssText += bodyStyles\r\n    }\r\n  }\r\n\r\n  private static initPageTitle(config: IPageTitle): void {\r\n    if (!config.display) {\r\n      return\r\n    }\r\n\r\n    if (config.direction === 'column') {\r\n      this.classes.pageTitle.push('flex-column')\r\n      this.classes.pageTitle.push('align-items-start')\r\n    } else {\r\n      this.classes.pageTitle.push('align-items-center')\r\n      this.classes.pageTitle.push('flex-wrap')\r\n    }\r\n    this.classes.pageTitle.push('me-3')\r\n\r\n    if (config.responsive) {\r\n      this.classes.pageTitle.push('mb-5')\r\n      this.classes.pageTitle.push('mb-lg-0')\r\n\r\n      LayoutSetup.attributes.pageTitle.set('data-kt-swapper', true)\r\n      LayoutSetup.attributes.pageTitle.set('data-kt-swapper-mode', 'prepend')\r\n      LayoutSetup.attributes.pageTitle.set(\r\n        'data-kt-swapper-parent',\r\n        `{ default: '#kt_content_container', '${config.responsiveBreakpoint}': '${config.responsiveTarget}'}`\r\n      )\r\n    }\r\n  }\r\n\r\n  private static initContent(config: IContent): void {\r\n    LayoutSetup.classes.contentContainer.push(\r\n      config.width === 'fluid' ? 'container-fluid' : 'container'\r\n    )\r\n    // if (Theme::getOption('layout', 'content/container-class')) {\r\n    // \tTheme::addHtmlClass('content-container', Theme::getOption('layout', 'content/container-class'));\r\n    // }\r\n  }\r\n\r\n  private static initAside(config: IAside): void {\r\n    // Check if aside is displayed\r\n    if (!config.display) {\r\n      return\r\n    }\r\n\r\n    // Enable Aside\r\n    document.body.classList.add('aside-enabled')\r\n    LayoutSetup.classes.aside.push(`aside-${config.theme}`)\r\n\r\n    // Fixed Aside\r\n    if (config.fixed) {\r\n      document.body.classList.add('aside-fixed')\r\n    }\r\n\r\n    // Default minimized\r\n    if (config.minimized) {\r\n      document.body.setAttribute('data-kt-aside-minimize', 'on')\r\n    }\r\n\r\n    // Hoverable on minimize\r\n    if (config.hoverable) {\r\n      LayoutSetup.classes.aside.push('aside-hoverable')\r\n    }\r\n  }\r\n\r\n  private static initAsideMenu(config: IAside): void {\r\n    // if (Theme::getOption('layout', 'aside/menu') === 'documentation') {\r\n    // \tself::$menu = new Menu( Theme::getOption('menu', 'documentation'), Theme::getPagePath() );\r\n    // } else {\r\n    // \tself::$menu = new Menu( Theme::getOption('menu', 'main'), Theme::getPagePath() );\r\n    // }\r\n    // if (Theme::getOption('layout', 'aside/menu-icons-display') === false) {\r\n    // \tself::$menu->displayIcons(false);\r\n    // }\r\n    // self::$menu->setIconType(Theme::getOption('layout', 'aside/menu-icon'));\r\n  }\r\n\r\n  // private static initSidebar(sidebarConfig: ISidebarConfig): void {\r\n  //   // / Set Sidebar enabled class\r\n  //   if (sidebarConfig.display) {\r\n  //     document.body.classList.add('sidebar-enabled')\r\n  //   } else {\r\n  //     return\r\n  //   }\r\n\r\n  //   // Set Sidebar shown status\r\n  //   if (sidebarConfig.shown) {\r\n  //     document.body.setAttribute('data-sidebar', 'on')\r\n  //   }\r\n\r\n  //   // Set Sidebar background color class\r\n  //   ThemeSetup.classes.sidebar.push(sidebarConfig.bgColor)\r\n  // }\r\n\r\n  private static initFooter(config: IFooter): void {\r\n    LayoutSetup.classes.footerContainer.push(`container${config.width === 'fluid' ? '-fluid' : ''}`)\r\n  }\r\n\r\n  private static initConfig(config: ILayout): void {\r\n    if (config.main?.darkSkinEnabled) {\r\n      document.body.classList.add('dark-skin')\r\n    }\r\n\r\n    // Init layout\r\n    LayoutSetup.initLayout(config)\r\n    if (config.main?.type !== 'default') {\r\n      return\r\n    }\r\n\r\n    LayoutSetup.initHeader(config.header)\r\n    LayoutSetup.initPageTitle(config.pageTitle as IPageTitle)\r\n    LayoutSetup.initToolbar(config.toolbar)\r\n    LayoutSetup.initContent(config.content)\r\n    LayoutSetup.initAside(config.aside)\r\n    LayoutSetup.initFooter(config.footer)\r\n    LayoutSetup.initAsideMenu(config.aside)\r\n  }\r\n\r\n  public static updatePartialConfig(fieldsToUpdate: Partial<ILayout>): ILayout {\r\n    const config = LayoutSetup.config\r\n    const updatedConfig = { ...config, ...fieldsToUpdate }\r\n    LayoutSetup.initCSSClasses()\r\n    LayoutSetup.initCSSVariables()\r\n    LayoutSetup.initHTMLAttributes()\r\n    LayoutSetup.isLoaded = false\r\n    LayoutSetup.config = updatedConfig\r\n    LayoutSetup.initConfig(Object.assign({}, updatedConfig))\r\n    LayoutSetup.isLoaded = true // remove loading there\r\n    return updatedConfig\r\n  }\r\n\r\n  public static setConfig(config: ILayout): void {\r\n    setLayout(config)\r\n  }\r\n\r\n  public static bootstrap = (() => {\r\n    LayoutSetup.updatePartialConfig(LayoutSetup.config)\r\n  })()\r\n}\r\n","import React, {\r\n  FC,\r\n  createContext,\r\n  useContext,\r\n  useState,\r\n  useEffect,\r\n  SetStateAction,\r\n  Dispatch,\r\n} from 'react'\r\n\r\nconst MetronicSplashScreenContext = createContext<Dispatch<SetStateAction<number>> | undefined>(\r\n  undefined\r\n)\r\n\r\nconst MetronicSplashScreenProvider: FC = ({children}) => {\r\n  const [count, setCount] = useState(0)\r\n  let visible = count > 0\r\n\r\n  useEffect(() => {\r\n    const splashScreen = document.getElementById('splash-screen')\r\n\r\n    // Show SplashScreen\r\n    if (splashScreen && visible) {\r\n      splashScreen.classList.remove('hidden')\r\n\r\n      return () => {\r\n        splashScreen.classList.add('hidden')\r\n      }\r\n    }\r\n\r\n    // Hide SplashScreen\r\n    let timeout: number\r\n    if (splashScreen && !visible) {\r\n      timeout = window.setTimeout(() => {\r\n        splashScreen.classList.add('hidden')\r\n      }, 3000)\r\n    }\r\n\r\n    return () => {\r\n      clearTimeout(timeout)\r\n    }\r\n  }, [visible])\r\n\r\n  return (\r\n    <MetronicSplashScreenContext.Provider value={setCount}>\r\n      {children}\r\n    </MetronicSplashScreenContext.Provider>\r\n  )\r\n}\r\n\r\nconst LayoutSplashScreen: FC<{visible?: boolean}> = ({visible = true}) => {\r\n  // Everything are ready - remove splashscreen\r\n  const setCount = useContext(MetronicSplashScreenContext)\r\n\r\n  useEffect(() => {\r\n    if (!visible) {\r\n      return\r\n    }\r\n\r\n    if (setCount) {\r\n      setCount((prev) => {\r\n        return prev + 1\r\n      })\r\n    }\r\n\r\n    return () => {\r\n      if (setCount) {\r\n        setCount((prev) => {\r\n          return prev - 1\r\n        })\r\n      }\r\n    }\r\n  }, [setCount, visible])\r\n\r\n  return null\r\n}\r\n\r\nexport {MetronicSplashScreenProvider, LayoutSplashScreen}\r\n","import {Action} from '@reduxjs/toolkit'\r\nimport {persistReducer} from 'redux-persist'\r\nimport storage from 'redux-persist/lib/storage'\r\nimport {put, takeLatest} from 'redux-saga/effects'\r\nimport {UserModel} from '../models/UserModel'\r\nimport {getUserByToken} from './AuthCRUD'\r\n\r\nexport interface ActionWithPayload<T> extends Action {\r\n  payload?: T\r\n}\r\n\r\nexport const actionTypes = {\r\n  Login: '[Login] Action',\r\n  Logout: '[Logout] Action',\r\n  Register: '[Register] Action',\r\n  UserRequested: '[Request User] Action',\r\n  UserLoaded: '[Load User] Auth API',\r\n  SetUser: '[Set User] Action',\r\n}\r\n\r\nconst initialAuthState: IAuthState = {\r\n  user: undefined,\r\n  accessToken: undefined,\r\n}\r\n\r\nexport interface IAuthState {\r\n  user?: UserModel\r\n  accessToken?: string\r\n}\r\n\r\nexport const reducer = persistReducer(\r\n  {storage, key: 'v100-demo2-auth', whitelist: ['user', 'accessToken']},\r\n  (state: IAuthState = initialAuthState, action: ActionWithPayload<IAuthState>) => {\r\n    switch (action.type) {\r\n      case actionTypes.Login: {\r\n        const accessToken = action.payload?.accessToken\r\n        return {accessToken, user: undefined}\r\n      }\r\n\r\n      case actionTypes.Register: {\r\n        const accessToken = action.payload?.accessToken\r\n        return {accessToken, user: undefined}\r\n      }\r\n\r\n      case actionTypes.Logout: {\r\n        return initialAuthState\r\n      }\r\n\r\n      case actionTypes.UserRequested: {\r\n        return {...state, user: undefined}\r\n      }\r\n\r\n      case actionTypes.UserLoaded: {\r\n        const user = action.payload?.user\r\n        return {...state, user}\r\n      }\r\n\r\n      case actionTypes.SetUser: {\r\n        const user = action.payload?.user\r\n        return {...state, user}\r\n      }\r\n\r\n      default:\r\n        return state\r\n    }\r\n  }\r\n)\r\n\r\nexport const actions = {\r\n  login: (accessToken: string) => ({type: actionTypes.Login, payload: {accessToken}}),\r\n  register: (accessToken: string) => ({\r\n    type: actionTypes.Register,\r\n    payload: {accessToken},\r\n  }),\r\n  logout: () => ({type: actionTypes.Logout}),\r\n  requestUser: () => ({\r\n    type: actionTypes.UserRequested,\r\n  }),\r\n  fulfillUser: (user: UserModel) => ({type: actionTypes.UserLoaded, payload: {user}}),\r\n  setUser: (user: UserModel) => ({type: actionTypes.SetUser, payload: {user}}),\r\n}\r\n\r\nexport function* saga() {\r\n  yield takeLatest(actionTypes.Login, function* loginSaga() {\r\n    yield put(actions.requestUser())\r\n  })\r\n\r\n  yield takeLatest(actionTypes.Register, function* registerSaga() {\r\n    yield put(actions.requestUser())\r\n  })\r\n\r\n  yield takeLatest(actionTypes.UserRequested, function* userRequested() {\r\n    const {data: user} = yield getUserByToken()\r\n    yield put(actions.fulfillUser(user))\r\n  })\r\n}\r\n","import React, { createContext, FC, useContext } from 'react';\r\nconst I18N_CONFIG_KEY = process.env.REACT_APP_I18N_CONFIG_KEY || 'i18nConfig'\r\n\r\ntype Props = {\r\n  selectedLang: 'de' | 'en' | 'es' | 'fr' | 'ja' | 'zh' | 'vi'\r\n}\r\n\r\n//const listLanguage = ['de' , 'en' , 'es' , 'fr' , 'ja' , 'zh' , 'vi'];\r\n\r\nconst initialState: Props = {\r\n  selectedLang: 'en', //default language\r\n}\r\n\r\nfunction getConfig(): Props {\r\n  const ls = localStorage.getItem(I18N_CONFIG_KEY)\r\n  if (ls) {\r\n    try {\r\n      return JSON.parse(ls) as Props\r\n    } catch (er) {\r\n      console.error(er)\r\n    }\r\n  }\r\n  return initialState\r\n}\r\n\r\n// Side effect\r\nexport function setLanguage(lang: string) {\r\n  localStorage.setItem(I18N_CONFIG_KEY, JSON.stringify({selectedLang: lang}))\r\n  window.location.reload()\r\n}\r\n\r\nconst I18nContext = createContext<Props>(initialState)\r\n\r\nconst useLang = ( ) => {\r\n  // let lang =  useContext(I18nContext).selectedLang;\r\n  //   const currentLocation =  window.navigator.language.slice(0,2) as any;\r\n  //   if( listLanguage.indexOf(currentLocation) !=  -1 ) {\r\n  //     lang  = currentLocation;\r\n  //   }\r\n  //   useLang(lang);\r\n  return useContext(I18nContext).selectedLang\r\n}\r\n\r\nconst MetronicI18nProvider: FC = ({children}) => {\r\n  const lang = getConfig()\r\n  return <I18nContext.Provider value={lang}>{children}</I18nContext.Provider>\r\n}\r\n\r\nexport { MetronicI18nProvider, useLang };\r\n\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport clsx from 'clsx'\r\nimport {FC} from 'react'\r\nimport {toAbsoluteUrl} from '../../../helpers'\r\nimport {useLang, setLanguage} from '../../../i18n/Metronici18n'\r\n\r\nconst languages = [\r\n  {\r\n    lang: 'en',\r\n    name: 'English',\r\n    flag: toAbsoluteUrl('/media/flags/united-states.svg'),\r\n  },\r\n  {\r\n    lang: 'zh',\r\n    name: 'Mandarin',\r\n    flag: toAbsoluteUrl('/media/flags/china.svg'),\r\n  },\r\n  {\r\n    lang: 'es',\r\n    name: 'Spanish',\r\n    flag: toAbsoluteUrl('/media/flags/spain.svg'),\r\n  },\r\n  {\r\n    lang: 'ja',\r\n    name: 'Japanese',\r\n    flag: toAbsoluteUrl('/media/flags/japan.svg'),\r\n  },\r\n  {\r\n    lang: 'de',\r\n    name: 'German',\r\n    flag: toAbsoluteUrl('/media/flags/germany.svg'),\r\n  },\r\n  {\r\n    lang: 'fr',\r\n    name: 'French',\r\n    flag: toAbsoluteUrl('/media/flags/france.svg'),\r\n  },\r\n]\r\n\r\nconst Languages: FC = () => {\r\n  const lang = useLang()\r\n  const currentLanguage = languages.find((x) => x.lang === lang)\r\n  return (\r\n    <div\r\n      className='menu-item px-5'\r\n      data-kt-menu-trigger='hover'\r\n      data-kt-menu-placement='left-start'\r\n      data-kt-menu-flip='bottom'\r\n    >\r\n      <a href='#' className='menu-link px-5'>\r\n        <span className='menu-title position-relative'>\r\n          Language\r\n          <span className='fs-8 rounded bg-light px-3 py-2 position-absolute translate-middle-y top-50 end-0'>\r\n            {currentLanguage?.name}{' '}\r\n            <img\r\n              className='w-15px h-15px rounded-1 ms-2'\r\n              src={currentLanguage?.flag}\r\n              alt='metronic'\r\n            />\r\n          </span>\r\n        </span>\r\n      </a>\r\n\r\n      <div className='menu-sub menu-sub-dropdown w-175px py-4'>\r\n        {languages.map((l) => (\r\n          <div\r\n            className='menu-item px-3'\r\n            key={l.lang}\r\n            onClick={() => {\r\n              setLanguage(l.lang)\r\n            }}\r\n          >\r\n            <a\r\n              href='#'\r\n              className={clsx('menu-link d-flex px-5', {active: l.lang === currentLanguage?.lang})}\r\n            >\r\n              <span className='symbol symbol-20px me-4'>\r\n                <img className='rounded-1' src={l.flag} alt='metronic' />\r\n              </span>\r\n              {l.name}\r\n            </a>\r\n          </div>\r\n        ))}\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {Languages}\r\n","/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable jsx-a11y/anchor-is-valid */\r\n// import React from 'react'\r\n// import {Toggle} from './Toggle'\r\n// import {Demos} from './Demos'\r\n// import {KTSVG} from '../../../helpers'\r\n\r\nexport function ExploreMain() {\r\n  return (\r\n    <>\r\n      {/* <Toggle />\r\n  \r\n      <div\r\n        id='kt_explore'\r\n        className='bg-body'\r\n        data-kt-drawer='true'\r\n        data-kt-drawer-name='explore'\r\n        data-kt-drawer-activate='true'\r\n        data-kt-drawer-overlay='true'\r\n        data-kt-drawer-width=\"{default:'350px', 'lg': '475px'}\"\r\n        data-kt-drawer-direction='end'\r\n        data-kt-drawer-toggle='#kt_explore_toggle'\r\n        data-kt-drawer-close='#kt_explore_close'\r\n      >\r\n      \r\n        <div className='card shadow-none w-100'>\r\n          \r\n          <div className='card-header' id='kt_explore_header'>\r\n            <h5 className='card-title fw-bold text-gray-600'>\r\n              Explore {process.env.REACT_APP_THEME_NAME}\r\n            </h5>\r\n\r\n            <div className='card-toolbar'>\r\n              <button\r\n                type='button'\r\n                className='btn btn-sm btn-icon explore-btn-dismiss me-n5'\r\n                id='kt_explore_close'\r\n              >\r\n                <KTSVG path='/media/icons/duotune/arrows/arr061.svg' className='svg-icon-2' />\r\n              </button>\r\n            </div>\r\n          </div>\r\n         \r\n          <div className='card-body' id='kt_explore_body'>\r\n         \r\n            <div\r\n              id='kt_explore_scroll'\r\n              className='scroll-y me-n5 pe-5'\r\n              data-kt-scroll='true'\r\n              data-kt-scroll-height='auto'\r\n              data-kt-scroll-wrappers='#kt_explore_body'\r\n              data-kt-scroll-dependencies='#kt_explore_header, #kt_explore_footer'\r\n              data-kt-scroll-offset='5px'\r\n            >\r\n              <div className='mb-7'>\r\n                <div className='d-flex flex-stack'>\r\n                  <h3 className='mb-0'>{process.env.REACT_APP_THEME_NAME} Licenses</h3>\r\n\r\n                  <a href='https://themeforest.net/licenses/standard' className='fw-bold'>\r\n                    License FAQs\r\n                  </a>\r\n                </div>\r\n              </div>\r\n\r\n              <div className='rounded border border-dashed border-gray-300 py-4 px-6 mb-5'>\r\n                <div className='d-flex flex-stack'>\r\n                  <div className='d-flex flex-column'>\r\n                    <div className='d-flex align-items-center mb-1'>\r\n                      <div className='fs-6 fw-bold text-gray-800 fw-bold mb-0 me-1'>\r\n                        Regular License\r\n                      </div>\r\n\r\n                      <i\r\n                        className='text-gray-400 fas fa-exclamation-circle ms-1 fs-7'\r\n                        data-bs-toggle='popover'\r\n                        data-bs-trigger='hover'\r\n                        data-bs-placement='top'\r\n                        data-bs-content='Use, by you or one client in a single end product which end users are not charged for.'\r\n                      ></i>\r\n                    </div>\r\n                    <div className='fs-7 text-muted'>\r\n                      For single end product used by you or one client\r\n                    </div>\r\n                  </div>\r\n\r\n                  <div className='text-nowrap'>\r\n                    <span className='text-muted fs-7 fw-bold'>$</span>\r\n                    <span className='text-dark fs-1 fw-bolder'>39</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <div className='rounded border border-dashed border-gray-300 py-4 px-6 mb-5'>\r\n                <div className='d-flex flex-stack'>\r\n                  <div className='d-flex flex-column'>\r\n                    <div className='d-flex align-items-center mb-1'>\r\n                      <div className='fs-6 fw-bold text-gray-800 fw-bold mb-0 me-1'>\r\n                        Extended License\r\n                      </div>\r\n\r\n                      <i\r\n                        className='text-gray-400 fas fa-exclamation-circle ms-1 fs-7'\r\n                        data-bs-toggle='popover'\r\n                        data-bs-trigger='hover'\r\n                        data-bs-placement='top'\r\n                        data-bs-content='Use, by you or one client, in a single end product which end users can be charged for.'\r\n                      ></i>\r\n                    </div>\r\n                    <div className='fs-7 text-muted'>For single end product with paying users.</div>\r\n                  </div>\r\n\r\n                  <div className='text-nowrap'>\r\n                    <span className='text-muted fs-7 fw-bold'>$</span>\r\n                    <span className='text-dark fs-1 fw-bolder'>939</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <div className='rounded border border-dashed border-gray-300 py-4 px-6 mb-5'>\r\n                <div className='d-flex flex-stack'>\r\n                  <div className='d-flex flex-column'>\r\n                    <div className='d-flex align-items-center mb-1'>\r\n                      <div className='fs-6 fw-bold text-gray-800 fw-bold mb-0 me-1'>\r\n                        Custom License\r\n                      </div>\r\n                    </div>\r\n                    <div className='fs-7 text-muted'>Reach us for custom license offers.</div>\r\n                  </div>\r\n\r\n                  <div className='text-nowrap'>\r\n                    <a href='https://keenthemes.com/contact/' className='btn btn-sm btn-success'>\r\n                      Contact Us\r\n                    </a>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <a href={process.env.REACT_APP_PURCHASE_URL} className='btn btn-primary mb-15 w-100'>\r\n                Buy Now\r\n              </a>\r\n              <Demos />\r\n            </div>\r\n      \r\n          </div>\r\n    \r\n        </div>\r\n\r\n      </div> */}\r\n    </>\r\n  )\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, {FC} from 'react'\r\n// import {KTSVG} from '../../../helpers'\r\n// import {ChatInner} from '../../chat/ChatInner'\r\n\r\nconst DrawerMessenger: FC = () => (\r\n  // <div\r\n  //   id='kt_drawer_chat'\r\n  //   className='bg-white'\r\n  //   data-kt-drawer='true'\r\n  //   data-kt-drawer-name='chat'\r\n  //   data-kt-drawer-activate='true'\r\n  //   data-kt-drawer-overlay='true'\r\n  //   data-kt-drawer-width=\"{default:'300px', 'md': '500px'}\"\r\n  //   data-kt-drawer-direction='end'\r\n  //   data-kt-drawer-toggle='#kt_drawer_chat_toggle'\r\n  //   data-kt-drawer-close='#kt_drawer_chat_close'\r\n    \r\n  // >\r\n  //   <div className='card w-100 rounded-0' id='kt_drawer_chat_messenger'>\r\n  //     <div className='card-header pe-5' id='kt_drawer_chat_messenger_header'>\r\n  //       <div className='card-title'>\r\n  //         <div className='d-flex justify-content-center flex-column me-3'>\r\n  //           <a href='#' className='fs-4 fw-bolder text-gray-900 text-hover-primary me-1 mb-2 lh-1'>\r\n  //             Brian Cox\r\n  //           </a>\r\n\r\n  //           <div className='mb-0 lh-1'>\r\n  //             <span className='badge badge-success badge-circle w-10px h-10px me-1'></span>\r\n  //             <span className='fs-7 fw-bold text-gray-400'>Active</span>\r\n  //           </div>\r\n  //         </div>\r\n  //       </div>\r\n\r\n  //       <div className='card-toolbar'>\r\n  //         <div className='me-2'>\r\n  //           <button\r\n  //             className='btn btn-sm btn-icon btn-active-light-primary'\r\n  //             data-kt-menu-trigger='click'\r\n  //             data-kt-menu-placement='bottom-end'\r\n  //             data-kt-menu-flip='top-end'\r\n  //           >\r\n  //             <i className='bi bi-three-dots fs-3'></i>\r\n  //           </button>\r\n  //         </div>\r\n\r\n  //         <div className='btn btn-sm btn-icon btn-active-light-primary' id='kt_drawer_chat_close'>\r\n  //           <KTSVG path='/media/icons/duotune/arrows/arr061.svg' className='svg-icon-2' />\r\n  //         </div>\r\n  //       </div>\r\n  //     </div>\r\n\r\n  //     <ChatInner isDrawer={true} />\r\n  //   </div>\r\n  // </div>\r\n  <></>\r\n)\r\n\r\nexport {DrawerMessenger}\r\n","import React, {FC} from 'react'\r\n// import {Link} from 'react-router-dom'\r\n// import {KTSVG} from '../../../helpers'\r\n// import {Item1} from '../../content/activity/Item1'\r\n// import {Item2} from '../../content/activity/Item2'\r\n// import {Item3} from '../../content/activity/Item3'\r\n// import {Item4} from '../../content/activity/Item4'\r\n// import {Item5} from '../../content/activity/Item5'\r\n// import {Item6} from '../../content/activity/Item6'\r\n// import {Item7} from '../../content/activity/Item7'\r\n// import {Item8} from '../../content/activity/Item8'\r\n\r\nconst ActivityDrawer: FC = () => (\r\n  // <div\r\n  //   id='kt_activities'\r\n  //   className='bg-white'\r\n  //   data-kt-drawer='true'\r\n  //   data-kt-drawer-name='activities'\r\n  //   data-kt-drawer-activate='true'\r\n  //   data-kt-drawer-overlay='true'\r\n  //   data-kt-drawer-width=\"{default:'300px', 'lg': '900px'}\"\r\n  //   data-kt-drawer-direction='end'\r\n  //   data-kt-drawer-toggle='#kt_activities_toggle'\r\n  //   data-kt-drawer-close='#kt_activities_close'\r\n  // >\r\n  //   <div className='card shadow-none rounded-0'>\r\n  //     <div className='card-header' id='kt_activities_header'>\r\n  //       <h3 className='card-title fw-bolder text-dark'>Activity Logs</h3>\r\n\r\n  //       <div className='card-toolbar'>\r\n  //         <button\r\n  //           type='button'\r\n  //           className='btn btn-sm btn-icon btn-active-light-primary me-n5'\r\n  //           id='kt_activities_close'\r\n  //         >\r\n  //           <KTSVG path='/media/icons/duotune/arrows/arr061.svg' className='svg-icon-1' />\r\n  //         </button>\r\n  //       </div>\r\n  //     </div>\r\n  //     <div className='card-body position-relative' id='kt_activities_body'>\r\n  //       <div\r\n  //         id='kt_activities_scroll'\r\n  //         className='position-relative scroll-y me-n5 pe-5'\r\n  //         data-kt-scroll='true'\r\n  //         data-kt-scroll-height='auto'\r\n  //         data-kt-scroll-wrappers='#kt_activities_body'\r\n  //         data-kt-scroll-dependencies='#kt_activities_header, #kt_activities_footer'\r\n  //         data-kt-scroll-offset='5px'\r\n  //       >\r\n  //         <div className='timeline'>\r\n  //           <Item1 />\r\n  //           <Item2 />\r\n  //           <Item3 />\r\n  //           <Item4 />\r\n  //           <Item5 />\r\n  //           <Item6 />\r\n  //           <Item7 />\r\n  //           <Item8 />\r\n  //         </div>\r\n  //       </div>\r\n  //     </div>\r\n  //     <div className='card-footer py-5 text-center' id='kt_activities_footer'>\r\n  //       <Link to='/crafted/pages/profile' className='btn btn-bg-white text-primary'>\r\n  //         View All Activities\r\n  //         <KTSVG\r\n  //           path='/media/icons/duotune/arrows/arr064.svg'\r\n  //           className='svg-icon-3 svg-icon-primary'\r\n  //         />\r\n  //       </Link>\r\n  //     </div>\r\n  //   </div>\r\n  // </div>\r\n  <></>\r\n)\r\n\r\nexport {ActivityDrawer}\r\n","import {toAbsoluteUrl} from '../../../helpers'\r\n\r\nexport function FallbackView() {\r\n  return (\r\n    <div className='splash-screen'>\r\n      <img src={toAbsoluteUrl('/media/logos/logo-compact.png')} alt='Start logo' />\r\n      <span>Loading ...</span>\r\n    </div>\r\n  )\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, {FC, useEffect, useRef, useState} from 'react'\r\nimport {KTSVG, toAbsoluteUrl} from '../../../helpers'\r\nimport {Formik, Form, FormikValues, Field, ErrorMessage} from 'formik'\r\nimport * as Yup from 'yup'\r\nimport {StepperComponent} from '../../../assets/ts/components'\r\n\r\ninterface ICreateAccount {\r\n  appName: string\r\n  category: string\r\n  framework: string\r\n  dbName: string\r\n  dbType: string\r\n  nameOnCard: string\r\n  cardNumber: string\r\n  cardExpiryMonth: string\r\n  cardExpiryYear: string\r\n  cardCvv: string\r\n  saveCard: string\r\n}\r\n\r\nconst inits: ICreateAccount = {\r\n  appName: '',\r\n  category: '1',\r\n  framework: '1',\r\n  dbName: '',\r\n  dbType: '1',\r\n  nameOnCard: 'Max Doe',\r\n  cardNumber: '4111 1111 1111 1111',\r\n  cardExpiryMonth: '1',\r\n  cardExpiryYear: '2025',\r\n  cardCvv: '123',\r\n  saveCard: '1',\r\n}\r\n\r\nconst createAppSchema = [\r\n  Yup.object({\r\n    appName: Yup.string().required().label('App name'),\r\n    category: Yup.string().required().label('Category'),\r\n  }),\r\n  Yup.object({\r\n    framework: Yup.string().required().label('Framework'),\r\n  }),\r\n  Yup.object({\r\n    dbName: Yup.string().required().label('Database name'),\r\n    dbType: Yup.string().required().label('Database engine'),\r\n  }),\r\n  Yup.object({\r\n    nameOnCard: Yup.string().required().label('Name'),\r\n    cardNumber: Yup.string().required().label('Card Number'),\r\n    cardExpiryMonth: Yup.string().required().label('Expiration Month'),\r\n    cardExpiryYear: Yup.string().required().label('Expiration Year'),\r\n    cardCvv: Yup.string().required().label('CVV'),\r\n  }),\r\n]\r\n\r\nconst Main: FC = () => {\r\n  const stepperRef = useRef<HTMLDivElement | null>(null)\r\n  const stepper = useRef<StepperComponent | null>(null)\r\n  const [currentSchema, setCurrentSchema] = useState(createAppSchema[0])\r\n  const [initValues] = useState<ICreateAccount>(inits)\r\n\r\n  const loadStepper = () => {\r\n    stepper.current = StepperComponent.createInsance(stepperRef.current as HTMLDivElement)\r\n  }\r\n\r\n  const prevStep = () => {\r\n    if (!stepper.current) {\r\n      return\r\n    }\r\n\r\n    stepper.current.goPrev()\r\n\r\n    setCurrentSchema(createAppSchema[stepper.current.currentStepIndex - 1])\r\n  }\r\n\r\n  const submitStep = (values: ICreateAccount, actions: FormikValues) => {\r\n    if (!stepper.current) {\r\n      return\r\n    }\r\n\r\n    setCurrentSchema(createAppSchema[stepper.current.currentStepIndex])\r\n\r\n    if (stepper.current.currentStepIndex !== stepper.current.totatStepsNumber) {\r\n      stepper.current.goNext()\r\n    } else {\r\n      stepper.current.goto(1)\r\n      actions.resetForm()\r\n    }\r\n  }\r\n\r\n  useEffect(() => {\r\n    if (!stepperRef.current) {\r\n      return\r\n    }\r\n\r\n    loadStepper()\r\n  }, [stepperRef])\r\n\r\n  return (\r\n    <div className='modal fade' id='kt_modal_create_app' aria-hidden='true'>\r\n      <div className='modal-dialog modal-dialog-centered mw-900px'>\r\n        <div className='modal-content'>\r\n          <div className='modal-header'>\r\n            <h2>Create App</h2>\r\n\r\n            <div className='btn btn-sm btn-icon btn-active-color-primary' data-bs-dismiss='modal'>\r\n              <KTSVG path='/media/icons/duotune/arrows/arr061.svg' className='svg-icon-1' />\r\n            </div>\r\n          </div>\r\n\r\n          <div className='modal-body py-lg-10 px-lg-10'>\r\n            <div\r\n              ref={stepperRef}\r\n              className='stepper stepper-pills stepper-column d-flex flex-column flex-xl-row flex-row-fluid'\r\n              id='kt_modal_create_app_stepper'\r\n            >\r\n              <div className='d-flex justify-content-center justify-content-xl-start flex-row-auto w-100 w-xl-300px'>\r\n                <div className='stepper-nav ps-lg-10'>\r\n                  <div className='stepper-item current' data-kt-stepper-element='nav'>\r\n                    <div className='stepper-line w-40px'></div>\r\n\r\n                    <div className='stepper-icon w-40px h-40px'>\r\n                      <i className='stepper-check fas fa-check'></i>\r\n                      <span className='stepper-number'>1</span>\r\n                    </div>\r\n\r\n                    <div className='stepper-label'>\r\n                      <h3 className='stepper-title'>Details</h3>\r\n\r\n                      <div className='stepper-desc'>Name your App</div>\r\n                    </div>\r\n                  </div>\r\n\r\n                  <div className='stepper-item' data-kt-stepper-element='nav'>\r\n                    <div className='stepper-line w-40px'></div>\r\n\r\n                    <div className='stepper-icon w-40px h-40px'>\r\n                      <i className='stepper-check fas fa-check'></i>\r\n                      <span className='stepper-number'>2</span>\r\n                    </div>\r\n\r\n                    <div className='stepper-label'>\r\n                      <h3 className='stepper-title'>Frameworks</h3>\r\n\r\n                      <div className='stepper-desc'>Define your app framework</div>\r\n                    </div>\r\n                  </div>\r\n\r\n                  <div className='stepper-item' data-kt-stepper-element='nav'>\r\n                    <div className='stepper-line w-40px'></div>\r\n\r\n                    <div className='stepper-icon w-40px h-40px'>\r\n                      <i className='stepper-check fas fa-check'></i>\r\n                      <span className='stepper-number'>3</span>\r\n                    </div>\r\n\r\n                    <div className='stepper-label'>\r\n                      <h3 className='stepper-title'>Database</h3>\r\n\r\n                      <div className='stepper-desc'>Select the app database type</div>\r\n                    </div>\r\n                  </div>\r\n\r\n                  <div className='stepper-item' data-kt-stepper-element='nav'>\r\n                    <div className='stepper-line w-40px'></div>\r\n\r\n                    <div className='stepper-icon w-40px h-40px'>\r\n                      <i className='stepper-check fas fa-check'></i>\r\n                      <span className='stepper-number'>4</span>\r\n                    </div>\r\n\r\n                    <div className='stepper-label'>\r\n                      <h3 className='stepper-title'>Billing</h3>\r\n\r\n                      <div className='stepper-desc'>Provide payment details</div>\r\n                    </div>\r\n                  </div>\r\n\r\n                  <div className='stepper-item' data-kt-stepper-element='nav'>\r\n                    <div className='stepper-line w-40px'></div>\r\n\r\n                    <div className='stepper-icon w-40px h-40px'>\r\n                      <i className='stepper-check fas fa-check'></i>\r\n                      <span className='stepper-number'>5</span>\r\n                    </div>\r\n\r\n                    <div className='stepper-label'>\r\n                      <h3 className='stepper-title'>Release</h3>\r\n\r\n                      <div className='stepper-desc'>Review and Submit</div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <div className='flex-row-fluid py-lg-5 px-lg-15'>\r\n                <Formik\r\n                  validationSchema={currentSchema}\r\n                  initialValues={initValues}\r\n                  onSubmit={submitStep}\r\n                >\r\n                  {() => (\r\n                    <Form className='form' noValidate id='kt_modal_create_app_form'>\r\n                      <div className='current' data-kt-stepper-element='content'>\r\n                        <div className='w-100'>\r\n                          <div className='fv-row mb-10'>\r\n                            <label className='d-flex align-items-center fs-5 fw-bold mb-2'>\r\n                              <span className='required'>App Name</span>\r\n                              <i\r\n                                className='fas fa-exclamation-circle ms-2 fs-7'\r\n                                data-bs-toggle='tooltip'\r\n                                title='Specify your unique app name'\r\n                              ></i>\r\n                            </label>\r\n\r\n                            <Field\r\n                              type='text'\r\n                              className='form-control form-control-lg form-control-solid'\r\n                              name='appName'\r\n                              placeholder=''\r\n                            />\r\n                            <div className='fv-plugins-message-container invalid-feedback'>\r\n                              <ErrorMessage name='appName' />\r\n                            </div>\r\n                          </div>\r\n\r\n                          <div className='fv-row'>\r\n                            <label className='d-flex align-items-center fs-5 fw-bold mb-4'>\r\n                              <span className='required'>Category</span>\r\n\r\n                              <i\r\n                                className='fas fa-exclamation-circle ms-2 fs-7'\r\n                                data-bs-toggle='tooltip'\r\n                                title='Select your app category'\r\n                              ></i>\r\n                            </label>\r\n\r\n                            <div className='fv-row'>\r\n                              <label className='d-flex flex-stack mb-5 cursor-pointer'>\r\n                                <span className='d-flex align-items-center me-2'>\r\n                                  <span className='symbol symbol-50px me-6'>\r\n                                    <span className='symbol-label bg-light-primary'>\r\n                                      <KTSVG\r\n                                        path='/media/icons/duotune/maps/map004.svg'\r\n                                        className='svg-icon-1 svg-icon-primary'\r\n                                      />\r\n                                    </span>\r\n                                  </span>\r\n\r\n                                  <span className='d-flex flex-column'>\r\n                                    <span className='fw-bolder fs-6'>Quick Online Courses</span>\r\n\r\n                                    <span className='fs-7 text-muted'>\r\n                                      Creating a clear text structure is just one SEO\r\n                                    </span>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='form-check form-check-custom form-check-solid'>\r\n                                  <Field\r\n                                    className='form-check-input'\r\n                                    type='radio'\r\n                                    name='category'\r\n                                    value='1'\r\n                                  />\r\n                                </span>\r\n                              </label>\r\n\r\n                              <label className='d-flex flex-stack mb-5 cursor-pointer'>\r\n                                <span className='d-flex align-items-center me-2'>\r\n                                  <span className='symbol symbol-50px me-6'>\r\n                                    <span className='symbol-label bg-light-danger  '>\r\n                                      <KTSVG\r\n                                        path='/media/icons/duotune/general/gen024.svg'\r\n                                        className='svg-icon-1 svg-icon-danger'\r\n                                      />\r\n                                    </span>\r\n                                  </span>\r\n\r\n                                  <span className='d-flex flex-column'>\r\n                                    <span className='fw-bolder fs-6'>Face to Face Discussions</span>\r\n\r\n                                    <span className='fs-7 text-muted'>\r\n                                      Creating a clear text structure is just one aspect\r\n                                    </span>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='form-check form-check-custom form-check-solid'>\r\n                                  <Field\r\n                                    className='form-check-input'\r\n                                    type='radio'\r\n                                    name='category'\r\n                                    value='2'\r\n                                  />\r\n                                </span>\r\n                              </label>\r\n\r\n                              <label className='d-flex flex-stack cursor-pointer'>\r\n                                <span className='d-flex align-items-center me-2'>\r\n                                  <span className='symbol symbol-50px me-6'>\r\n                                    <span className='symbol-label bg-light-success'>\r\n                                      <KTSVG\r\n                                        path='/media/icons/duotune/general/gen013.svg'\r\n                                        className='svg-icon-1 svg-icon-success'\r\n                                      />\r\n                                    </span>\r\n                                  </span>\r\n\r\n                                  <span className='d-flex flex-column'>\r\n                                    <span className='fw-bolder fs-6'>Full Intro Training</span>\r\n\r\n                                    <span className='fs-7 text-muted'>\r\n                                      Creating a clear text structure copywriting\r\n                                    </span>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='form-check form-check-custom form-check-solid'>\r\n                                  <Field\r\n                                    className='form-check-input'\r\n                                    type='radio'\r\n                                    name='category'\r\n                                    value='3'\r\n                                  />\r\n                                </span>\r\n                              </label>\r\n                            </div>\r\n\r\n                            <div className='fv-plugins-message-container invalid-feedback'>\r\n                              <ErrorMessage name='category' />\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n\r\n                      <div data-kt-stepper-element='content'>\r\n                        <div className='w-100'>\r\n                          <div className='fv-row'>\r\n                            <label className='d-flex align-items-center fs-5 fw-bold mb-4'>\r\n                              <span className='required'>Select Framework</span>\r\n                              <i\r\n                                className='fas fa-exclamation-circle ms-2 fs-7'\r\n                                data-bs-toggle='tooltip'\r\n                                title='Specify your apps framework'\r\n                              ></i>\r\n                            </label>\r\n\r\n                            <label className='d-flex flex-stack cursor-pointer mb-5'>\r\n                              <span className='d-flex align-items-center me-2'>\r\n                                <span className='symbol symbol-50px me-6'>\r\n                                  <span className='symbol-label bg-light-warning'>\r\n                                    <i className='fab fa-html5 text-warning fs-2x'></i>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='d-flex flex-column'>\r\n                                  <span className='fw-bolder fs-6'>HTML5</span>\r\n\r\n                                  <span className='fs-7 text-muted'>Base Web Projec</span>\r\n                                </span>\r\n                              </span>\r\n\r\n                              <span className='form-check form-check-custom form-check-solid'>\r\n                                <Field\r\n                                  className='form-check-input'\r\n                                  type='radio'\r\n                                  name='framework'\r\n                                  value='1'\r\n                                />\r\n                              </span>\r\n                            </label>\r\n\r\n                            <label className='d-flex flex-stack cursor-pointer mb-5'>\r\n                              <span className='d-flex align-items-center me-2'>\r\n                                <span className='symbol symbol-50px me-6'>\r\n                                  <span className='symbol-label bg-light-success'>\r\n                                    <i className='fab fa-react text-success fs-2x'></i>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='d-flex flex-column'>\r\n                                  <span className='fw-bolder fs-6'>ReactJS</span>\r\n                                  <span className='fs-7 text-muted'>\r\n                                    Robust and flexible app framework\r\n                                  </span>\r\n                                </span>\r\n                              </span>\r\n\r\n                              <span className='form-check form-check-custom form-check-solid'>\r\n                                <Field\r\n                                  className='form-check-input'\r\n                                  type='radio'\r\n                                  name='framework'\r\n                                  value='2'\r\n                                />\r\n                              </span>\r\n                            </label>\r\n\r\n                            <label className='d-flex flex-stack cursor-pointer mb-5'>\r\n                              <span className='d-flex align-items-center me-2'>\r\n                                <span className='symbol symbol-50px me-6'>\r\n                                  <span className='symbol-label bg-light-danger'>\r\n                                    <i className='fab fa-angular text-danger fs-2x'></i>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='d-flex flex-column'>\r\n                                  <span className='fw-bolder fs-6'>Angular</span>\r\n                                  <span className='fs-7 text-muted'>Powerful data mangement</span>\r\n                                </span>\r\n                              </span>\r\n\r\n                              <span className='form-check form-check-custom form-check-solid'>\r\n                                <Field\r\n                                  className='form-check-input'\r\n                                  type='radio'\r\n                                  name='framework'\r\n                                  value='3'\r\n                                />\r\n                              </span>\r\n                            </label>\r\n\r\n                            <label className='d-flex flex-stack cursor-pointer'>\r\n                              <span className='d-flex align-items-center me-2'>\r\n                                <span className='symbol symbol-50px me-6'>\r\n                                  <span className='symbol-label bg-light-primary'>\r\n                                    <i className='fab fa-vuejs text-primary fs-2x'></i>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='d-flex flex-column'>\r\n                                  <span className='fw-bolder fs-6'>Vue</span>\r\n                                  <span className='fs-7 text-muted'>\r\n                                    Lightweight and responsive framework\r\n                                  </span>\r\n                                </span>\r\n                              </span>\r\n\r\n                              <span className='form-check form-check-custom form-check-solid'>\r\n                                <Field\r\n                                  className='form-check-input'\r\n                                  type='radio'\r\n                                  name='framework'\r\n                                  value='4'\r\n                                />\r\n                              </span>\r\n                            </label>\r\n                          </div>\r\n                          <div className='fv-plugins-message-container invalid-feedback'>\r\n                            <ErrorMessage name='framework' />\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n\r\n                      <div data-kt-stepper-element='content'>\r\n                        <div className='w-100'>\r\n                          <div className='fv-row mb-10'>\r\n                            <label className='required fs-5 fw-bold mb-2'>Database Name</label>\r\n\r\n                            <Field\r\n                              type='text'\r\n                              className='form-control form-control-lg form-control-solid'\r\n                              name='dbName'\r\n                              placeholder=''\r\n                            />\r\n                            <div className='fv-plugins-message-container invalid-feedback'>\r\n                              <ErrorMessage name='dbName' />\r\n                            </div>\r\n                          </div>\r\n\r\n                          <div className='fv-row'>\r\n                            <label className='d-flex align-items-center fs-5 fw-bold mb-4'>\r\n                              <span className='required'>Select Database Engine</span>\r\n\r\n                              <i\r\n                                className='fas fa-exclamation-circle ms-2 fs-7'\r\n                                data-bs-toggle='tooltip'\r\n                                title='Select your app database engine'\r\n                              ></i>\r\n                            </label>\r\n\r\n                            <label className='d-flex flex-stack cursor-pointer mb-5'>\r\n                              <span className='d-flex align-items-center me-2'>\r\n                                <span className='symbol symbol-50px me-6'>\r\n                                  <span className='symbol-label bg-light-success'>\r\n                                    <i className='fas fa-database text-success fs-2x'></i>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='d-flex flex-column'>\r\n                                  <span className='fw-bolder fs-6'>MySQL</span>\r\n\r\n                                  <span className='fs-7 text-muted'>Basic MySQL database</span>\r\n                                </span>\r\n                              </span>\r\n\r\n                              <span className='form-check form-check-custom form-check-solid'>\r\n                                <Field\r\n                                  className='form-check-input'\r\n                                  type='radio'\r\n                                  name='dbType'\r\n                                  value='1'\r\n                                />\r\n                              </span>\r\n                            </label>\r\n\r\n                            <label className='d-flex flex-stack cursor-pointer mb-5'>\r\n                              <span className='d-flex align-items-center me-2'>\r\n                                <span className='symbol symbol-50px me-6'>\r\n                                  <span className='symbol-label bg-light-danger'>\r\n                                    <i className='fab fa-google text-danger fs-2x'></i>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='d-flex flex-column'>\r\n                                  <span className='fw-bolder fs-6'>Firebase</span>\r\n\r\n                                  <span className='fs-7 text-muted'>\r\n                                    Google based app data management\r\n                                  </span>\r\n                                </span>\r\n                              </span>\r\n\r\n                              <span className='form-check form-check-custom form-check-solid'>\r\n                                <Field\r\n                                  className='form-check-input'\r\n                                  type='radio'\r\n                                  name='dbType'\r\n                                  value='2'\r\n                                />\r\n                              </span>\r\n                            </label>\r\n\r\n                            <label className='d-flex flex-stack cursor-pointer'>\r\n                              <span className='d-flex align-items-center me-2'>\r\n                                <span className='symbol symbol-50px me-6'>\r\n                                  <span className='symbol-label bg-light-warning'>\r\n                                    <i className='fab fa-amazon text-warning fs-2x'></i>\r\n                                  </span>\r\n                                </span>\r\n\r\n                                <span className='d-flex flex-column'>\r\n                                  <span className='fw-bolder fs-6'>DynamoDB</span>\r\n\r\n                                  <span className='fs-7 text-muted'>\r\n                                    Amazon Fast NoSQL Database\r\n                                  </span>\r\n                                </span>\r\n                              </span>\r\n\r\n                              <span className='form-check form-check-custom form-check-solid'>\r\n                                <Field\r\n                                  className='form-check-input'\r\n                                  type='radio'\r\n                                  name='dbType'\r\n                                  value='3'\r\n                                />\r\n                              </span>\r\n                            </label>\r\n                          </div>\r\n\r\n                          <div className='fv-plugins-message-container invalid-feedback'>\r\n                            <ErrorMessage name='dbType' />\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n\r\n                      <div data-kt-stepper-element='content'>\r\n                        <div className='w-100'>\r\n                          <div className='pb-10 pb-lg-15'>\r\n                            <h2 className='fw-bolder text-dark'>Billing Details</h2>\r\n\r\n                            <div className='text-gray-400 fw-bold fs-6'>\r\n                              If you need more info, please check out\r\n                              <a href='#' className='text-primary fw-bolder'>\r\n                                Help Page\r\n                              </a>\r\n                              .\r\n                            </div>\r\n                          </div>\r\n                          <div className='d-flex flex-column mb-7 fv-row'>\r\n                            <label className='d-flex align-items-center fs-6 fw-bold form-label mb-2'>\r\n                              <span className='required'>Name On Card</span>\r\n                              <i\r\n                                className='fas fa-exclamation-circle ms-2 fs-7'\r\n                                data-bs-toggle='tooltip'\r\n                                title=\"Specify a card holder's name\"\r\n                              ></i>\r\n                            </label>\r\n\r\n                            <Field\r\n                              type='text'\r\n                              className='form-control form-control-solid'\r\n                              placeholder=''\r\n                              name='nameOnCard'\r\n                            />\r\n                            <div className='fv-plugins-message-container invalid-feedback'>\r\n                              <ErrorMessage name='nameOnCard' />\r\n                            </div>\r\n                          </div>\r\n                          <div className='d-flex flex-column mb-7 fv-row'>\r\n                            <label className='required fs-6 fw-bold form-label mb-2'>\r\n                              Card Number\r\n                            </label>\r\n\r\n                            <div className='position-relative'>\r\n                              <Field\r\n                                type='text'\r\n                                className='form-control form-control-solid'\r\n                                placeholder='Enter card number'\r\n                                name='cardNumber'\r\n                              />\r\n                              <div className='fv-plugins-message-container invalid-feedback'>\r\n                                <ErrorMessage name='cardNumber' />\r\n                              </div>\r\n\r\n                              <div className='position-absolute translate-middle-y top-50 end-0 me-5'>\r\n                                <img\r\n                                  src={toAbsoluteUrl('/media/svg/card-logos/visa.svg')}\r\n                                  alt=''\r\n                                  className='h-25px'\r\n                                />\r\n                                <img\r\n                                  src={toAbsoluteUrl('/media/svg/card-logos/mastercard.svg')}\r\n                                  alt=''\r\n                                  className='h-25px'\r\n                                />\r\n                                <img\r\n                                  src={toAbsoluteUrl('/media/svg/card-logos/american-express.svg')}\r\n                                  alt=''\r\n                                  className='h-25px'\r\n                                />\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                          <div className='row mb-10'>\r\n                            <div className='col-md-8 fv-row'>\r\n                              <label className='required fs-6 fw-bold form-label mb-2'>\r\n                                Expiration Date\r\n                              </label>\r\n\r\n                              <div className='row fv-row'>\r\n                                <div className='col-6'>\r\n                                  <Field\r\n                                    as='select'\r\n                                    name='cardExpiryMonth'\r\n                                    className='form-select form-select-solid'\r\n                                  >\r\n                                    <option></option>\r\n                                    <option value='1'>1</option>\r\n                                    <option value='2'>2</option>\r\n                                    <option value='3'>3</option>\r\n                                    <option value='4'>4</option>\r\n                                    <option value='5'>5</option>\r\n                                    <option value='6'>6</option>\r\n                                    <option value='7'>7</option>\r\n                                    <option value='8'>8</option>\r\n                                    <option value='9'>9</option>\r\n                                    <option value='10'>10</option>\r\n                                    <option value='11'>11</option>\r\n                                    <option value='12'>12</option>\r\n                                  </Field>\r\n                                  <div className='fv-plugins-message-container invalid-feedback'>\r\n                                    <ErrorMessage name='cardExpiryMonth' />\r\n                                  </div>\r\n                                </div>\r\n\r\n                                <div className='col-6'>\r\n                                  <Field\r\n                                    as='select'\r\n                                    name='cardExpiryYear'\r\n                                    className='form-select form-select-solid'\r\n                                  >\r\n                                    <option></option>\r\n                                    <option value='2021'>2021</option>\r\n                                    <option value='2022'>2022</option>\r\n                                    <option value='2023'>2023</option>\r\n                                    <option value='2024'>2024</option>\r\n                                    <option value='2025'>2025</option>\r\n                                    <option value='2026'>2026</option>\r\n                                    <option value='2027'>2027</option>\r\n                                    <option value='2028'>2028</option>\r\n                                    <option value='2029'>2029</option>\r\n                                    <option value='2030'>2030</option>\r\n                                    <option value='2031'>2031</option>\r\n                                  </Field>\r\n                                  <div className='fv-plugins-message-container invalid-feedback'>\r\n                                    <ErrorMessage name='cardExpiryYear' />\r\n                                  </div>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n\r\n                            <div className='col-md-4 fv-row'>\r\n                              <label className='d-flex align-items-center fs-6 fw-bold form-label mb-2'>\r\n                                <span className='required'>CVV</span>\r\n                                <i\r\n                                  className='fas fa-exclamation-circle ms-2 fs-7'\r\n                                  data-bs-toggle='tooltip'\r\n                                  title='Enter a card CVV code'\r\n                                ></i>\r\n                              </label>\r\n\r\n                              <div className='position-relative'>\r\n                                <Field\r\n                                  type='text'\r\n                                  className='form-control form-control-solid'\r\n                                  placeholder='CVV'\r\n                                  name='cardCvv'\r\n                                />\r\n                                <div className='fv-plugins-message-container invalid-feedback'>\r\n                                  <ErrorMessage name='cardCvv' />\r\n                                </div>\r\n\r\n                                <div className='position-absolute translate-middle-y top-50 end-0 me-3'>\r\n                                  <KTSVG\r\n                                    path='/media/icons/duotune/finance/fin002.svg'\r\n                                    className='svg-icon-2hx'\r\n                                  />\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                          <div className='d-flex flex-stack'>\r\n                            <div className='me-5'>\r\n                              <label className='fs-6 fw-bold form-label'>\r\n                                Save Card for further billing?\r\n                              </label>\r\n                              <div className='fs-7 fw-bold text-gray-400'>\r\n                                If you need more info, please check budget planning\r\n                              </div>\r\n                            </div>\r\n\r\n                            <label className='form-check form-switch form-check-custom form-check-solid'>\r\n                              <Field className='form-check-input' type='checkbox' />\r\n                              <span className='form-check-label fw-bold text-gray-400'>\r\n                                Save Card\r\n                              </span>\r\n                            </label>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n\r\n                      <div data-kt-stepper-element='content'>\r\n                        <div className='w-100 text-center'>\r\n                          <h1 className='fw-bolder text-dark mb-3'>Release!</h1>\r\n\r\n                          <div className='text-muted fw-bold fs-3'>\r\n                            Submit your app to kickstart your project.\r\n                          </div>\r\n\r\n                          <div className='text-center px-4 py-15'>\r\n                            <img\r\n                              src={toAbsoluteUrl('/media/illustrations/sketchy-1/9.png')}\r\n                              alt=''\r\n                              className='w-100 mh-300px'\r\n                            />\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n\r\n                      <div className='d-flex flex-stack pt-10'>\r\n                        <div className='me-2'>\r\n                          <button\r\n                            onClick={prevStep}\r\n                            type='button'\r\n                            className='btn btn-lg btn-light-primary me-3'\r\n                            data-kt-stepper-action='previous'\r\n                          >\r\n                            <KTSVG\r\n                              path='/media/icons/duotune/arrows/arr063.svg'\r\n                              className='svg-icon-4 me-1'\r\n                            />\r\n                            Back\r\n                          </button>\r\n                        </div>\r\n\r\n                        <div>\r\n                          <button type='submit' className='btn btn-lg btn-primary me-3'>\r\n                            <span className='indicator-label'>\r\n                              {stepper.current?.currentStepIndex !==\r\n                                stepper.current?.totatStepsNumber! - 1 && 'Continue'}\r\n                              {stepper.current?.currentStepIndex ===\r\n                                stepper.current?.totatStepsNumber! - 1 && 'Submit'}\r\n                              <KTSVG\r\n                                path='/media/icons/duotune/arrows/arr064.svg'\r\n                                className='svg-icon-3 ms-2 me-0'\r\n                              />\r\n                            </span>\r\n                          </button>\r\n                        </div>\r\n                      </div>\r\n                    </Form>\r\n                  )}\r\n                </Formik>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {Main}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, {FC} from 'react'\r\nimport {KTSVG, toAbsoluteUrl} from '../../../helpers'\r\n\r\nconst InviteUsers: FC = () => {\r\n  const users = [\r\n    {\r\n      avatar: '/media/avatars/150-1.jpg',\r\n      name: 'Emma Smith',\r\n      email: 'e.smith@kpmg.com.au',\r\n      access: '1',\r\n    },\r\n    {\r\n      state: 'danger',\r\n      name: 'Melody Macy',\r\n      email: 'melody@altbox.com',\r\n      access: '1',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-2.jpg',\r\n      name: 'Max Smith',\r\n      email: 'max@kt.com',\r\n      access: '3',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-2.jpg',\r\n      name: 'Sean Bean',\r\n      email: 'sean@dellito.com',\r\n      access: '2',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-15.jpg',\r\n      name: 'Brian Cox',\r\n      email: 'brian@exchange.com',\r\n      access: '3',\r\n    },\r\n    {\r\n      state: 'warning',\r\n      name: 'Mikaela Collins',\r\n      email: 'mikaela@pexcom.com',\r\n      access: '2',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-8.jpg',\r\n      name: 'Francis Mitcham',\r\n      email: 'f.mitcham@kpmg.com.au',\r\n      access: '3',\r\n    },\r\n    {\r\n      state: 'danger',\r\n      name: 'Olivia Wild',\r\n      email: 'olivia@corpmail.com',\r\n      access: '2',\r\n    },\r\n    {\r\n      state: 'info',\r\n      name: 'Neil Owen',\r\n      email: 'owen.neil@gmail.com',\r\n      access: '1',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-6.jpg',\r\n      name: 'Dan Wilson',\r\n      email: 'dam@consilting.com',\r\n      access: '3',\r\n    },\r\n    {\r\n      state: 'danger',\r\n      name: 'Emma Bold',\r\n      email: 'emma@intenso.com',\r\n      access: '2',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-7.jpg',\r\n      name: 'Ana Crown',\r\n      email: 'ana.cf@limtel.com',\r\n      access: '1',\r\n    },\r\n    {\r\n      state: 'primary',\r\n      name: 'Robert Doe',\r\n      email: 'robert@benko.com',\r\n      access: '3',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-17.jpg',\r\n      name: 'John Miller',\r\n      email: 'miller@mapple.com',\r\n      access: '3',\r\n    },\r\n    {\r\n      state: 'success',\r\n      name: 'Lucy Kunic',\r\n      email: 'lucy.m@fentech.com',\r\n      access: '2',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-10.jpg',\r\n      name: 'Ethan Wilder',\r\n      email: 'ethan@loop.com.au',\r\n      access: '1',\r\n    },\r\n    {\r\n      avatar: '/media/avatars/150-7.jpg',\r\n      name: 'Ana Crown',\r\n      email: 'ana.cf@limtel.com',\r\n      access: '3',\r\n    },\r\n  ]\r\n\r\n  return (\r\n    <div className='modal fade' id='kt_modal_invite_friends' aria-hidden='true'>\r\n      <div className='modal-dialog mw-650px'>\r\n        <div className='modal-content'>\r\n          <div className='modal-header pb-0 border-0 justify-content-end'>\r\n            <div className='btn btn-sm btn-icon btn-active-color-primary' data-bs-dismiss='modal'>\r\n              <KTSVG path='/media/icons/duotune/arrows/arr061.svg' className='svg-icon-1' />\r\n            </div>\r\n          </div>\r\n\r\n          <div className='modal-body scroll-y mx-5 mx-xl-18 pt-0 pb-15'>\r\n            <div className='text-center mb-13'>\r\n              <h1 className='mb-3'>Invite a Friend</h1>\r\n\r\n              <div className='text-muted fw-bold fs-5'>\r\n                If you need more info, please check out\r\n                <a href='#' className='link-primary fw-bolder'>\r\n                  {' '}\r\n                  FAQ Page\r\n                </a>\r\n                .\r\n              </div>\r\n            </div>\r\n\r\n            <div className='btn btn-light-primary fw-bolder w-100 mb-8'>\r\n              <img\r\n                alt='Logo'\r\n                src={toAbsoluteUrl('/media/svg/brand-logos/google-icon.svg')}\r\n                className='h-20px me-3'\r\n              />\r\n              Invite Gmail Contacts\r\n            </div>\r\n\r\n            <div className='separator d-flex flex-center mb-8'>\r\n              <span className='text-uppercase bg-body fs-7 fw-bold text-muted px-3'>or</span>\r\n            </div>\r\n\r\n            <textarea\r\n              className='form-control form-control-solid mb-8'\r\n              rows={3}\r\n              placeholder='Type or paste emails here'\r\n            ></textarea>\r\n\r\n            <div className='mb-10'>\r\n              <div className='fs-6 fw-bold mb-2'>Your Invitations</div>\r\n\r\n              <div className='mh-300px scroll-y me-n7 pe-7'>\r\n                {users.map((user, i) => {\r\n                  return (\r\n                    <div\r\n                      className='d-flex flex-stack py-4 border-bottom border-gray-300 border-bottom-dashed'\r\n                      key={i}\r\n                    >\r\n                      <div className='d-flex align-items-center'>\r\n                        <div className='symbol symbol-35px symbol-circle'>\r\n                          {user.avatar && <img alt='Pic' src={toAbsoluteUrl(user.avatar)} />}\r\n                          {user.state && (\r\n                            <div className='symbol symbol-35px symbol-circle'>\r\n                              <span\r\n                                className={`symbol-label bg-light-${user.state} text-${user.state} fw-bold`}\r\n                              >\r\n                                {user.name.charAt(0)}\r\n                              </span>\r\n                            </div>\r\n                          )}\r\n                        </div>\r\n\r\n                        <div className='ms-5'>\r\n                          <a\r\n                            href='#'\r\n                            className='fs-5 fw-bolder text-gray-900 text-hover-primary mb-2'\r\n                          >\r\n                            {user.name}\r\n                          </a>\r\n                          <div className='fw-bold text-muted'>{user.email}</div>\r\n                        </div>\r\n                      </div>\r\n\r\n                      <div className='ms-2 w-100px'>\r\n                        <select\r\n                          defaultValue={'2'}\r\n                          className='form-select form-select-solid form-select-sm select2-hidden-accessible'\r\n                        >\r\n                          <option value='1'>Guest</option>\r\n                          <option value='2' data-select2-id='select2-data-12-vz6w'>\r\n                            Owner\r\n                          </option>\r\n                          <option value='3'>Can Edit</option>\r\n                        </select>\r\n                      </div>\r\n                    </div>\r\n                  )\r\n                })}\r\n              </div>\r\n            </div>\r\n\r\n            <div className='d-flex flex-stack'>\r\n              <div className='me-5 fw-bold'>\r\n                <label className='fs-6'>Adding Users by Team Members</label>\r\n                <div className='fs-7 text-muted'>\r\n                  If you need more info, please check budget planning\r\n                </div>\r\n              </div>\r\n\r\n              <label className='form-check form-switch form-check-custom form-check-solid'>\r\n                <input className='form-check-input' type='checkbox' value='1' />\r\n\r\n                <span className='form-check-label fw-bold text-muted'>Allowed</span>\r\n              </label>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {InviteUsers}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, {FC, useState} from 'react'\r\nimport {KTSVG} from '../../../helpers'\r\n\r\nconst plans = [\r\n  {\r\n    title: 'Startup',\r\n    subTitle: 'Best for startups',\r\n    description: 'Optimal for 10+ team size and new startup',\r\n    priceMonth: '39',\r\n    priceAnnual: '399',\r\n    default: true,\r\n    custom: false,\r\n    features: [\r\n      {\r\n        title: 'Up to 10 Active Users',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Up to 30 Project Integrations',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Analytics Module',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Finance Module',\r\n        supported: false,\r\n      },\r\n      {\r\n        title: 'Accounting Module',\r\n        supported: false,\r\n      },\r\n      {\r\n        title: 'Network Platform',\r\n        supported: false,\r\n      },\r\n      {\r\n        title: 'Unlimited Cloud Space',\r\n        supported: false,\r\n      },\r\n    ],\r\n  },\r\n\r\n  {\r\n    title: 'Advanced',\r\n    subTitle: 'Best for 100+ team size',\r\n    description: 'Optimal for 100+ team size and grown company',\r\n    priceMonth: '339',\r\n    priceAnnual: '3399',\r\n    default: false,\r\n    custom: false,\r\n    features: [\r\n      {\r\n        title: 'Up to 10 Active Users',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Up to 30 Project Integrations',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Analytics Module',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Finance Module',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Accounting Module',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Network Platform',\r\n        supported: false,\r\n      },\r\n      {\r\n        title: 'Unlimited Cloud Space',\r\n        supported: false,\r\n      },\r\n    ],\r\n  },\r\n\r\n  {\r\n    title: 'Enterprise',\r\n    subTitle: 'Best value for 1000+ team',\r\n    description: 'Optimal for 1000+ team and enterpise',\r\n    priceMonth: '999',\r\n    priceAnnual: '9999',\r\n    label: 'Most popular',\r\n    default: false,\r\n    custom: false,\r\n    features: [\r\n      {\r\n        title: 'Up to 10 Active Users',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Up to 30 Project Integrations',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Analytics Module',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Finance Module',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Accounting Module',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Network Platform',\r\n        supported: true,\r\n      },\r\n      {\r\n        title: 'Unlimited Cloud Space',\r\n        supported: true,\r\n      },\r\n    ],\r\n  },\r\n\r\n  {\r\n    title: 'Custom',\r\n    subTitle: 'Requet a custom license',\r\n    default: false,\r\n    custom: true,\r\n  },\r\n]\r\n\r\nconst UpgradePlan: FC = () => {\r\n  const [currentState, setCurrentState] = useState<'month' | 'annual'>('month')\r\n  const [selected, setSelected] = useState('Startup')\r\n\r\n  return (\r\n    <div className='modal fade' id='kt_modal_upgrade_plan' aria-hidden='true'>\r\n      <div className='modal-dialog modal-xl'>\r\n        <div className='modal-content rounded'>\r\n          <div className='modal-header justify-content-end border-0 pb-0'>\r\n            <div className='btn btn-sm btn-icon btn-active-color-primary' data-bs-dismiss='modal'>\r\n              <KTSVG path='/media/icons/duotune/arrows/arr061.svg' className='svg-icon-1' />\r\n            </div>\r\n          </div>\r\n\r\n          <div className='modal-body pt-0 pb-15 px-5 px-xl-20'>\r\n            <div className='mb-13 text-center'>\r\n              <h1 className='mb-3'>Upgrade a Plan</h1>\r\n\r\n              <div className='text-muted fw-bold fs-5'>\r\n                If you need more info, please check{' '}\r\n                <a href='#' className='link-primary fw-bolder'>\r\n                  Pricing Guidelines\r\n                </a>\r\n                .\r\n              </div>\r\n            </div>\r\n\r\n            <div className='d-flex flex-column'>\r\n              <div className='nav-group nav-group-outline mx-auto' data-kt-buttons='true'>\r\n                <a\r\n                  href='#'\r\n                  className={\r\n                    'btn btn-color-gray-400 btn-active btn-active-secondary px-6 py-3 me-2 ' +\r\n                    (currentState === 'month' && 'active')\r\n                  }\r\n                  onClick={() => {\r\n                    setCurrentState('month')\r\n                  }}\r\n                  data-kt-plan='month'\r\n                >\r\n                  Monthly\r\n                </a>\r\n                <a\r\n                  href='#'\r\n                  className={\r\n                    'btn btn-color-gray-400 btn-active btn-active-secondary px-6 py-3 me-2 ' +\r\n                    (currentState === 'annual' && 'active')\r\n                  }\r\n                  onClick={() => {\r\n                    setCurrentState('annual')\r\n                  }}\r\n                  data-kt-plan='annual'\r\n                >\r\n                  Annual\r\n                </a>\r\n              </div>\r\n\r\n              <div className='row mt-10'>\r\n                <div className='col-lg-6 mb-10 mb-lg-0'>\r\n                  <div className='nav flex-column'>\r\n                    {plans.map((plan, index) => {\r\n                      return (\r\n                        <div\r\n                          onClick={() => {\r\n                            setSelected(plan.title)\r\n                          }}\r\n                          className={\r\n                            `nav-link btn btn-outline btn-outline-dashed btn-color-dark d-flex flex-stack text-start p-6 ` +\r\n                            (index !== plans.length - 1 && 'mb-6 ') +\r\n                            (plan.default && 'active ') +\r\n                            (!plan.custom && 'btn-active btn-active-primary ')\r\n                          }\r\n                          data-bs-toggle='tab'\r\n                          data-bs-target={`#kt_upgrade_plan_${index}`}\r\n                          key={index}\r\n                        >\r\n                          <div className='d-flex align-items-center me-2'>\r\n                            <div className='form-check form-check-custom form-check-solid form-check-success me-6'>\r\n                              <input\r\n                                className='form-check-input'\r\n                                type='radio'\r\n                                name='plan'\r\n                                value={plan.title}\r\n                                checked={selected === plan.title}\r\n                                onChange={(e) => setSelected(e.target.value)}\r\n                              />\r\n                            </div>\r\n\r\n                            <div className='flex-grow-1'>\r\n                              <h2 className='d-flex align-items-center fs-2 fw-bolder flex-wrap'>\r\n                                {plan.title}\r\n\r\n                                {plan.label && (\r\n                                  <span className='badge badge-light-success ms-2 fs-7'>\r\n                                    {plan.label}\r\n                                  </span>\r\n                                )}\r\n                              </h2>\r\n                              <div className='fw-bold opacity-50'>{plan.subTitle}</div>\r\n                            </div>\r\n                          </div>\r\n\r\n                          <div className='ms-5'>\r\n                            {plan.custom && (\r\n                              <button className='btn btn-sm btn-primary'>Contact Us</button>\r\n                            )}\r\n                            {!plan.custom && (\r\n                              <>\r\n                                <span className='mb-2'>$</span>\r\n\r\n                                <span className='fs-3x fw-bolder'>\r\n                                  {currentState === 'month' ? plan.priceMonth : plan.priceAnnual}\r\n                                </span>\r\n\r\n                                <span className='fs-7 opacity-50'>\r\n                                  /<span data-kt-element='period'>Mon</span>\r\n                                </span>\r\n                              </>\r\n                            )}\r\n                          </div>\r\n                        </div>\r\n                      )\r\n                    })}\r\n                  </div>\r\n                </div>\r\n\r\n                <div className='col-lg-6'>\r\n                  <div className='tab-content rounded h-100 bg-light p-10'>\r\n                    {plans.map((plan, index) => {\r\n                      return (\r\n                        <div key={`custom${index}`}>\r\n                          {!plan.custom && (\r\n                            <>\r\n                              <div\r\n                                className={`tab-pane fade` + (plan.default && 'show active')}\r\n                                id={`kt_upgrade_plan_${index}`}\r\n                                key={index}\r\n                              >\r\n                                <div className='pb-5'>\r\n                                  <h2 className='fw-bolder text-dark'>What’s in Startup Plan?</h2>\r\n\r\n                                  <div className='text-gray-400 fw-bold'>{plan.description}</div>\r\n                                </div>\r\n\r\n                                <div className='pt-1'>\r\n                                  {plan.features!.map((feature, i) => {\r\n                                    return (\r\n                                      <div\r\n                                        className={\r\n                                          `d-flex align-items-center` +\r\n                                          (i !== plan.features!.length - 1 && ' mb-7')\r\n                                        }\r\n                                        key={`${i}-${feature.title}`}\r\n                                      >\r\n                                        {feature.supported && (\r\n                                          <>\r\n                                            <span className='fw-bold fs-5 text-gray-700 flex-grow-1'>\r\n                                              {feature.title}\r\n                                            </span>\r\n\r\n                                            <KTSVG\r\n                                              path='/media/icons/duotune/general/gen043.svg'\r\n                                              className='svg-icon-1 svg-icon-success'\r\n                                            />\r\n                                          </>\r\n                                        )}\r\n                                        {!feature.supported && (\r\n                                          <>\r\n                                            <span className='fw-bold fs-5 text-gray-400 flex-grow-1'>\r\n                                              {feature.title}\r\n                                            </span>\r\n                                            <KTSVG\r\n                                              path='/media/icons/duotune/general/gen040.svg'\r\n                                              className='svg-icon-1'\r\n                                            />\r\n                                          </>\r\n                                        )}\r\n                                      </div>\r\n                                    )\r\n                                  })}\r\n                                </div>\r\n                              </div>\r\n                            </>\r\n                          )}\r\n                        </div>\r\n                      )\r\n                    })}\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <div className='d-flex flex-center flex-row-fluid pt-12'>\r\n              <button type='reset' className='btn btn-light me-3' data-bs-dismiss='modal'>\r\n                Cancel\r\n              </button>\r\n\r\n              <button type='submit' className='btn btn-primary'>\r\n                Upgrade Plan\r\n              </button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport {UpgradePlan}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport { FC } from 'react'\r\ntype Props = { isDrawer?: boolean }\r\n\r\nconst ChatInner: FC<Props> = ({ isDrawer = false }) => {\r\n  return (<div></div>)\r\n}\r\n\r\nexport { ChatInner }\r\n","import {FC} from 'react'\r\nimport './arrow.scss'\r\n\r\ntype ArrowProps = {\r\n  title: string\r\n  href: string\r\n  color: string | 'white'\r\n  isRight?: boolean | true\r\n  isCircle?: boolean | false\r\n}\r\n\r\nconst ArrowNavigation: FC<ArrowProps> = ({title, href, isRight, isCircle, color}) => {\r\n  return (\r\n    <div className='arrow-wrapper'>\r\n      {/* Arrow left */}\r\n      <div className={`arrow arrow--left arrow--${color}`} style={{display: isRight ? 'none' : ''}}>\r\n        <span></span>\r\n      </div>\r\n      <a href={href} className={`explore explore-${isRight ? 'right' : 'left'} ${color}`}>\r\n        {title}\r\n      </a>\r\n      {/* Arrow right */}\r\n      <div\r\n        className={`arrow arrow--right arrow--${color}`}\r\n        style={{display: !isRight ? 'none' : ''}}\r\n      >\r\n        <span></span>\r\n      </div>\r\n      <div className={`circle ${color}`} style={{display: !isCircle ? 'none' : ''}}></div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default ArrowNavigation\r\n","import {ILayout} from './LayoutModels'\r\n\r\nexport const DefaultLayoutConfig: ILayout = {\r\n  main: {\r\n    type: 'default',\r\n    primaryColor: '#009EF7',\r\n    darkSkinEnabled: true,\r\n  },\r\n  loader: {\r\n    display: true,\r\n    type: 'default', // Set default|spinner-message|spinner-logo to hide or show page loader\r\n  },\r\n  scrolltop: {\r\n    display: true,\r\n  },\r\n  header: {\r\n    display: true, // Set true|false to show or hide Header\r\n    width: 'fixed', // Set fixed|fluid to change width type\r\n    left: 'menu',\r\n    fixed: {\r\n      desktop: true, // Set true|false to set fixed Header for desktop mode\r\n      tabletAndMobile: true, // Set true|false to set fixed Header for tablet and mobile modes\r\n    },\r\n    menuIcon: 'svg',\r\n  },\r\n  megaMenu: {\r\n    display: true, // Set true|false to show or hide Mega Menu\r\n  },\r\n  aside: {\r\n    display: false,\r\n    theme: 'dark',\r\n    menu: 'main',\r\n    fixed: true,\r\n    minimized: false,\r\n    minimize: true,\r\n    hoverable: true,\r\n    menuIcon: 'svg',\r\n  },\r\n  content: {\r\n    width: 'fixed', // Set fixed|fluid to change width\r\n    layout: 'default',\r\n  },\r\n  toolbar: {\r\n    display: true, // Display toolbar\r\n    width: 'fixed', // Set fixed|fluid to change width type,\r\n    fixed: {\r\n      desktop: true,\r\n      tabletAndMobileMode: true,\r\n    },\r\n    layout: 'toolbar1',\r\n    layouts: {\r\n      toolbar1: {\r\n        height: '55px',\r\n        heightAndTabletMobileMode: '55px',\r\n      },\r\n      toolbar2: {\r\n        height: '75px',\r\n        heightAndTabletMobileMode: '65px',\r\n      },\r\n      toolbar3: {\r\n        height: '55px',\r\n        heightAndTabletMobileMode: '55px',\r\n      },\r\n      toolbar4: {\r\n        height: '65px',\r\n        heightAndTabletMobileMode: '65px',\r\n      },\r\n      toolbar5: {\r\n        height: '75px',\r\n        heightAndTabletMobileMode: '65px',\r\n      },\r\n    },\r\n  },\r\n  footer: {\r\n    width: 'fixed', // Set fixed|fluid to change width type\r\n  },\r\n  pageTitle: {\r\n    display: true,\r\n    breadCrumbs: true,\r\n    description: false,\r\n    layout: 'default',\r\n    direction: 'row',\r\n    responsive: true,\r\n    responsiveBreakpoint: 'lg',\r\n    responsiveTarget: '#kt_toolbar_container',\r\n  },\r\n}\r\n"],"sourceRoot":""}