{"version":3,"sources":["images/icons/_.svg","components/courseCard2/Steps/CreateMarketplaceSteps1.js","components/courseCard2/Steps/CreateMarketplaceSteps2.js","components/courseCard2/CreateMarketplaceModal.js","components/courseCard2/styles.js","images/icons/certificate-purple.svg","components/courseCard2/index.js","images/icons/Marketplace.png","images/icons/MarketplaceInInactive.png","components/courseCard2/Vector.svg","components/courseCard2/FileText.svg","components/courseCard2/classroom-01.svg","images/icons/3dot.svg"],"names":["Form","styled","div","RowButton","connect","locale","Language","courses","ProgramCertificate","getCourses","autoIssueObj","setAutoIssueObj","marginBotton","gapBotton","onClose","setStepsComponent","name","checked","checked1","isActive","style","marginTop","marginLeft","alignItems","onChange","e","prevState","target","text","id","lineHeight","fontSize","color","checked2","checked3","display","justifyContent","gap","cancelcer","type","onClick","full","margin","padding","width","primary","disabled","InformationSchema","Yup","shape","Learner","required","THB","expiredCategory","label","value","expiredSubcategory","Image","img","courseMarketplacesCategory","CourseMarketplaces","courseCategories","CourseCategories","Alert","getCourseMarketplacesCategory","createCourseMarketplaces","getCourseCategories","getCourseCategoriesWithCount","dataProps","useState","categories","setCategories","subCategories","setSubCategories","show","setShow","showInput","setShowInput","useEffect","array","map","push","console","log","initialValues","validationSchema","onSubmit","values","a","dataObj","registrationFee","numberOfRegistration","courseId","subCategoryId","categoryId","schoolId","success","title","description","error","errors","touched","handleChange","handleSubmit","setFieldValue","src","mondayflower","find","options","_subCategory","event","subcategories","item","placeholder","height","borderColor","prefix","textAlign","isRequired","status","messageStatus","Title","props","theme","Container","dataDefault","openModal","widthModal","setWidthModal","stepsComponent","setMarginBotton","setgapBotton","useWindowSize","isTabletSize","ModalValue","isOpen","onRequestClose","contentStyle","shownXclose","onClickClose","closeStyle","top","right","GridItem","Content","url","Name","Typography","Description","black87","IconWithText","Avatar","primary2","grey","start","css","gray6","StyledLink","Link","Status","CardCertifivate","StatusFlag","Bottom","StarGroup","ImageX","NotificationContainer","Row","CardSubCategory","whiteblue","PriceText","price","packagePrice","gradient","bold","getPrice","Array","isArray","length","quantity","CourseCard2","shortDescription","image","link","localeProps","location","isDraft","lNumb","lectureNum","avgRating","isCertificate","useMeasure","ref","isMarketplac","setIsMarketplace","openMarketplaceModal","setOpenMarketplaceModal","isOpenSetting","setIsOpenSetting","valuesData","setValuesData","ShowAdd","test","pathname","_get","filter","lecture","to","getImageUrl","DefaultImage","Flag","placement","trigger","tooltip","onMouseEnter","onMouseLeave","alt","size","borderRadius","fontWeight","Dot","nowrap","subCategory","border","black10","className","_","times","index","FullStar","EmptyStar","alignSelf","toString"],"mappings":"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","file":"static/js/2.b57750e6.chunk.js","sourcesContent":["export default __webpack_public_path__ + \"static/media/_.d81aeb01.svg\";","import React from 'react'\nimport styled from 'styled-components'\nimport { Checkbox as CheckInput } from 'antd'\nimport { Typography, Button } from 'components'\nimport { connect } from 'react-redux'\nconst Form = styled.div`\n  input {\n    margin-bottom: 5px;\n  }\n  /* span {\n    margin-bottom: 10px;\n  } */\n  .ant-checkbox .ant-checkbox-inner {\n    border-color: #3d4453;\n  }\n  .ant-checkbox-checked .ant-checkbox-inner {\n    background-color: #253e87;\n    border-color: #253e87;\n  }\n  .ant-radio-checked .ant-radio-inner {\n    border: 1px solid #253e87;\n  }\n  .ant-radio-checked .ant-radio-inner:after {\n    background-color: #253e87;\n    border: 1px solid #253e87;\n  }\n  height: 100%;\n`\nconst RowButton = styled.div`\n  display: flex;\n  > :nth-child(1) {\n    margin-right: 10px;\n  }\n  > :nth-child(2) {\n    margin-left: 10px;\n  }\n`\nconst CreateMarketplaceSteps1 = ({\n  autoIssueObj,\n  setAutoIssueObj,\n  marginBotton,\n  gapBotton,\n  onClose,\n  setStepsComponent,\n  locale,\n}) => {\n  return (\n    <Form>\n      <CheckInput\n        name=\"checked1\"\n        checked={autoIssueObj.checked1.isActive}\n        style={{ marginTop: '12px', marginLeft: '8px', alignItems: 'center' }}\n        onChange={(e) => {\n          setAutoIssueObj((prevState) => ({\n            ...prevState,\n            checked1: { isActive: e.target.checked, text: autoIssueObj.checked1.text },\n          }))\n        }}\n      >\n        <Typography\n          id=\"programMarketplace.label.checked1\"\n          lineHeight={1.5}\n          fontSize=\"text-xs\"\n          color=\"primary1\"\n        >\n          {autoIssueObj.checked1.text}\n        </Typography>\n      </CheckInput>\n      <CheckInput\n        name=\"checked2\"\n        checked={autoIssueObj.checked2.isActive}\n        style={{ marginTop: '12px', alignItems: 'center' }}\n        onChange={(e) => {\n          setAutoIssueObj((prevState) => ({\n            ...prevState,\n            checked2: { isActive: e.target.checked, text: autoIssueObj.checked2.text },\n          }))\n        }}\n      >\n        <Typography\n          id=\"programMarketplace.label.checked2\"\n          lineHeight={1.5}\n          fontSize=\"text-xs\"\n          color=\"primary1\"\n        >\n          {autoIssueObj.checked2.text}\n        </Typography>\n      </CheckInput>\n      <CheckInput\n        name=\"checked3\"\n        checked={autoIssueObj.checked3.isActive}\n        style={{ marginTop: '12px', alignItems: 'center' }}\n        onChange={(e) => {\n          setAutoIssueObj((prevState) => ({\n            ...prevState,\n            checked3: { isActive: e.target.checked, text: autoIssueObj.checked3.text },\n          }))\n        }}\n      >\n        <Typography\n          id=\"programMarketplace.label.checked3\"\n          lineHeight={1.5}\n          fontSize=\"text-xs\"\n          color=\"primary1\"\n        >\n          {autoIssueObj.checked3.text}\n        </Typography>\n      </CheckInput>\n      <RowButton\n        style={{\n          display: 'flex',\n          justifyContent: 'center',\n          alignItems: 'flex-end',\n          marginTop: `${marginBotton}px`,\n          gap: `${gapBotton}px`,\n        }}\n      >\n        <Button\n          id=\"button.cancel\"\n          cancelcer\n          type=\"submit\"\n          fontSize=\"text-base\"\n          onClick={onClose}\n          full\n          style={{ margin: '5px 0px 0px', padding: '12px 30px', width: '50%' }}\n        >\n          {locale === 'th' ? 'ยกเลิก' : 'Cancel'}\n        </Button>\n        <Button\n          id=\"button.Agree\"\n          type=\"submit\"\n          primary={\n            autoIssueObj.checked1.isActive &&\n            autoIssueObj.checked2.isActive &&\n            autoIssueObj.checked3.isActive\n              ? true\n              : false\n          }\n          fontSize=\"text-base\"\n          disabled={\n            autoIssueObj.checked1.isActive &&\n            autoIssueObj.checked2.isActive &&\n            autoIssueObj.checked3.isActive\n              ? false\n              : true\n          }\n          onClick={() => {\n            setStepsComponent(2)\n          }}\n          style={{ margin: '5px 0px 0px', padding: '12px 30px', width: '50%' }}\n        >\n          {locale === 'th' ? 'เห็นด้วย' : 'Agree'}\n        </Button>\n      </RowButton>\n    </Form>\n  )\n}\nconst mapState = ({ Language: { locale }, ProgramCertificate: { courses } }) => ({\n  courses,\n  locale,\n})\n\nconst mapDispatch = ({ ProgramCertificate: { getCourses } }) => ({\n  getCourses,\n})\nexport default connect(mapState, mapDispatch)(CreateMarketplaceSteps1)\n","import React, { useState, useEffect } from 'react'\nimport { connect } from 'react-redux'\nimport styled from 'styled-components'\nimport { Button, Typography } from 'components'\n// import { Input } from 'antd'\nimport { Formik } from 'formik'\nimport * as Yup from 'yup'\nimport mondayflower from '../../../images/icons/_.svg'\nimport { Select, Input } from '../../index'\n\n// import Select from './selectcustom'\nconst InformationSchema = Yup.object().shape({\n  Learner: Yup.number().required('Required'),\n  THB: Yup.number().required('Required'),\n  expiredCategory: Yup.object().shape({\n    label: Yup.string().required('Required'),\n    value: Yup.object(),\n    id: Yup.string(),\n  }),\n  expiredSubcategory: Yup.object().shape({\n    label: Yup.string().required('Required'),\n    value: Yup.object(),\n    id: Yup.string(),\n  }),\n})\nconst Form = styled.div`\n  input {\n    margin-bottom: 5px;\n  }\n\n  /* span {\n    margin-bottom: 10px;\n  } */\n  .ant-checkbox .ant-checkbox-inner {\n    border-color: #3d4453;\n  }\n  .ant-checkbox-checked .ant-checkbox-inner {\n    background-color: #253e87;\n    border-color: #253e87;\n  }\n  .ant-radio-checked .ant-radio-inner {\n    border: 1px solid #253e87;\n  }\n  .ant-radio-checked .ant-radio-inner:after {\n    background-color: #253e87;\n    border: 1px solid #253e87;\n  }\n  height: 100%;\n`\nconst Image = styled.img`\n  display: flex;\n`\nconst RowButton = styled.div`\n  .select {\n    width: 100%;\n  }\n  @media (max-width: 375px) {\n    flex-direction: column;\n    gap: 5px;\n  }\n  display: flex;\n  > :nth-child(1) {\n  }\n  > :nth-child(2) {\n    margin-left: 10px;\n  }\n`\n// const Prefix = styled.div`\n//   height: 48px;\n// `\n// const months = [\n//   { label: '1', value: 1 },\n//   { label: '2', value: 2 },\n//   { label: '3', value: 3 },\n//   { label: '4', value: 4 },\n//   { label: '5', value: 5 },\n//   { label: '6', value: 6 },\n//   { label: '7', value: 7 },\n//   { label: '8', value: 8 },\n//   { label: '9', value: 9 },\n//   { label: '10', value: 10 },\n//   { label: '11', value: 11 },\n//   { label: '12', value: 12 },\n// ]\nconst CreateMarketplaceSteps2 = ({\n  marginBotton,\n  setStepsComponent,\n  locale,\n  courseCategories,\n  Alert,\n  onClose,\n  courseMarketplacesCategory,\n  dataProps,\n  createCourseMarketplaces,\n  // createCourseMarketplaces\n}) => {\n  const [categories, setCategories] = useState([])\n  const [subCategories, setSubCategories] = useState([])\n  const [show, setShow] = useState(false)\n  const [showInput, setShowInput] = useState(false)\n  useEffect(() => {\n    let array = []\n    courseCategories.map((e) => {\n      array.push({ label: e.name, value: e, id: e.id })\n    })\n    setCategories(array)\n  }, [courseCategories])\n  console.log('courseCategories', courseCategories, courseMarketplacesCategory, dataProps)\n  // function categoriesMapData() {\n  //   let array = []\n  //   courseCategories.map((e) => {\n  //     array.push({ label: e.name, value: e, id: e.id })\n  //   })\n  //   setCategories(array)\n  // }\n\n  return (\n    <>\n      <Formik\n        initialValues={{\n          Learner: null,\n          THB: null,\n          expiredCategory: {},\n          expiredSubcategory: {},\n        }}\n        validationSchema={InformationSchema}\n        onSubmit={async (values) => {\n          // same shape as initial values\n          let dataObj = {\n            registrationFee: values.THB,\n            numberOfRegistration: values.Learner,\n            courseId: dataProps.id,\n            subCategoryId: values.expiredSubcategory.id,\n            categoryId: values.expiredCategory.id,\n            schoolId: dataProps.schoolId,\n          }\n\n          try {\n            await createCourseMarketplaces(dataObj)\n            Alert.success({\n              title: 'Your course has been sent !',\n              description: 'Your course is being reviewed for approval.',\n            })\n            onClose()\n          } catch (e) {\n            onClose()\n            Alert.error({\n              title: 'Your course has been sent Failed ! ',\n            })\n          }\n          console.log(values)\n        }}\n      >\n        {({ errors, touched, values, handleChange, handleSubmit, setFieldValue }) => (\n          <Form>\n            <RowButton\n              style={{\n                display: 'flex',\n                justifyContent: 'center',\n                alignItems: 'flex-end',\n                marginTop: `${marginBotton}px`,\n                gap: `${0}px`,\n              }}\n            >\n              <div style={{ width: '100%' }}>\n                <div style={{ display: 'flex', gap: '3px', width: '100%' }}>\n                  <Typography id=\"Category\" color=\"primary1\" margin=\"0 0 3px 0\">\n                    Category\n                  </Typography>\n                  <Image src={mondayflower} />\n                </div>\n                <Select\n                  name=\"expiredCategory\"\n                  value={categories.find((e) => e.value.id === values.expiredCategory.id)}\n                  options={categories}\n                  onChange={(e) => {\n                    let _subCategory = []\n\n                    let event = { target: { name: 'expiredCategory', value: e } }\n                    console.log('e', e, event)\n                    e.value.subcategories.map((item) => {\n                      _subCategory.push({ label: item.name, value: item, id: item.id })\n                    })\n                    setSubCategories(_subCategory)\n                    setFieldValue('expiredSubcategory', {})\n                    handleChange(event)\n                  }}\n                  error={\n                    show ? (\n                      errors.expiredCategory && touched.expiredCategory ? (\n                        'Required'\n                      ) : (errors.expiredCategory && touched.expiredCategory) ||\n                        (errors.expiredSubcategory && touched.expiredSubcategory) ? (\n                        <Typography style={{ color: '#fff' }}>.</Typography>\n                      ) : (\n                        ''\n                      )\n                    ) : null\n                  }\n                  placeholder={locale === 'en' ? 'Category' : 'Category'}\n                />\n              </div>\n              {/* {errors.expiredCategory && touched.expiredCategory ? (\n                  <div>{errors.expiredCategory}</div>\n                ) : null} */}\n              <div style={{ width: '100%' }}>\n                <div style={{ display: 'flex', gap: '3px' }}>\n                  <Typography id=\"Subcategory\" color=\"primary1\" margin=\"0 0 3px 0\">\n                    Subcategory\n                  </Typography>\n                  <Image src={mondayflower} />\n                </div>\n                <Select\n                  name=\"expiredSubcategory\"\n                  options={subCategories}\n                  value={subCategories.find((e) => e.value.id === values.expiredCategory.id)}\n                  error={\n                    show ? (\n                      errors.expiredSubcategory && touched.expiredSubcategory ? (\n                        'Required'\n                      ) : (errors.expiredCategory && touched.expiredCategory) ||\n                        (errors.expiredSubcategory && touched.expiredSubcategory) ? (\n                        <Typography style={{ color: '#fff' }}>.</Typography>\n                      ) : (\n                        ''\n                      )\n                    ) : null\n                  }\n                  onChange={(e) => {\n                    let event = { target: { name: 'expiredSubcategory', value: e } }\n                    handleChange(event)\n                  }}\n                  placeholder={locale === 'en' ? 'Subcategory' : 'Subcategory'}\n                />\n              </div>\n            </RowButton>\n            <RowButton\n              style={{\n                display: 'flex',\n                justifyContent: 'center',\n                alignItems: 'flex-end',\n                marginTop: `${20}px`,\n                gap: `${5}px`,\n              }}\n            >\n              <div style={{ width: '100%' }}>\n                <div style={{ display: 'flex', gap: '3px', width: '100%' }}>\n                  <Typography id=\"Learner\" color=\"primary1\" margin=\"0 0 3px 0\">\n                    Registration Fee\n                  </Typography>\n                  <Image src={mondayflower} />\n                </div>\n                <Input\n                  name=\"Learner\"\n                  value={values.Learner}\n                  onChange={(e) => {\n                    handleChange(e)\n                  }}\n                  type=\"number\"\n                  placeholder=\"Learner\"\n                  style={{\n                    height: '48px',\n                    borderColor: errors.Learner && touched.Learner ? 'red' : '',\n                  }}\n                  prefix={\n                    <Typography style={{ width: 90, textAlign: 'center' }} color=\"black38\">\n                      Learner\n                    </Typography>\n                  }\n                  // prefix={\n                  //   <div style={{ width: 78, textAlign: 'center' }} className=\"select-country-code\">\n                  //     Learner\n                  //   </div>\n                  // }\n                  isRequired\n                  error={errors.Learner && touched.Learner ? 'Required' : null}\n                  // status={errors.Learner && touched.Learner ? 'Required' : null}\n                  // messageStatus={errors.Learner}\n                />\n\n                {showInput ? (\n                  errors.Learner && touched.Learner ? (\n                    <Typography color=\"danger1\">Required</Typography>\n                  ) : (errors.Learner && touched.Learner) || (errors.THB && touched.THB) ? (\n                    <Typography style={{ color: '#fff' }}>.</Typography>\n                  ) : (\n                    ''\n                  )\n                ) : null}\n              </div>\n              <div style={{ width: '100%' }}>\n                <div style={{ display: 'flex', gap: '3px', width: '100%' }}></div>\n                <Input\n                  name=\"THB\"\n                  value={values.THB}\n                  onChange={(e) => {\n                    handleChange(e)\n                  }}\n                  placeholder=\"THB\"\n                  style={{\n                    height: '48px',\n                    borderColor: errors.THB && touched.THB ? 'red' : '',\n                  }}\n                  prefix={\n                    <Typography style={{ width: 90, textAlign: 'center' }} color=\"black38\">\n                      THB\n                    </Typography>\n                  }\n                  type=\"number\"\n                  // modalman\n                  isRequired\n                  error={errors.THB && touched.THB ? 'Required' : null}\n                  status={errors.THB && touched.THB ? 'Required' : null}\n                  messageStatus={errors.THB}\n                />\n                {showInput ? (\n                  errors.THB && touched.THB ? (\n                    <Typography color=\"danger1\">Required</Typography>\n                  ) : (errors.Learner && touched.Learner) || (errors.THB && touched.THB) ? (\n                    <Typography style={{ color: '#fff' }}>.</Typography>\n                  ) : (\n                    ''\n                  )\n                ) : null}\n              </div>\n            </RowButton>\n            <div\n              style={{\n                display: 'flex',\n                justifyContent: 'center',\n                alignItems: 'flex-end',\n                marginTop: `${marginBotton}px`,\n                gap: `${10}px`,\n              }}\n            >\n              <div style={{ width: '100%' }}>\n                <div style={{ display: 'flex', gap: '3px', width: '100%' }}></div>\n                <Button\n                  id=\"button.back\"\n                  cancelcer\n                  type=\"submit\"\n                  fontSize=\"text-base\"\n                  onClick={() => setStepsComponent(1)}\n                  full\n                  style={{ margin: '5px 0px 0px', padding: '12px 30px', width: '100%' }}\n                >\n                  {locale === 'en' ? 'Back' : 'กลับ'}\n                </Button>\n              </div>\n\n              <div style={{ width: '100%' }}>\n                <div style={{ display: 'flex', gap: '3px', width: '100%' }}></div>\n                <Button\n                  id=\"button.Confirm\"\n                  type=\"submit\"\n                  primary\n                  fontSize=\"text-base\"\n                  onClick={(e) => {\n                    if (errors.THB || touched.THB || errors.Learner || touched.Learner) {\n                      setShowInput(true)\n                    } else {\n                      setShowInput(false)\n                    }\n                    if (\n                      errors.expiredSubcategory ||\n                      touched.expiredSubcategory ||\n                      errors.expiredCategory ||\n                      touched.expiredCategory\n                    ) {\n                      setShow(true)\n                    } else {\n                      setShow(false)\n                    }\n                    handleSubmit(e)\n                  }}\n                  // onClick={() => {\n                  //   setStepsComponent(2)\n                  // }}\n                  style={{ margin: '5px 0px 0px', padding: '12px 30px' }}\n                >\n                  {locale === 'en' ? 'Confirm' : 'ยืนยัน'}\n                </Button>\n              </div>\n            </div>\n          </Form>\n        )}\n      </Formik>\n    </>\n  )\n}\nconst mapState = ({\n  Language: { locale },\n  CourseMarketplaces: { courseMarketplacesCategory },\n  ProgramCertificate: { courses },\n  CourseCategories: { courseCategories },\n}) => ({\n  courses,\n  locale,\n  courseCategories,\n  courseMarketplacesCategory,\n})\n\nconst mapDispatch = ({\n  Alert,\n  ProgramCertificate: { getCourses },\n  CourseMarketplaces: { getCourseMarketplacesCategory, createCourseMarketplaces },\n  CourseCategories: { getCourseCategoriesWithCount },\n}) => ({\n  getCourses,\n  getCourseCategories: getCourseCategoriesWithCount,\n  getCourseMarketplacesCategory,\n  createCourseMarketplaces,\n\n  Alert,\n})\n\n// const mapDispatch = ({\n//   Course: { getCourseCatalog, getCourseCatalogCount },\n//   CourseCategories: { getCourseCategoriesWithCount },\n//   CourseLevels: { getCourseLevels },\n//   AppUser: { fetchMe, updateProfile },\n//   ModalState: { onOpenShowInstructor },\n//   Language: { updateLocale },\n//   Intro: { setOpenProfileMenu },\n// }) => ({\n//   getCourseCatalog,\n//   getCourseCatalogCount,\n//   getCourseCategories: getCourseCategoriesWithCount,\n//   getCourseLevels,\n//   fetchMe,\n//   updateProfile,\n//   updateLocale,\n//   onOpenShowInstructor,\n//   setOpenProfileMenu,\n// })\n\nexport default connect(mapState, mapDispatch)(CreateMarketplaceSteps2)\n","import styled from 'styled-components'\nimport React, { useState, useEffect } from 'react'\nimport { Typography } from 'components'\nimport { useWindowSize } from 'react-use'\nimport { connect } from 'react-redux'\nimport Modal from 'components/modal'\nimport CreateMarketplaceSteps1 from './Steps/CreateMarketplaceSteps1'\nimport CreateMarketplaceSteps2 from './Steps/CreateMarketplaceSteps2'\n// const Form = styled.div`\n//   input {\n//     margin-bottom: 5px;\n//   }\n//   /* span {\n//     margin-bottom: 5px;\n//   } */\n//   .ant-checkbox .ant-checkbox-inner {\n//     border-color: #3d4453;\n//   }\n//   .ant-checkbox-checked .ant-checkbox-inner {\n//     background-color: #253e87;\n//     border-color: #253e87;\n//   }\n//   .ant-radio-checked .ant-radio-inner {\n//     border: 1px solid #253e87;\n//   }\n//   .ant-radio-checked .ant-radio-inner:after {\n//     background-color: #253e87;\n//     border: 1px solid #253e87;\n//   }\n//   height: 100%;\n// `\n\nconst Title = styled((props) => <Typography {...props} />)`\n  font-size: ${({ theme }) => theme['text-xl']};\n  color: ${({ theme }) => theme['primary1']};\n  line-height: 28px;\n  font-weight: 700;\n  @media (max-width: 767px) {\n    text-align: center;\n  }\n`\n\n// const TitleSelect = styled((props) => <Typography {...props} />)`\n//   text-align: justify;\n//   margin-top: 25px;\n//   font-size: ${({ theme }) => theme['text-base']};\n//   color: ${({ theme }) => theme['primary1']};\n//   line-height: 24px;\n//   font-weight: 400;\n//   /* margin-top: 9px; */\n//   @media (max-width: 768px) {\n//     /* padding-top: 15px; */\n//   }\n// `\n\n// const Row = styled.div`\n//   display: flex;\n//   > :nth-child(1) {\n//     margin-right: 10px;\n//   }\n//   > :nth-child(2) {\n//     margin-left: 10px;\n//   }\n// `\n// const RowButton = styled.div`\n//   display: flex;\n//   > :nth-child(1) {\n//     margin-right: 10px;\n//   }\n//   > :nth-child(2) {\n//     margin-left: 10px;\n//   }\n// `\nconst Container = styled.div`\n  display: flex;\n  flex-direction: column;\n`\n\n// const ContainerX = styled.div`\n//   height: 100%;\n//   // background-color: red;\n//   display: flex;\n//   flex-direction: column;\n//   justify-content: space-between;\n// `\n// const Image = styled.img`\n//   display: flex;\n// `\nconst dataDefault = {\n  checked1: {\n    isActive: false,\n    text: 'คอร์สนี้ไม่ได้ใช้บทความ รูปภาพ ไฟล์เสียง ไฟล์วิดีโอที่ละเมิดลิขสิทธิ์',\n  },\n  checked2: {\n    isActive: false,\n    text: 'คอร์สนี้ไม่ได้มีเนื้อหาที่ขัดต่อ จริยธรรม ความเชื่อ ศาสนา หรือ สถาบันอันเป็นที่เคารพ ',\n  },\n  checked3: {\n    isActive: false,\n    text: 'คอร์สนี้ไม่ได้ใช้บทความ รูปภาพ ไฟล์เสียง ไฟล์วิดีโอที่ละเมิดลิขสิทธิ์',\n  },\n}\nconst CreateMarketplaceModal = ({ openModal, onClose, locale, dataProps = {} }) => {\n  // const params = useParams()\n  // const [isNext, setIsNext] = useState(false)\n  // const [show, setShow] = useState(false)\n  // const [marginBotton, setMarginBotton] = useState(97)\n  // const [formData, setFormData] = useState()steps\n\n  const [widthModal, setWidthModal] = useState(552)\n  const [stepsComponent, setStepsComponent] = useState(1)\n  const [marginBotton, setMarginBotton] = useState(97)\n  const [gapBotton, setgapBotton] = useState(23)\n  const [autoIssueObj, setAutoIssueObj] = useState(dataDefault)\n  const { width } = useWindowSize()\n  // const [string, setString] = useState('')\n  // var year = []\n  // var start = 2021\n  useEffect(() => {\n    const ModalValue = () => {\n      const isMobileSize = width < 768\n      const isTabletSize = width >= 768 && width < 1025\n      if (isMobileSize) {\n        setWidthModal(340)\n        setgapBotton(10)\n        setMarginBotton(30)\n      } else if (isTabletSize) {\n        setWidthModal(552)\n        setgapBotton(23)\n        setMarginBotton(20)\n      } else {\n        setWidthModal(552)\n        setgapBotton(23)\n        setMarginBotton(30)\n      }\n    }\n\n    ModalValue()\n  }, [width])\n  useEffect(() => {\n    if (openModal) {\n      setStepsComponent(1)\n      setAutoIssueObj(dataDefault)\n    }\n  }, [openModal])\n  return (\n    <Modal\n      isOpen={openModal}\n      onRequestClose={onClose}\n      contentStyle={{ width: `${widthModal}px`, padding: '24px' }}\n      shownXclose\n      onClickClose={onClose}\n      closeStyle={{ top: '13px', right: '13px' }}\n    >\n      <Container>\n        <Title\n          id=\"programMarketplace.title\"\n          style={{ padding: '0 0 15 0', textAlign: stepsComponent === 1 ? 'center' : 'start' }}\n        >\n          {stepsComponent === 1\n            ? locale === 'th'\n              ? 'ข้อกำหนดและนโยบาย'\n              : 'Course Marketplace Information'\n            : locale === 'th'\n            ? 'ข้อกำหนดและนโยบาย'\n            : 'Course Marketplace Information'}\n        </Title>\n        {stepsComponent === 1 && (\n          <CreateMarketplaceSteps1\n            autoIssueObj={autoIssueObj}\n            setAutoIssueObj={setAutoIssueObj}\n            marginBotton={marginBotton}\n            gapBotton={gapBotton}\n            onClose={onClose}\n            setStepsComponent={setStepsComponent}\n          />\n        )}\n        {stepsComponent === 2 && (\n          <>\n            <CreateMarketplaceSteps2\n              // gapBotton={gapBotton}\n              marginBotton={marginBotton}\n              setStepsComponent={setStepsComponent}\n              locale={locale}\n              onClose={onClose}\n              dataProps={dataProps}\n            />\n          </>\n        )}\n      </Container>\n    </Modal>\n  )\n}\nconst mapState = ({ Language: { locale }, ProgramCertificate: { courses } }) => ({\n  courses,\n  locale,\n})\n\nconst mapDispatch = ({ ProgramCertificate: { getCourses } }) => ({\n  getCourses,\n})\n\nexport default connect(mapState, mapDispatch)(CreateMarketplaceModal)\n","import styled, { css } from 'styled-components'\nimport { Link } from 'react-router-dom'\nimport Avatar from '../avatar/loadable'\nimport { Typography } from '../index'\n// import theme from 'theme'\nconst GridItem = styled.div`\n  width: 100%;\n  height: 100%;\n  max-height: 590px;\n  margin: 0;\n  border-radius: 10px;\n\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  background-color: #fff;\n  /* border: 1px solid #cdcdcd; */\n  box-shadow: 0px 7px 6px -3.09375px rgba(0, 0, 0, 0.1),\n    0px 4.125px 6.1875px -2.0625px rgba(0, 0, 0, 0.1);\n  transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1);\n  overflow: hidden;\n  :hover {\n    /* box-shadow: 0 3px 5px -2px rgba(0, 0, 0, 0.1); */\n    box-shadow: 0px 12px 6px -3.09375px rgba(0, 0, 0, 0.1),\n      0px 4.125px 6.1875px -2.0625px rgba(0, 0, 0, 0.1);\n    /* border: 1px solid #cdcdcd; */\n    transform: translateY(-5px);\n  }\n  @media (max-width: 425px) {\n    margin: 0;\n  }\n`\n\nconst Content = styled.div`\n  padding: 16px;\n  /* padding-bottom: 0; */\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n`\n\nconst Image = styled.div`\n  width: 100%;\n  background-image: ${(props) => `url(${props.url})`};\n  background-position: center;\n  background-size: cover;\n  @media screen and (max-width: 768px) {\n    max-width: -webkit-fill-available;\n  }\n`\n\nconst Name = styled(Typography)`\n  white-space: nowrap;\n  font-size: ${({ theme }) => theme['text-sm']};\n  font-weight: 600;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  margin-bottom: 3px;\n`\n\nconst Description = styled(Typography)`\n  color: ${(props) => props.theme.black87};\n  font-size: ${({ theme }) => theme['text-xs']};\n  overflow: hidden;\n  text-overflow: ellipsis;\n  height: 36px;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n`\n\nconst Profile = styled(Avatar)`\n  position: absolute;\n  top: auto;\n  right: 16px;\n  box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.4);\n`\n\nconst IconWithText = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  color: ${(props) => (props.primary ? props.theme.primary2 : props.theme.grey)};\n  font-size: ${({ theme }) => theme['text-sm']};\n  img {\n    margin-right: 5px;\n  }\n  ${({ start }) => {\n    if (start) {\n      return css`\n        justify-content: flex-start;\n      `\n    }\n  }}\n  .after {\n    position: relative;\n    padding: 0 16px 0 0;\n  }\n  .after:after {\n    content: '';\n    position: absolute;\n    height: 15px;\n    width: 1px;\n    background-color: ${(props) => props.theme.gray6};\n    top: 3px;\n    right: 8px;\n  }\n\n  &.mode img {\n    filter: invert(40%);\n  }\n`\n\nconst Subject = styled.div`\n  color: white;\n  font-size: ${({ theme }) => theme['text-sm']};\n  position: absolute;\n  left: 16px;\n  top: 155px;\n`\n\n// /* const StyledLink = styled.a` */\nconst StyledLink = styled(Link)`\n  text-decoration: none;\n  color: #000;\n`\n\nconst Status = styled.div`\n  /* background-color: rgba(0, 0, 0, 0.3); */\n  /* backdrop-filter: blur(8px); */\n  /* height: 40px; */\n  top: 3px;\n  right: 10px;\n  border-radius: 2px;\n  position: absolute;\n  padding: 7px;\n  /* box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15); */\n  color: white;\n  font-weight: 600;\n  width: 50px;\n  height: 50px;\n  display: flex;\n  justify-content: center;\n  img {\n    position: absolute;\n    height: 55px;\n    top: -14px;\n    right: -2px;\n  }\n`\nconst CardCertifivate = styled.div`\n  top: 10px;\n  right: 10px;\n  border-radius: 2px;\n  position: absolute;\n  padding: 4px 8px 4px 8px;\n  background: linear-gradient(90deg, #6c51fe 3.11%, #40b1ff 100.44%);\n  //width: 80px;\n  height: 20px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  img {\n    position: absolute;\n    height: 55px;\n    top: -14px;\n    right: -2px;\n  }\n`\nconst StatusFlag = styled.img`\n  position: absolute;\n  height: 62px;\n  top: -4px;\n  right: 3px;\n`\nconst Bottom = styled.div`\n  display: flex;\n  justify-content: space-between;\n`\nconst StarGroup = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 1.6px;\n`\n\nexport {\n  GridItem,\n  Content,\n  Image,\n  Bottom,\n  Name,\n  Description,\n  Profile,\n  IconWithText,\n  Subject,\n  StyledLink,\n  Status,\n  StatusFlag,\n  StarGroup,\n  CardCertifivate,\n}\n","export default __webpack_public_path__ + \"static/media/certificate-purple.1366e382.svg\";","/* eslint-disable no-unused-vars */\n// import PropTypes from 'prop-types'\nimport _get from 'lodash/get'\nimport _ from 'lodash'\nimport LazyLoad from 'react-lazyload'\nimport { useMeasure } from 'react-use'\nimport React, { useState, useEffect } from 'react'\nimport { getPrice } from 'utils/utils'\nimport CreateMarketplaceModal from './CreateMarketplaceModal'\nimport {\n  GridItem,\n  Content,\n  Image,\n  Name,\n  Description,\n  // Profile,\n  IconWithText,\n  StyledLink,\n  Status,\n  StatusFlag,\n  Bottom,\n  StarGroup,\n  CardCertifivate,\n} from './styles'\n// import styled from 'styled-components'\nimport styled from 'styled-components'\nimport { Typography, HoverVideoPlayer } from '../index'\n// import OnlineIcon from '../../images/Classwin - New icon_2-Online Course - B.svg'\n// import ClassIcon from '../../images/Classwin - New icon_Classroom.png'\nimport Vector from './Vector.svg'\nimport FileText from './FileText.svg'\nimport classroom01 from './classroom-01.svg'\n// import PublicIcon from '../../images/ic-public-white-40-px.svg'\n// import HiddenIcon from '../../images/ic-hidden-white-40-px.svg'\n// import PrivateIcon from '../../images/ic-private-white-40-px.svg'\nimport Flag from '../../images/icons/flag-draft.svg'\nimport MarketplaceIcon from '../../images/icons/Marketplace.png'\nimport MarketplaceIconInactive from '../../images/icons/MarketplaceInInactive.png'\nimport CertificatePurple from '../../images/icons/certificate-purple.svg'\nimport Icon from '../icon/loadable'\nimport { courseTypes } from '../../constants'\nimport getImageUrl from '../../utils/getImageUrl'\nimport DefaultImage from '../../images/icon_Course_Default.png'\nimport { ReactComponent as EmptyStarIcon } from '../../images/EmptyStar.svg'\nimport { ReactComponent as FullStarIcon } from '../../images/FullStar.svg'\nimport Dot from '../../images/icons/3dot.svg'\nimport Tooltip from 'components/tooltip'\nimport theme from 'theme'\n\n// const Progressbar = styled.div`\n//   width: 100%;\n//   height: 30px;\n//   border-radius: 2px;\n//   background-color: #f3f3f3;\n//   margin: 10px 0px;\n// `\n\n// const Score = styled.div`\n//   background-color: ${(props) => props.color};\n//   padding: 2px;\n//   width: ${(props) => props.score}%;\n//   height: 100%;\n//   text-align: center;\n// `\n\n// const displayWidth = 60\n// const imageWidth = displayWidth * 2\nconst ImageX = styled.img`\n  width: 24px;\n  height: 24px;\n  display: flex;\n  // margin: 10px 10px 0 273px;\n  cursor: pointer;\n`\nconst NotificationContainer = styled.div`\n  background: white;\n  display: flex;\n  flex-direction: column;\n  margin: 0 0 30px 70px;\n  @media (max-width: 767px) {\n    margin: 0 0 30px 90px;\n  }\n  padding: 0 0 0 0;\n  justify-content: center;\n  width: 229px;\n  height: 70px;\n  border-radius: 6px;\n  border: 1px solid #cbd5e1;\n`\nconst Row = styled.div`\n  padding: 5px 10px 5px 20px;\n  gap: 10px;\n  display: flex;\n  width: 100%;\n  height: 50%;\n  background-color: white;\n  cursor: pointer;\n  border-radius: 4px;\n  :hover {\n    background-color: #e9f3f9;\n    border-radius: 4px;\n  }\n`\nconst CardSubCategory = styled.div`\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  background-color: ${theme.whiteblue};\n  border-radius: 4px;\n  max-width: 100%;\n  padding: 6px 8px;\n`\nconst PriceText = ({ price, packagePrice = [] }) => {\n  if (price === 0 || price === '0') {\n    return (\n      <Typography id=\"card.course.free\" fontSize=\"text-base\" gradient bold>\n        FREE\n      </Typography>\n    )\n  }\n  if (price > 0) {\n    return (\n      <Typography\n        id=\"card.course.unit\"\n        fontSize=\"text-base\"\n        values={{ price: getPrice(price, null, false, false) }}\n        gradient\n        bold\n      >\n        {price} THB\n      </Typography>\n    )\n  }\n\n  if (Array.isArray(packagePrice) && packagePrice.length) {\n    return (\n      <Typography\n        id=\"card.course.varyPrice\"\n        fontSize=\"text-base\"\n        color=\"primary1\"\n        values={{\n          price: getPrice(packagePrice?.[0]?.price, null, false, false),\n          quantity: packagePrice?.[0]?.quantity,\n        }}\n      >\n        {packagePrice?.[0]?.price} THB for {packagePrice?.[0]?.quantity} learners\n      </Typography>\n    )\n  }\n\n  return (\n    <Typography id=\"\" fontSize=\"text-base\" gradient bold>\n      -\n    </Typography>\n  )\n}\nconst CourseCard2 = ({\n  name,\n  type,\n  shortDescription,\n  price,\n  image,\n  link = '',\n  localeProps,\n  location,\n  // teachers,\n  isDraft,\n  lectureNum: lNumb,\n  packagePrice,\n  avgRating,\n  isCertificate,\n  ...props\n}) => {\n  const [ref, { width }] = useMeasure()\n  const [isMarketplac, setIsMarketplace] = useState(false)\n  const [openMarketplaceModal, setOpenMarketplaceModal] = useState(false)\n  const [isOpenSetting, setIsOpenSetting] = useState(true)\n  const [valuesData, setValuesData] = useState({})\n  const ShowAdd = /^\\/schools\\/.+$/.test(location?.pathname)\n\n  useEffect(() => {\n    if (!openMarketplaceModal) setIsOpenSetting(true)\n  }, [openMarketplaceModal])\n\n  const iconIsMarketplace = () => {\n    setIsMarketplace(true)\n  }\n  const noiconMarketplace = () => {\n    setIsMarketplace(false)\n  }\n  const onOpenEditModal = (values) => {\n    setIsOpenSetting(false)\n    setOpenMarketplaceModal(true)\n    // setIsOpenSetting(true)\n    setValuesData(values)\n  }\n  // const renderStatus = () => {\n  //   let imgTag = null\n  //   switch (publicMode) {\n  //     case 'PUBLIC':\n  //       imgTag = <img width=\"26px\" src={PublicIcon} alt=\"public-icon\" />\n  //       break\n  //     case 'CODE':\n  //       imgTag = <img width=\"26px\" src={PrivateIcon} alt=\"private-icon\" />\n  //       break\n  //     default:\n  //       imgTag = <img width=\"26px\" src={HiddenIcon} alt=\"hidden-icon\" />\n  //       break\n  //   }\n  //   return imgTag\n  // }\n  // const teacherImage = _get(teachers, '0.profileImage')\n  // const teacherSlug = _get(teachers, '0.slug')\n\n  const checkIcon = (type) => {\n    if (type === 'online') {\n      return (\n        <Icon\n          src={Vector}\n          alt=\"online-icon\"\n          style={{ width: '16px', height: '16px', marginRight: '4px', alignSelf: 'center' }}\n        />\n      )\n    }\n    if (type === 'classroom') {\n      return (\n        <Icon\n          src={classroom01}\n          alt=\"class-icon\"\n          style={{ width: '16px', height: '16px', marginRight: '4px', alignSelf: 'center' }}\n        />\n      )\n    }\n  }\n\n  const lectureNum =\n    lNumb ||\n    _get(props, 'publishedSubject.data.lectures', []).filter((lecture) => lecture.type === '')\n      .length\n\n  // /browse/courses\n  return (\n    <LazyLoad height={336}>\n      <GridItem style={props.style}>\n        <StyledLink to={link}>\n          <HoverVideoPlayer />\n          <Image\n            ref={ref}\n            style={{ height: (524 * width) / 1000 }}\n            url={getImageUrl(image, DefaultImage)}\n          />\n        </StyledLink>\n        {isDraft ? (\n          <>\n            <StatusFlag src={Flag} />\n            <Status>\n              <Typography id=\"course.instructor.draft\" bold color=\"white\">\n                Draft\n              </Typography>\n            </Status>\n          </>\n        ) : isCertificate ? (\n          <CardCertifivate>\n            {/* <Icon\n              src={CertificatePurple}\n              alt=\"file-text\"\n              style={{\n                width: '16px',\n                height: '16px',\n              }}\n            /> */}\n            <Typography fontSize=\"text-xxs\" color=\"white\" id=\"card.course.isCertificate\">\n              certificate\n            </Typography>\n          </CardCertifivate>\n        ) : (\n          <>\n            {ShowAdd && (\n              <Status>\n                {isOpenSetting ? (\n                  <Tooltip\n                    placement=\"bottom\"\n                    trigger=\"click\"\n                    tooltip={\n                      <NotificationContainer>\n                        <Row\n                          onMouseEnter={iconIsMarketplace}\n                          onMouseLeave={noiconMarketplace}\n                          onClick={() => {\n                            onOpenEditModal({ ...props })\n                          }}\n                        >\n                          <div style={{ display: 'flex', gap: '8px' }}>\n                            <Icon\n                              src={isMarketplac ? MarketplaceIcon : MarketplaceIconInactive}\n                              alt=\"eye-icon\"\n                              size={18}\n                              style={{\n                                filter: 'opacity(0.9)',\n                                borderRadius: '4px',\n                              }}\n                            />\n                            <Typography\n                              id=\"programMarketplace.icon\"\n                              color={isMarketplac ? 'primary1' : 'black87'}\n                              fontWeight={isMarketplac ? 700 : 400}\n                            >\n                              {localeProps === 'th'\n                                ? 'เพิ่มลงใน Marketplace'\n                                : 'Add to Marketplace'}\n                            </Typography>\n                          </div>\n                        </Row>\n                      </NotificationContainer>\n                    }\n                  >\n                    <ImageX src={Dot} />\n                  </Tooltip>\n                ) : (\n                  <ImageX src={Dot} />\n                )}\n\n                {/* <Typography id=\"course.instructor.draft\" bold color=\"#253e87\">\n                Draft\n              </Typography> */}\n              </Status>\n            )}\n\n            {/* <StatusFlag src={Flag} />\n          <Status>\n            <Typography id=\"course.instructor.draft\" bold color=\"white\">\n              Draft\n            </Typography>\n          </Status> */}\n          </>\n        )}\n        {/* <StyledLink to={`/users/${teacherSlug}`}>\n          {teacherImage && (\n            <Profile\n              width={displayWidth}\n              src={getImageUrl(\n                teacherImage,\n                `https://via.placeholder.com/${imageWidth}`,\n                imageWidth,\n                imageWidth\n              )}\n            />\n          )}\n        </StyledLink> */}\n        <StyledLink to={link}>\n          <Content>\n            <div>\n              <Name label color=\"black100\">\n                {name}\n              </Name>\n              <Description color=\"black87\">{shortDescription}</Description>\n\n              <div\n                style={{\n                  display: 'flex',\n                  justifyContent: 'space-between',\n                  marginTop: '8px',\n                  height: 20,\n                }}\n              >\n                {isDraft ? (\n                  <CardSubCategory>\n                    <Typography fontSize=\"text-xxs\" color=\"primary1\" nowrap>\n                      None\n                    </Typography>\n                  </CardSubCategory>\n                ) : (\n                  <CardSubCategory>\n                    <Typography fontSize=\"text-xxs\" color=\"primary1\" nowrap>\n                      {props?.subCategory?.name}\n                    </Typography>\n                  </CardSubCategory>\n                )}\n              </div>\n            </div>\n            <div\n              style={{ border: `1.03125px solid ${theme.black10}`, margin: '10px 0px 14px 0px' }}\n            ></div>\n            <Bottom>\n              <IconWithText start className=\"mode\">\n                {/* <PriceText price={price} packagePrice={packagePrice} /> */}\n                {!!avgRating && (\n                  <div style={{ display: 'flex', gap: '6px' }}>\n                    <StarGroup>\n                      {_.times(5, (index) => {\n                        if (index < avgRating) {\n                          return <FullStarIcon width={10} height={10} />\n                        }\n                        return <EmptyStarIcon width={10} height={10} />\n                      })}\n                    </StarGroup>\n                    <Typography\n                      fontSize=\"text-base\"\n                      color=\"star\"\n                      style={{\n                        alignSelf: 'center',\n                        width: avgRating.toString().length * 8,\n                        marginLeft: 4,\n                      }}\n                      bold\n                    >\n                      {avgRating}\n                    </Typography>\n                  </div>\n                )}\n              </IconWithText>\n              <IconWithText primary>\n                {/* <div style={{ display: 'flex' }}>\n                  <Icon\n                    src={FileText}\n                    alt=\"file-text\"\n                    style={{\n                      width: '16px',\n                      height: '16px',\n                      marginRight: '4px',\n                      alignSelf: 'center',\n                    }}\n                  />\n                  <Typography\n                    label2\n                    // className=\"after\"\n                    id=\"card.course.total.lecture\"\n                    color=\"black60\"\n                    values={{ lectureCount: lectureNum }}\n                    style={{ minWidth: 75 }}\n                  >\n                    {lectureNum} Lectures\n                  </Typography>\n                </div> */}\n                {/* <div style={{ display: 'flex' }}>\n                  {checkIcon(type)}\n                  <Typography\n                    id={`card.course.type.${type}`}\n                    color=\"black60\"\n                    style={{ minWidth: 45 }}\n                  >\n                    {courseTypes[type]}\n                  </Typography>\n                </div> */}\n                <PriceText price={price} packagePrice={packagePrice} />\n              </IconWithText>\n            </Bottom>\n          </Content>\n          {/* <Progressbar>\n            <Score></Score>\n          </Progressbar> */}\n        </StyledLink>\n        <CreateMarketplaceModal\n          onClose={() => setOpenMarketplaceModal(false)}\n          // onCreate={onCreate}\n          dataProps={valuesData}\n          openModal={openMarketplaceModal}\n        />\n      </GridItem>\n    </LazyLoad>\n  )\n}\n\nexport default CourseCard2\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAUCAYAAACJfM0wAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAISSURBVHgBtVXBctMwEN2V5eZI+APnkIFbODLMlJgvIHxB2y9IevT04h4gR9ovwJ+QP8AEhuGGOSdM1D/wldjSsuvGqdsJuBPKm5GlJ2mfV+tdGWGD/ou3z0i5LvwDylIb8y0yMkZ5PA2ngXWwggdAoX49NmmcayHWQiivQMKZQ/sD9oAib0BII8/6I6aJvp7FIRABefZ8mZ5lsAcklKDVSIEairCqZolCfprFnqKCxdfKNueTi8eAmzd9hwdEWdpANTIh52Y2PWzGprG/ye/uvcU95fVUbUXgLhfzqCd9xR2cCOeFVLiMKy5rBFm115VvdtkK8CbVKCNnT1HpDzwf8NKFo+KTQv1euCI6JcRHBBCLZyKKyn/NdpO7tsUaelUe919OE+6OGseWI/2pWP62Bg7g8uc8mmA9UYuLZ+jhTHKb0AXgVKo1mNK5YyDMywJnzANQLqy4t04814k5pmOOSbL4HJ2Inm7E2CAosITZMq3KMqnXgudxoLWXXjMNyy+RjNOtU4fTTAqMHbmq5xS0gI2O/YPOiuP3UZp/AKsnh+8mbXatwuzJGORjgTuXJmOHOG4z020bWLjLccqX87NYaH84PWLeinaP98R/E96GAkmZ6upUyEl/88VrSGbsEgjCuEsWB8jxIc6orV5zg+86chntFLgHDFfcq1t/kBpS3oWDCRIM4N7AnC/4K7uGi1pU8Bs7Hvvn4edyywAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAH5SURBVHgBtVRRTuMwEJ1x0tX+bfcGPkL7t1o1ImzT700bDgA36BH2BnsE4BuCyjeFRrRC/BFOQI6QbxpnmHESKAJFgoqRHPvNeJ7H9nMQ2AZBdIcAPdjCECG9voj76PuhNq7zAEgHRCqDTxiWpQaFh05hfrpGKR8IsuX87Ai2MG8Y/X9UKlRc6w4g3MPWVp47zIXeaPLARYNUCdsYgpZOAaEmglQIqQrZI5DGy3S51w3m1qt9WV2Azzm5za18GrwgokGw5wvTIAh9wc2ig2DyjxWwaDDHFuLbwG9yXWbNFZZ/2ZcoUDtkg3u+WxSpAT5fltMvVsJ3HhgkjYQV2TAMqy1u5MquvD+TfblyO4vJmTBhTYU1zngsvl4FOUak+SJ1HZ/By9ycvwdqecVyIRiLb21Mf3UZj02h+gS46zC+nsd2LL7VPGZf+YyX9VzLhzhmPHMrYHIEB26TWSb4JjlJNy9Qtp8kM6kA6j5pYt9gnRvOfZ4LLWZfUUctDCuBD1ykka3XZrdZ+D1TbYSFg1MizGWL0uRM3Q5O23JaK6w1ly4vTxPB3nC8j6R+tOW0VvgZ+xpCt6je8e9R+OF/4iN0utKXWFgVYBPwRpHoUVS/KZlqASQ7mfXV5Yy8+ZHIGbPYNT+e49VFPH1FaEmHUUhIH6qSn2Iqgm7wExUn7FGr1lpJAAAAAElFTkSuQmCC\"","export default __webpack_public_path__ + \"static/media/Vector.20c1965a.svg\";","export default __webpack_public_path__ + \"static/media/FileText.24e3c7ac.svg\";","export default __webpack_public_path__ + \"static/media/classroom-01.8e349f51.svg\";","export default __webpack_public_path__ + \"static/media/3dot.ddd2a75a.svg\";"],"sourceRoot":""}