\n
\n \n
\n \n Filters\n
\n\n {page !== \"reports\" && (\n
\n \n \n Clear All Filters\n \n
\n )}\n\n {filtersLoading ? (\n [1, 2, 3, 4].map((x) => {\n return \n applyFilters()}\n variant=\"contained\"\n disabled={submitStatus}\n // startIcon={\n // submitStatus ?
\n )}\n \n )}\n \n \n \n \n \n );\n};\n\nFilters.defaultProps = {};\n\nFilters.propTypes = {};\n\nexport default Filters;\n","import React, { useState } from \"react\";\nimport Filters from \"./Filters/Filters\";\n\nconst FiltersContainer = (props) => {\n const [openFilter, setOpenFilter] = useState(props.defaultFilter);\n\n const changeFilter = (value) => () => {\n if (!props.disableFilters) {\n setOpenFilter(value);\n } else {\n props.handleFilterMessage();\n }\n };\n\n return (\n \n
\n ) : null}\n {dateSelect ? (\n \n
\n \n
\n ) : null}\n {updateTrending && !showCampaignHeader && (\n \n
\n \n
\n ) : (\n \n
\n We value your suggestion!
\n \n Our team will thoroughly look into the prompt and carefully\n consider its potential.\n
\n \n
\n )}\n \n \n
\n \n {\" \"}\n setSubmit(true)}\n color=\"primary\"\n >\n Submit\n \n
\n {formattedDate}
;\n}\n\nconst ModalChatHistory = ({}) => {\n const [isEdit, setIsEdit] = useState({\n id: \"\",\n value: \"\",\n });\n const allConversations = useSelector(\n (state) => state.askVyrill?.allConversations\n );\n\n const historyLoading = useSelector(\n (state) => state.askVyrill?.historyLoading\n );\n\n const conversationId = useSelector(\n (state) => state.askVyrill?.conversationId\n );\n const currentBrandId = useSelector(\n (state) => state.selectedBrandReducer?.brand_id\n );\n const dispatch = useDispatch();\n const navigate = useNavigate();\n\n const [createConversation, { data, loading: newConversationLoading, error }] =\n useMutation(CREATE_CONVERSATION_MUTATION);\n const {\n loading,\n error: messagesError,\n data: messagesData,\n refetch: refetchMessages,\n } = useQuery(GET_MESSAGES_QUERY, {\n skip: true,\n });\n\n const handleConversation = (id) => {\n dispatch(\n updateAskVyrillState({\n messages: [],\n conversationId: id,\n askVyrillError: false,\n askVyrillTimoutError: false,\n loadFromHistory: true,\n })\n );\n navigate(`/ask_vyrill`);\n\n refetchMessages({\n conversationId: id,\n }).then((res) => {\n const sortedData = (res?.data?.getMessages || []).slice().reverse();\n dispatch(\n updateAskVyrillState({\n messages: sortedData,\n })\n );\n });\n\n // dispatch(\n // updateAskVyrillState({\n // messages: [],\n // messagesLoading: true,\n // conversationId: id,\n // loadFromHistory: true,\n // })\n // );\n };\n\n // const handleNewConversation = async () => {\n // // Clear existing messages\n // dispatch(\n // updateAskVyrillState({\n // messages: [],\n // conversationId: \"\",\n // selectedPrompt: \"\",\n // isNewChat: true,\n // askVyrillError: false,\n // askVyrillTimoutError: false,\n // // allConversations: [newChat, ...allConversations],\n // })\n // );\n\n // try {\n // const { data } = await createConversation({\n // variables: { brandId: currentBrandId },\n // });\n // if (data.createConversation) {\n // dispatch(\n // updateAskVyrillState({\n // conversationId: data.createConversation._id,\n // })\n // );\n // }\n // } catch (err) {\n // // Handle errors\n // console.error(err);\n // }\n // };\n\n const [updateTitle, { data: updateConversation }] = useMutation(\n UPDATE_CONVERSATION_MUTATION,\n {\n variables: {\n conversationId: isEdit.id,\n title: isEdit.value,\n },\n onCompleted: ({ updateConversation }) => {\n const updatedArray = allConversations.map((obj) => {\n if (obj?._id === updateConversation?._id) {\n return updateConversation; // Replaced with the new object\n } else {\n return obj; // Keep the original object\n }\n });\n\n dispatch(\n updateAskVyrillState({\n allConversations: updatedArray,\n })\n );\n setIsEdit({ id: \"\", value: \"\" });\n },\n onError: (error) => {\n console.error(\"Mutation error:\", error);\n },\n }\n );\n\n const handleEdit = () => {\n updateTitle();\n };\n\n return (\n \n \n {allConversations?.map((k, index) => {\n return (\n
\n \n );\n })}\n \n )}\n \n );\n};\n\nexport default ModalChatHistory;\n","import { useEffect, useState } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { useNavigate } from \"react-router-dom\";\nimport { useQuery } from \"@apollo/client\";\nimport { uniqueId } from \"lodash\";\n\nimport { GET_CONVERSATIONS } from \"../../../Queries/ask-vyrill\";\nimport { updateAskVyrillModal, updateAskVyrillState } from \"../Actions\";\nimport { getDateString, splitDateRange } from \"../../../utilities\";\nimport { RootState } from \"../AskVyrillReducer\";\n\nimport AskBarSearch from \"./AskBarSearch\";\nimport AskVyrillDuration from \"./AskVyrillDuration\";\nimport SuggestPromptModal from \"./SuggestPromptModal\";\nimport { allPrompts } from \"../../../constants\";\nimport ModalChatHistory from \"./ModalChatHistory\";\nimport \"../styles/AskVyrill.scss\";\nimport CustomDateAskVyrill from \"./CustomDateAskVyrill\";\n\nconst customSelectedDateStyles = {\n control: (provided: any) => ({\n ...provided,\n maxWidth: \"228px\",\n paddingRight: \"25px\",\n minHeight: \"22px\",\n backgroundColor: \"#f5f7f9\",\n }),\n menu: (provided: any) => ({\n ...provided,\n marginTop: \"0px\",\n width: \"228px\",\n }),\n\n dropdownIndicator: (provided: any) => ({\n ...provided,\n position: \"absolute\",\n right: \"2px\",\n top: \"3px\",\n }),\n};\n\nconst AskVyrillModal = ({ renderFrom }: { renderFrom: string }) => {\n const shouldOpen = useSelector(\n (state: RootState) => state.askVyrill.askVyrillModal.shouldOpen\n );\n // const allPrompts = useSelector(\n // (state: RootState) => state.askVyrill.allPrompts\n // );\n const askVyrillDuration = useSelector(\n (state: RootState) => state.askVyrill.askVyrillDuration\n );\n\n const videosCount = useSelector(\n (state: any) => state.navbarStatsReducer.counts.videos\n );\n const currentBrandId = useSelector(\n (state:any) => state.navbarStatsReducer.currentBrand._id\n );\n const allConversations = useSelector(\n (state: RootState) => state.askVyrill?.allConversations\n );\n\n const [suggestPromptModal, setSuggestPromptModal] = useState(false);\n const dispatch = useDispatch();\n const navigate = useNavigate();\n\n // const { loading, error, data, refetch } = useQuery(GET_ALL_PROMPTS, {\n // skip: !shouldOpen,\n // });\n\n const {\n // loading: conversationLoading,\n // error: conversationError,\n // data: conversationData,\n refetch: refetchConversation,\n } = useQuery(GET_CONVERSATIONS, {\n variables: { brandId: currentBrandId },\n skip: true,\n });\n\n useEffect(() => {\n if (shouldOpen && currentBrandId) {\n dispatch(\n updateAskVyrillState({\n historyLoading: true,\n })\n );\n\n refetchConversation().then((result) => {\n dispatch(\n updateAskVyrillState({\n allConversations: result?.data?.getConversations,\n historyLoading: false,\n })\n );\n });\n }\n }, [shouldOpen, refetchConversation, currentBrandId]);\n\n //Unmounting the component action\n useEffect(() => {\n return () => {\n dispatch(\n updateAskVyrillModal({\n requestFrom: \"\",\n shouldOpen: false,\n })\n );\n };\n }, []);\n const hasConversations = allConversations.length !== 0;\n\n if (!shouldOpen) return null;\n return (\n \n
\n {historyLoading ? (\n \n
\n \n handleConversation(k._id)}\n >\n {k.title}\n
\n \n )}\n\n \n
\n\n \n {isEdit.id === k._id ? (\n {\n setIsEdit({ ...isEdit, value: e.target.value });\n }}\n />\n ) : (\n handleConversation(k._id)}\n >\n \n
\n }\n id={index}\n direction=\"left\"\n className=\"customTip\"\n >\n \n
\n {/* )} */}\n \n\n \n \n \n Ask Vyrill (Beta)\n
\n \n
\n\n \n
\n \n
\n \n
\n \n
\n \n
\n Date Range
\n \n
\n \n \n Videos- {videosCount}\n \n
\n \n {/* {loading ? (\n \n
\n ) : ( */}\n\n\n\n \n {allPrompts?.map((k: any) => {\n return (\n {\n const newQuestion = {\n content: k.prompt,\n conversation_id: null,\n role: \"user\",\n duration: askVyrillDuration?.value,\n start_date: splitDateRange(\n getDateString(askVyrillDuration?.value)\n )?.startDate,\n end_date: splitDateRange(\n getDateString(askVyrillDuration?.value)\n )?.endDate,\n };\n\n const curent_time = new Date();\n const newConversation = {\n brand_id: currentBrandId,\n created_at: curent_time,\n title: k?.prompt,\n updated_at: curent_time,\n _id: \"newConversation\",\n };\n\n navigate(`/ask_vyrill`);\n dispatch(\n updateAskVyrillState({\n messages: [newQuestion],\n selectedPrompt: k.prompt,\n messagesLoading: true,\n isFirstPrompt: true,\n allConversations: [newConversation, ...allConversations],\n })\n );\n }}\n className={`grid-item`}\n >\n {k.prompt}\n
\n );\n })}\n \n {\" \"}\n \n Ask Vyrill specific questions for better results - e.g.{\" \"}\n \n “What are customers saying about the ingredients of Product A?”\n \n \n
\n\n \n
\n\n \n \n This feature is under Beta{\" \"}\n testing and may provide inaccurate answers. It is still undergoing\n final testing before its official release.\n \n
\n\n \n \n \n {\n dispatch(\n updateAskVyrillModal({\n shouldOpen: false,\n })\n );\n }}\n />\n \n {allConversations.length !== 0 &&
\n \n {/* \n {\" \"}\n \n
*/}\n\n \n\n {/* \n
\n \n
\n \n
\n \n
\n \n
\n Date Range
\n \n
\n \n \n Videos- {videosCount}\n \n
\n \n {\" \"}\n \n Ask Vyrill specific questions for better results - e.g.{\" \"}\n \n “What are customers saying about the ingredients of Product A?”\n \n \n
*/}\n {/* \n
\n\n \n \n This feature is under Beta{\" \"}\n testing and may provide inaccurate answers. It is still undergoing\n final testing before its official release.\n \n
*/}\n \n );\n};\n\nexport default AskVyrillModal;\n","import { useDispatch, useSelector } from \"react-redux\";\nimport Cookies from \"js-cookie\";\n\nimport { updateAskVyrillIntroModal } from \"../Actions\";\nimport \"../../Tutorials/TutorialModalstyles.scss\";\nimport \"./AskVyrillIntro.scss\";\nimport { updateNavStats } from \"../../SharedActions\";\nimport { fetchNavbarStats } from \"../../../vyrill-ui-config/layout/sidebar/navbarStatsActions\";\n\nconst newTagIcon =\n require(`@src/assets/images/vyrill/icons/new_tag.png`).default;\n\nconst AskVyrillIntro = ({}) => {\n const dispatch = useDispatch();\n\n const showIntro = useSelector(\n (state) => state.modalsState.askVyrillIntro.showIntro\n );\n\n const handleClose = () => {\n // API call to disable the modal\n updateNavStats(false)\n .then((response) => {\n if (response) {\n dispatch(fetchNavbarStats());\n dispatch(\n updateAskVyrillIntroModal({\n showIntro: false,\n })\n );\n }\n })\n .catch((err) => {});\n };\n\n if (showIntro) {\n return (\n \n
\n );\n } else {\n return null;\n }\n};\n\nexport default AskVyrillIntro;\n","import { useEffect } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport Cookies from \"js-cookie\";\n\nimport { updateAskVyrillIntroModal } from \"../../../Shared/PopUpModals/Actions\";\nimport { updateAskVyrillModal } from \"../Actions\";\nimport { RootState } from \"../AskVyrillReducer\";\n\nimport AskVyrillModal from \"./AskVyrillModal\";\nimport AskVyrillIntro from \"../../../Shared/PopUpModals/AskVyrillIntro/Index\";\nimport \"../styles/AskVyrillTopBar.scss\";\nimport { updateNavStats } from \"../../../Shared/SharedActions\";\nimport { fetchNavbarStats } from \"../../../vyrill-ui-config/layout/sidebar/navbarStatsActions\";\n\nconst AskVyrillSection = ({ renderFrom, width }: any) => {\n const isModalOpen = useSelector(\n (state: RootState) => state.askVyrill.askVyrillModal.shouldOpen\n );\n\n const ask_vyrill_intro = useSelector(\n (state: any) => state.navbarStatsReducer.current_user.ask_vyrill_intro\n );\n\n const dispatch = useDispatch();\n\n useEffect(() => {\n if (ask_vyrill_intro) {\n dispatch(\n updateAskVyrillIntroModal({\n showIntro: ask_vyrill_intro,\n })\n );\n }\n }, []);\n\n const handleClose = () => {\n dispatch(\n updateAskVyrillIntroModal({\n showIntro: false,\n })\n );\n // API call to close the modal\n updateNavStats(false)\n .then((response) => {\n dispatch(fetchNavbarStats());\n })\n .catch((err) => {});\n };\n\n const activeReportTab = useSelector(\n (state: any) => state.sentimentReportReducer.activeReportTab\n );\n const isCampaignTab = useSelector(\n (state: any) => state.videoParams.isCampaignTab\n );\n\n return (\n \n
\n \n
\n \n
\n \n {\" \"}\n Unleash the power of Ask Vyrill!{\" \"}\n \n \n 
\n
\n\n \n
\n \n Type in a specific question or click to select a prompt to{\" \"}\n \n receive comprehensive responses\n {\" \"}\n about your video analysis. Give it a try!\n
\n \n {!isModalOpen && (\n {\n dispatch(\n updateAskVyrillModal({\n requestFrom: renderFrom,\n shouldOpen: true,\n })\n );\n handleClose();\n }}\n >\n
\n )}\n Ask Vyrill
\n \n
\n \n
\n \n {videoDownloading ? (\n
\n\n \n {videoDownloading ? \"Downloading\" : \"Download\"}\n
\n \n {showSubmenu && (\n \n handleDownloadReport(\"txt\")}>\n txt\n \n handleDownloadReport(\"pdf\")}>\n pdf\n \n \n )}\n
\n \n );\n};\n\nexport default SingleVideoDownloadDropdown;","import { useState, useEffect } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { Button } from \"reactstrap\";\nimport Cookies from \"js-cookie\";\n\nimport { isCampaignVideo, numString, updateTab } from \"../utilities\";\nimport { toggelAddProductModal } from \"./GlobalParams/GlobalParamsActions\";\nimport GenerateBreadCrumbs from \"./GenerateBreadCrumbs\";\nimport PreviousNextButtons from \"./PreviousNextButtons\";\nimport {\n toggleAllTranscript,\n transcriptKeywords,\n updateVideoPageState,\n} from \"../Pages/Video/VideoActions\";\nimport AskVyrillSection from \"../Pages/AskVyrill/Components/AskVyrillSection\";\nimport { useLocation, useParams } from \"react-router-dom\";\n\nimport {\n AddProductBtn,\n AddVideosBtn,\n CreateCampaign,\n PublishToAppBtn,\n} from \"./Components/HeaderButtons\";\nimport { getVideoUploadDetails } from \"../Pages/Home/home_actions\";\nimport SingleVideoDownloadDropdown from \"./SingleVideoDownloadDropdown\";\nimport CampaignHeader from \"../Pages/Video/Components/Campaign/CampaignHeader\";\nimport initialSingleVideo from \"../Pages/Video/Components/initialSingleVideo\";\nimport SinglePublish from \"../Pages/Video/Components/SinglePublish\";\nimport SinglePublishMessage from \"../Pages/Video/Components/SinglePublishMessage\";\n\nconst Tab = ({ tab, selected, update, count, filters }) => (\n \n
\n \n);\n\nconst IndexHeader = (props) => {\n const location = useLocation();\n const [openSinglePublish, setOpenSinglePublish] = useState(false);\n const [singleVideo, setSingleVideo] = useState(initialSingleVideo);\n const videoData = useSelector((state) => state.videoData);\n const toggleTranscript = useSelector((state) => state.toggleTranscript);\n const isPublishedPageCategory = useSelector(\n (state) => state.PublishedPageStates.isCategoryPage\n );\n const showCampaignHeader = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignHeader\n );\n\n const isProductCategoryPage = useSelector(\n (state) => state.productPageStates.isCategoryPage\n );\n const isVideoCategoryPage = useSelector(\n (state) => state.videoPageStates.isCategoryPage\n );\n\n const isPublishedCategoryPage = useSelector(\n (state) => state.PublishedPageStates.isCategoryPage\n );\n const video = useSelector(\n (state) => state.videoAssociations.body.video || {}\n );\n const videoAssociations = useSelector((state) => state.videoAssociations);\n const { body, status } = videoAssociations;\n\n const dispatch = useDispatch();\n const { id } = useParams();\n\n const {\n // tabs,\n // currentTab,\n // update,\n // count,\n // csvPath,\n // disabled,\n // filters,\n // openaddYouTubeVideoUrl,\n // videoUrl,\n // roles,\n // page,\n // handleActiveContact,\n // isActiveContact,\n // dates,\n // search,\n // trending,\n // desc,\n filter_page,\n // sort,\n // date,\n // validEmail,\n // vyrillVerified,\n indexName,\n isVideoDetailPage,\n uploadVideoDetails,\n setUploadVideoModal,\n setOpenNewProduct,\n openNewProduct,\n // setOpenSinglePublish,\n // handleOpenSinglePublish,\n } = props;\n const handleOpenSinglePublish = () => {\n dispatch(updateVideoPageState({ openSinglePublish: true }));\n setSingleVideo(body || initialSingleVideo);\n };\n\n const handleCloseSinglePublish = () => {\n dispatch(updateVideoPageState({ openSinglePublish: false }));\n setSingleVideo(initialSingleVideo);\n };\n useEffect(() => {\n if (toggleTranscript) {\n dispatch(toggleAllTranscript(false));\n }\n dispatch(transcriptKeywords(true));\n }, [filter_page, videoData.count]);\n\n useEffect(() => {\n getVideoUploadDetails({});\n }, []);\n\n // const trackShortcutAddVideos = () => {\n // mixpanel.track(MIXPANEL_HOME_PAGE.SHORTCUT_ADD_VIDEOS);\n // };\n const inputCommonProps = { hidden: true, readOnly: true };\n\n return (\n <>\n \n {tab.includes(\"Competition\")\n ? \"Competitors\"\n : tab.includes(\"fan\")\n ? \"shopper\"\n : tab}{\" \"}\n {selected && (count || count === 0) ? ` (${numString(count)})` : null}\n
\n {selected && }\n \n
\n\n {indexName == \"Products\" && isProductCategoryPage && (\n \n
\n )}\n\n {indexName == \"Videos\" && isVideoCategoryPage && !id && (\n \n
\n )}\n {indexName == \"Published\" && isPublishedCategoryPage && (\n \n )}\n\n {/* {indexName == \"Videos\" && id && isVideoDetailPage && (\n s
*/}\n {/* {console.log(indexName)} */}\n\n {/* {props.headerElements ? (\n props.headerElements\n ) : (\n <>\n \n
\n - \n {tabs.map((tab) => (\n
\n
\n \n )} */}\n \n \n {(roles.includes(\"brand_manager\") ||\n roles.includes(\"digital_agency\")) &&\n page === \"influencers\" && (\n \n Contact Creators\n \n )}\n {csvPath === \"/jwt_api/influencers\" && (\n \n \n Download CSV\n \n \n )}\n
\n \n {location.pathname.includes(\"/campaigns/\") && (\n
\n {isVideoDetailPage && (\n \n
\n )}\n \n
\n )}\n \n );\n};\n\nexport default IndexHeader;\n","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAQNJREFUSA3tldENgkAMhhmFERzFEXyUng+9JhooDzqCG+gIbuIIuAErmB+sRDTcAb6YSEJ6F9qvvb/cXZLMeJjzlERP5PPjmvN0BqoLJdaFk6LaiB4Ir9eKeLvoPCaMDApr4RjPgn+C9uGjZRmCPuGtNCebB20MFBAS3aOZQWDj/GgU4EMBljxKCnOOhYb8msL+0GZHhbSKlenHNMUphQPlq8uHBs4XZxJdxfz8oeQvDOeLami3jGqUkRFEopXN+3YSFBDifIVboA9sv7WH+ajlG4i8Xvr6QpZMCo5pqHHerPN6zXi3BAiVO9HaSVlnvjxPqtQyoGInegMok5LXfPjKpXgH+xzeGCne2GoAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAUCAYAAABvVQZ0AAAAAXNSR0IArs4c6QAAAVVJREFUOBGVVNFxgzAMZYSM0BEyAiMwQj9B5kMWac4WfGSDZIN2g2SDZIOOQDdghPaEC4evCjXc6Ww/PckPW3KWPfkQcWesvxvi76UB+av4noTpsEF/BuK+brqiPnT5ZIa4N+TPelSWZYDuFYhPkxnrP0QNEL9P2GK8ar4aj8W4AVi+hB25B+LHFgtx7QDWXWa1okaUzEDiRI0TdWDdLTHHTDONv8sRzIBMKmrRNPwZgQkLSVaRx4gKxHIJfQQmLAzxl8RG1Bp9IbcUgQkLiamxyyMqIO/FsaUgEU+7sUzwbR8lK9G9iEPGyLGymASoMarklWTlweUSo1LUw1SZAfw950GlSLI/16wyA7haTmoBriQb+9XyQ6WoraEyAzjyn3XN1pYa/2TZ4MuNRfaWllo9FmkLQzyU6PL/rMJjYagdqsaHd2ypSuZS0WD5JrWTYvLuLXP8AJg1DrP869VUAAAAAElFTkSuQmCC\"","export default __webpack_public_path__ + \"static/media/chat-user.7342c68c.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAYAAABXuSs3AAAAAXNSR0IArs4c6QAABIRJREFUaAXNWUtu00AY9hE4Qm4AB0AiS3bAohJCIIXSNo5t1JlpG+wJOG4KqoQERWxAYgE7ttygvUG5QbhBjhD0TfybyTi2Z5oXldzxYx7f9z/nn3jeDf+e9s8eBkJ+D0Uy7h6l01DIafc4nYQ8uQxY3PFZ3Lrh1OsZtitGnZAnYwBtuvaOs4utE2Asu/X85O2vJrDm94An44DFw/WI0XHW6Ph1O+TJDxNk3XNOoOO4lHt3xtitQMSdQMgMtoy2JxLms7hNszEWt/4bAgAGB3OR3tYJBCIe1gE2v5nqB4FAyCuzX+0zTy4fvz4vtEjatG5dQetgTALKB4S0ijw0D8zROQLBdmmCZVoQ0H0gELITrouAsk8hJ8sALo3lyaUuvbUQQJYrLWyRXGzGmOp3JdA9SafIAboQCtsPj+ojiA3Apj46AWg4EjJ78eq0MfPSvDDBiPUfFqBxE4qBtZkgYvT44Acu5+gh5NQk4JwD9AxMrOragMefkJDmGHueR9JzccA8Ag1pPuVjDlk4ogRYBxjfENoAGAsh+kBq6mJxkb5dF8e8pRAqZNaEhcYp0vWdEwbQAZN3QiPyBEKOF2nAWf2zEKq2wJ3B29qMTVghQI8ezJaA5dIsJRP6boKfacdxD8OTS4y7++1n28Sx8Bn9F37IHQmTVYXLOuBEBqRtnThgJ3cwLhTyTxUm7f2kDnimJqpwHBvgRMBmC4AYj/77/eG1BrAyZG4EOBGoS0ARmwWBXTmyCc+bkTgBp9YkQNpT/mSRtQMurzYqcQJOLQjAByil20YkZVZV9oSKBwtUTUZSIhDLtrvxqVUtgHUV0W0DRzIJWXJRhcN8r6StJFphU+uWOABj52cmNhOo/hyxmRU89i9aW7Hx3WSEwsUmeuThEBvBWRaHA+8fno43Cnxn9MH6MIkkvd9PC+elLH7AsulGgNucHBBQahFtaIMHk87LS6WltQNfBeBnwfuSlnyersdUcpVa7fRIwt1X6ViXcB1pn6erTUA5YLejOSHHRYjzPK8OMJFcWQK6SWhDyYjaUxUFnuft9D7fazpBA/Ai8RELs22K4z3+ZgKnuX/+peUa2nTArlp6wc5mRXNVsdwEHEQfdb/ezpNYqdAwBWFKmLTk8zeVW1dzDkpAWNOrOp6wAX5wOLzAHE+z83a3P/tVwlwMz/PVvXvGBOn9l6OixlXAAbBisdpNFo3pRGd5MT1f7YAIYvHOu/eqsiEJL2NWCjD9wy8Ni8zFRuI5+Mney0wV1ZgTAH2Wtcjp8A7lX5enDileTrts+F3tSQjoojYUg9KhpwNwZaPYP+yxjHWi8za2nU/Cjw8O2OkQ70k7Nq3P/qX4RVhL7+Dp+sSwS3TqLSCl91vVvZniSwDrXsyBP5LX6Bsdx3ZHBhXb4yZiSwHWyehxlew0PBpYVd5NIPXvPptP8TqGpe5xehWxRAX7VUq9x9OJnuKXAmkzOOLyky4x9/v5FG+z5sr6zPmAtU1vEbDOHGq2O1b+TwDr4HEPAgGXv0Ix+E1mgySDKHHAsmLXZ45b1fNfeTouB2J5JwcAAAAASUVORK5CYII=\"","export default __webpack_public_path__ + \"static/media/timeout_error.dcfce319.png\";","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default __webpack_public_path__ + \"static/media/dropzoneimage.53e183e3.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAUCAYAAACTQC2+AAAAAXNSR0IArs4c6QAAAXRJREFUSA21ldsxREEQhj+XdzIgAzJABDx6QwSIgAyWCAjBRkAGiAAR2Ayo72zP1Kxa9J4621VT02cuf3f/090HprIPPAJfA41n4DSwu2kF2AXceAfGwKQ90FM/AbaBS+CmYBjJG7BZFgaaxf1ssaTrul0YSJc6sbfEWx0I9F+YrKG7oNek6SVZQz6sQ95Hfd4za8goXoBb4CKydCZ9M2FmksFIHIr0mU3e+8uYWaxTnawXJTlL31VQ9wQ4FEHPoybVH6Imaw15KBuRUZRRPQ0jFrw41mOr61iVrCHPSd/M5UgO91oa7TY6VejujGUMHbV8VxenilGY/j/FJiB213GybyTnv4kRfszZtHcqG/ZP09sm2lmNjUUn7+/MubQXa9UJM0M+5bWPFIraBJFqaauU+psw9PLIJdyMQSM5iIPe11HXHCVhLHLPTDSkuGEhHi5Ao4D+b4pzZp33XX8NXNvVPXAW30ubCq2jtaWZmALbOWTt+BuSU2eP6B7k/wAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAoCAYAAADpE0oSAAAAAXNSR0IArs4c6QAAAcBJREFUWAntWO1twjAQZQRGcG2Q+pMRMgIjMEI3gBHYADZI/5A7f0hhg3YD2CAjUJ0TO7byAW1J/9RI6OLYfu/8fNI9ZSYUHLnCCyvz+az5MQDGNb5xhQdh8CK0rITGWxNLoWBDa9z6R2KNKbcWz+BhVgPijUm55lpuhcbSvbsXKbGxBNwB+jA9cS+JkZWQ+M5VsecSdqROrQCdvv1zjR8c6zUUhca8ValdF+7pEis4LzTslkqthiRcaMhsEgF5CNp5bjCFkWs31xKrYr9Up0GyviReS2B030LBWZA6lIiNcH2RcKQ6Ca+CUcJNsp54AZD1gT/zXSK2FZqkfmZROaxUXKm4XC08PabiGi0uludzdjqtGEBG8Tf6j0pNRN72eMsTNnPb/nImi/WjSTjM0In4tsgNHsIJ1zfHInm1If81Znu4wYsn7hAYWblmTs7Bug5yECP2hxInGzRse+BK7sYay4jQyIomiOSejHRSrvAz2t9rheBKnq2D6Tcq2Nwj65snb0Y1QabQWqDGHA5dgcdwxH/Rjz0pPSTiSI4pB0nqKdWNsJPUkRxTDpLUU6obYf9LqUuyIqz83uejSLYfDL4AviE4qUNU10cAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAbCAYAAACTHcTmAAAAAXNSR0IArs4c6QAAAQtJREFUSA3tlGGNwkAQhSsBCUioBCScBCTggK8OzgE4AAfgoDjgHCCByxdmytKG5EK5HyRtsunstvPm7e68VwFnYAXMgAXwDbTABbhGvAHm1ZMncsU4ALsqEgVOEIGMj8A+irrmMMnkZQwJuJbffZ8T1IkgJgwYATWw7RVOIAn47St21YHun+xssBxHJFNBHggE6w50M8h+YWECtROmM72p4X9bKnSsglKKi7+2bL9PdyFRb6/0gFKKmkrdL6DCmqZZFx7RltoXII0kTUPXMj4VpqH5WLx0sszVYOoE9Ue3O+szyXlhKlngJ0xIoMcjCgZvuagkkEwn0O5ExgfTRamGz2gpZbcaf+V3hF8EgoOpRNeoXgAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAgCAYAAAABtRhCAAAAAXNSR0IArs4c6QAAAbxJREFUSA21V+1xwjAMZYRuUEbICB2hI+TAytnyn4zABrBBO0I36AiMkBEyAq0SCxJsKyIf3HEJ8suTLT89nN1O8QEoC+/hFxFuqa/3cAWAQkE1DbG23COaNpXoKdYSdppRQNR1+YYITSC+5KCIx0vANPRMDjcZ974690RVU9d1lqifWNVNzLnqLBIry5Xcu6eSajDtDhE0+6Mh02DabvXOHT9ptqREsRwzBlnd1pqP++OIUPCm34Mr3VDLEPeobay1+60S8pZ5799HawgJb6PgCj+yvNxv0UwWJA19TGLqxTLk2iLhQBvXYa7uPqmmCPVagJRJJU2q3znz3df7UL5Gm0dbeyiJ01r4iVDsh86ZOhqcGSCuIJrYhxHNKTs4M+GD05wiCl4+InxFgzMD4jaxvSXrPTOhKERRwlsk3MLeJns7iGY1e5vkY6NddEwI5RdtjbdosgQMVFxVmhBVpUgyhIi2xkCxbxikvKrajBOuYW+irfGkRStikPKq4lrT3rhaiMK/j6ruyhWyAIkz+8hAyoveE0IPdifx0fEwlRmxP7KzSyy7Vk0qxyhGnuq9yb6aaSdAHMQ1Iv//8QehwCqt5wjrwQAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAaCAYAAACzdqxAAAAAAXNSR0IArs4c6QAAANtJREFUSA1jqLA4r1BudeF8hdWF/2Rhi/MODNhAuTUFhoIcg8tgJFfOr7A4n0AGVsDmYAaEwecTsCogVxCXwaWm5w1A3iQDQ3yAzeAKywv7EeKkR2ql5fkCjKAAu5DcFALVV2l14T02gxPgrrU4rwBKjsTiMsvzBTC9eA0mNd7AKQrq6lGD4fEzGhSjQQHJSugZ5H6F1YX7ZZbnA0DSKJIkZj28evFKErAIr168kiPXYHCwkFLBWl2YDy+P0YONSjXIeXRzwfwKq/MN5VYX3sNsJ4WuBDV+LM4rAACjdLqTuc6DdQAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAICAYAAAB3R5aRAAAAAXNSR0IArs4c6QAAAElJREFUOBFjYKAz+P//f8L///8N6GwtqnUgB/z////+4HPI////GwYIr/////97cIgMkANAHkc4AjXG6MMb8HQx4A4AhTO2LAoA3O0c0vTdCQYAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAJCAYAAAD6reaeAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACcSURBVHgBTc5NCsIwEAXgeUlxXfyBLgO2tbhKj+BJxBt4A3sDj1Bv4FWy7DLLiFLrTlAZk0Chs5g3fLzFgCaTl/oUUoywLvWegIaEQIRiq3W+qZ9FVV9is6q0oh+uxGQ/bz4GTL6M1qcCc22tGWIzAR98Dgy0Suk0YtcZC8k7Aik5E+eAMqz+7txild382cyXWSrHl/qHMx5eBIE/MPkp1q/VY/MAAAAASUVORK5CYII=\"","export default __webpack_public_path__ + \"static/media/cardimage.51b3bf5d.png\";","export default __webpack_public_path__ + \"static/media/carousel-create-icon.660f7902.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAoCAYAAACFFRgXAAAAAXNSR0IArs4c6QAAAlFJREFUWAntmNFtwyAQhhkhI2SEjpARMkIfE5wHwK1kSKVmhG7QbtBskG6QETKCR2iFY1v45xzqGKdEaqXI/NxxfL6aw4axC39CFPNM6kOmTJkp8x3rx5X+XIliTk0dmoMaU/VVsJFBAaakoMHHS1IvMJdmHxo82i71AQFCMdHfza53d6FgV9hLBAjFQP9KZ1J/uAO5NF+k4xWdblzbxhBoR43+TIjdLJP65Dquc730HK/scOPaNoZBO2r0Z1wUj64TV+bkOY3ocGPbNoZCO2r0Z5hdrsyj5zSiIwSAdtSdqVdPxQIdqNLTGTRQYHwcjnbUHX8sZVyZ945DBHERgDGGdtQtQr1RdEpZ7OzayXoBahK0o26Bpyxl7SSxgKlSFnuxNdC9GRuS4alLWQNrr1GAsZStlRbuJDHbo4FvUcrcGx4NfItSFhUY75iL5wd3gthtnA/jox11cBFgwLHaA4CAaEf9DwwJ86SXMfBAO+p7zPA26hexzcilOu5lbHCG8+ozvvPSg0GH6o14WQBHKzFWa6gbaEfNzm9pcbMshJghiNVcFa8eAOUY6rPQuIFg4F/r3Byp+ShYLos95TtpH1dm594M9dJPwWZqSx6kTAprg+N/Bl9L+2C5MJPuqL03jm967taeHCzxWdWe5CQHa1O+EXrZeX7rE6IkYavnFxecLN6ShbXAGW46Uh/djJ/b2/LPFhiuPFuafED34DshWJu1u4GlFlwXPqHMNo/FhjiHS+6ZbWCbq7foVIKZbWDt9XxiZOrKkDhsA15B5/pwq9L1A6GUJ0WERVfjAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAiCAYAAAAtZZsLAAAAAXNSR0IArs4c6QAAAVRJREFUWAnt19FtwyAQBmBGyXgtRCrQhwJ+SEboCBkhG7SbZASP0OpS/RaitAYfRH7AUvTbGM5fLrbkCNFoUzZ8xZ9GZduViXG0365yo0oDyG3k6ODoILcD3PXjHhwd5HagZP2z9fpJu0Nubsk9qLU7SPP2klvPHpPWnQghjb/lkGtAwinjb/ca2p3YoLgAcEDkkDiHjNfHOJyXLZHK+AsKI1MkxpEA5nD3OcZfMKdJriEBQ9JFH4bDN/wPCRjy4TggjzacgUDSz439JTNj0rh31OmaOeQCS179MX7U4bwJhQLI0iI1yBocHEiBHWQpkOaVIGtwVBMO5O+BGuEKshbXBfhXJ7fgugFT5FZcVyCQHFx3IF2Au+HhQLIfEi4oXQ8YcgDTDq0do3NIoew042CPKdSr/9gjjEzSuOvPO9suuzjNy18LeneTJlz30clpljZ8AvcNLU34MGVJqGgAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAAXNSR0IArs4c6QAAA+FJREFUSA2dVj9TW0cQ/+1KMMJp9A2ifILgIiGZOGMxkyIddudUhs5BzPCQG1kUEkWAIhEPDzDusDt3hiql8YQZe4bCokvH+wZ5aRIl8rvN7D3dy+lFEgo3I929vf1zt7e/3SVMMR4FjWqBaQlEVQhVACmnYhRD0AWZbmLk9Fm4e3adOprEsFpvLhPQAlCZxOftRQJsHXW2n3u0oeVIg4+CRqVQ4FcQzA+4YwL2YczZByB6Fu5GSg+CoPwBpXlDuEdES4De3o4oMWbR8Q1odvqPwdrG5kMQwtRtEpGRlYMpXKXaVuuNZQK1BoZjIlk5+GnnxDdY8D/WHj+5B+AlgBKJ2Z+R3ndPwx9/9XkmrS/enne/WvjmhSCZA6EK0IPPv7gTXbw7v3Ry2Q2tG7nwXm9GwNZBZ7vtmG4yr9WbbUnfP06Mue3cW3TKCsyvrTEx+wd7uyON6Zv9xXPqtnjW/HEShmHs5POzHnhto1kWwrqNB+C28rD+aTSmkShRUXojjSlfn2+9Z9AeAcd9mnuVN5L/LspsG5BIg29gIzU4CH0IZGvcqRWLQ/AgquqN80b87zBsxxp0SnM2KAW1dWd02Nn5xBfw10HQLve5f/Uv6GUivy9bq2/+Zp/LmEVmYo1MiMipz5Rf62nFyCKIzgQ4SXQ95RDIvrIqXovE9ClEwIIhvIzSdRRudwFMbcjpYGPOhLlFTHeLLpsU0VNlY4fCJr9ZQi8e9+Y+r2YnC3ihCrs3uU6wwHyV//3Nt+xz+MpHrR0GAZQzHI5iHKZRmpDJVCCkEXujwQBZ8NYeb348ScNh54cV/YnQi0l8o/Y0wgf0mEGwmZ+SZCwkRin5P7QeemnVEeqyGHmjwob5xm66zngGPSSXzGIsHAhYv07wpvtEWFJZhZ6tFrX6kyutYWTMYr72afrqoeTeAEXiJbH1UpMFAiMmSxijYDLoGo41p2oms8lbc6ieQJiP8/lRQ9+HgzOm/EQI/b08TFSXy6HOhoXFUWf3eW2juQ7CfJ/ntIfZyNxn0BWGPVBGG7cw/aHk0eePWoBo0xWpDXtIJ+sXYAHaR53t6Yw4Bbl5td5sEaClbqgAZxVf+VeDxjIxH6eyEs6YP8eWq5z+7FPdOLhZoEQiue/3NUM9zcW78+7Cwp1LEH8LoGpo5sFnX379+8XbX4ZclWnPLbTUCc/+DEDlYzH4/nBvR3ukbAzd0FFT99Jrv+0DREvSaQm9rsu7g4ReYea7BApcXgahmyTmvpdDnWotxONHru0bz5jtSKTR6AIkI3uLiQYd31rQqNpmlwtaOzVNOVzGIIrEJG8U1HkMO3l//geZKK56ItU46gAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAoCAYAAACFFRgXAAAAAXNSR0IArs4c6QAAAnhJREFUWAntWMFV6zAQTAmUQAmUkBIogSNIOawE/z1L+YeU8Dv4dAAdhA4ogRJcArx17Lz1RPZaig05wMUa7+zsZJFk2avVN/wZijfWhT0RXX1DufNKNGZ9rK2Pn9aF94s23TPLhg+m9+e1YKHspNnW9Iaq9UJly2THzHKXHx7DbZnyAlmaWTZs6M/NAqXzJaeYtT7W+coLZAyadfG9WWzt/DUuvi1QPk9yyOyG4s64+K9n2MddnvrM7DGzXMo+hr00/KMLTjPbGO723/Z6T9X1zD2bJjfFbMs5PDB4d/DxY5r6zKwpZrnkg9+SnA7GVa8zW9HliKpr3pqkER7zAsNs68Kz5JmfWHDGxVdpYsgsm7ewpWHeVGx8eCme+1gk1Vk2S7S7Qu6ZuG5MayIn/2ZY9Rjv8P1Ttda0s+Mu7FdaUmeguyK/u49XXHCYV4jrxQzjDyjF+MN+DZd2cijvt8NDnZnjPj7audsXPYdPnpT8aMc5ghg7pcWRX4rbI8Dx4MR1N/R3fbGGLYX+wak76WHHEGOHtDjyS7F14UPWMj7eNVryZmqMBZGD8TmwoepO1uFz9PGLkQykxmgAORifA+NrlfHx/1EXDSA+EtuBFkd+Lk4ttt7REg0gxoJaHPm5OLmVSRE0gFhyeazFkZ+DU91ttjIpggYQSy6PtTjyc3BqsZ3kowHEmKDFkZ+DB7cyKYIGEEsuj7U48qfiDYVbqd3byqSIJKXGkstj5GC8FI9uZVIUDSCWXB5bvz15xcecOXBvK5MmNHHJbQzDtzItvyQ++sFFE0TDh61nyS5vD6/zWLjDuYY5j02nPqhoWuPxbW18fBucCq3hLyGwJz0Sx+CJAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAiCAYAAAAkjjtxAAAAAXNSR0IArs4c6QAAAetJREFUWAntmN1xgzAMxz1CRsgIGSEjdIS89C4xeZDdjwPTu2SEbtBu0BWyQUdgBEZoT4DuDMh2qQOhPR6ITUD2j79kySCEEAIAVhLSU6JNmWjzNadDqqyQ2rztIV0jqwBI14nKijlBciwIjsKKRGXv3A1z/E+q9FUkOp9dGHjEKgVzEWNmd3x82d7yQAZOTA64WnS4CKsgn/gnlACcwKh8tUIh3U3FvId0G0oAXmAKl1ZaGYEeM5XU5oPm87V9YGU+HQblGGHizf8MSw8Yg73KzQ85C45hcoDnu1ihfe6X2lwkmE298NqFjAUmmMaALSq/DRO/+/MS5+zM36q8XmA0bCohW1watYEmCLUHnYGr/GNRqCqZNchghS3bGlwbXm2VFffwtLHvt/uN+/kQ0+aC+d6+n/pRwJ1BeHB7k9JsqtylHyts5vXOVYAR/CdhMtT9JIjdXg2YBq3AHWHCpUZc/S7305h2e3VgGrwZmA2TGjzsfhrLbkcDxklcYcKtfhvK1x8VmCamMBnqfrK320mA7Qlj+wtwrIIh+0XhkEKx1xeFYxUM2S8KhxSKvf5vFT7hhnsOB+5Duru+v/epSirTe4ruU83lHF98BcB5lQzYhN8KXmpTdL8R45uxZxPe/j4wHXheHrU50xv1N48SVrsUtu7RAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGRSURBVHgB1ZaLccIwDIYVFigjuBswQkZghGzQjsAIbAAbtBtAJ4ANTCegG/yVa3EoxnGQ75K7fne6PPz4I0WWTfTfALBie6e5YdE924nmhAUd7rQ0FyzWKeEDzQWLefRZkpEFGZHQuuT19EnGwp945EpTkiTVn6C6X9NUyBLS7CdLMvEyFIs2k1SrxOtO+rmxeRtJlmAhM18oJs5t4NgErxQT622g/YftItdg33I93rzaog4nHlo49SLCDxvYcWpsyPYj2xn98GtC++Oah13c5eKLGIlT0ndLJbjDuvDFo8Ii6pN+G3oGxGz1VmE8ZnnAVtUGvnxQGDHJtGi4b6kG5P9VSViLutLcxU2iaZoLxXX3DGd1vzSMy4Myu8RrHZ22NO9iRLSlMh3bgft18vyl2lZUKzw2WHBswfNw/tLbY0u1IL/36gTypXaqBcOF5ANS+lCudo6sIBaDFI/Mf0dcdrnodGQF/ZPkVTxbPjHGq3E7soL76eJoCZl4f9tmPVmR/1h9jsK95NqOvqg4K1vm+QVyhTf/MPrZhgAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAF6SURBVHgB7ZeNcYMwDIUfXaDtBnQDNqg7QTMCI3SEjMAI2aDZIN2g3QA6AdlAVc7mwrlAEBINvfDd6eyL/15kWzLAyso/gogeYMQdjGBRjguHpcHCdmwHLAkWlNIZBwOsttK16hssBfZS2fJYbXkJNKIc/eYNSiy2Mu/47RXXJDr0MQ4KtB5zA23XuwTRoY9RXYIEwwunXJwmb8qmfs+WBRvii61i+2Y7hnoV2qokSSqMhcW8X/CENXVY87J3yaeXv+KTJFvOnbc0PztMYWZxBTTMJG4LC3iinPwhtUCdrmJxmVLcaWyOOSCfgqaKyyBAlJJCQJwazY+SziJhpEvMTtJZmsRF26EZKxXmMJ1nSedE0pm3soRP4lN55HM66qyN9hj5l0ba01yxvbA94fx66EJzFLphYZueMFBQlISpP1vYBtewWBEt8jEUm0LM20dj9rCGJz2EyWvJPyefzspmLKxpeSmFkOC95o2Xwoowsfrjgvw3qMPKLfED3bcoTp0GZWsAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAoCAYAAACWwljjAAAAAXNSR0IArs4c6QAAAtJJREFUWAm9WO1x2zAM9QgZwSN0hIyQEfrTJv0DhHs5CspdtEGyQbpBskG6gbqBu4FGcA8UaUE06dYxKd/5yNMH+QA8PIBarRb6AcCdAvusTfOpkY7ub5pegf2+EIRpGwC71qY5nIAEQH5UpjlswK6nNyrPLoEJIBkUe7EylNWKQxI2/deogLrqgLShXgJRSO/sCQ4jz+U95ld9QBFfJFcAursZIKTjAoDaQW4qeeLIHgGuCmgD9l7jHJBGemMvMTCN9k2C1XvqqwBym0HzMtss8kTqnkIqr0lbbEAjzcKU2jy+ppAORb3jwmOaWUaFTX025YURqZwwJtM3hMdQv/vxdM+WjxnVgsb2dwCqkf7skDpJ9C97iRdxtSkZHiZyA19e/NoXfXiSIVDGvhaxmEE5mXfV2BXCgZVTVmNfJKdqHUKDdFRIv0J4rjXw7Hm/UZKQLt5M1kwac3YUT9f/qcaCiGMvg+1QjJDSRddU4wCKwyNrklzv5rneiw6OOWGo30C3VkDf4krNgleMJznkweowSssT1XjIrVPsegASRpmyi1djtorVMoAZx+aFrzOwRGYN0oPFvCIXUkjdHJA7EXBxzBZIVmjpSbnezXPPk6TqJoD6lKcjN+VSNG8GIhfwXMmCcuJn6CMFsNoRxqv1T40kgM3FjxV5ft8f+MbS4TpBaWixOfODtSi3ICt0zltbeFyuykuAwqMnXgWQHMYtPD7I5xebO0WfhTkfRjaCM1Rh8+46CWNfq8nIRX7xR4ZMt8BeZZBVPHgpjCGc+XEU5HrA9m2+vxKNnQS4A+v67yqgeNExjNFB0Tf+3DXEEsLtbzUwYeG4vZEkdiGW3qp1cg1geIyLt6yBZ+3NEoDUWcmZyKvQPksOKWM/pDFV5rv904Pc1M+T3UTxw0LOophHCYCudc69X/y6J68o2pOaO3Cuj1/wo2ew0MvA6WzvDpc4/674F9QpNuHtECMaAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAdCAYAAAC9pNwMAAAAAXNSR0IArs4c6QAAAf5JREFUSA3VVsFtwzAMzAjdIN0g2aDdoCO0G2SEjJAROoKfBYrafPWdETpCPgUCSwGuOEsyaCmS3aA20ACBbNHmkdQd6dXqP/4M6tfF475Ang0aWDQPi4IbNOKA5bAY8Blv9wT1/xMgd4uA82wVMCxkPzswszNovjSwQXOcHTiQKgKen2Q623aYucyWNaUzzFR2Bs0p7P0JyYB6zT/BXHk7kE5CAcjv90RrUVcGsrugefJBboAqz3iLeu91SdLExAmySVYCp1XoZRY/T79Hh/Ox647lDKEuJwPqjOkgNJOwX1pbSDU4Et64UmUjjjMAMyawC1xeqGcLOVhIZV12g3doyxKQxlLE2haAY2e+sw0qOKnJ8CENkLu+BmzQbNJjc5WJA7x6T3bmAMN+DEw2a3nx2kIerwKUNj1je50GwLBqYN9K+zNlcwE+1yX/RZvPoncYQLlqYDrR2X5DtkXHY8ZSyWNg2zUQpwoGPOa7aNfOdLbhukXdj0QdZFE6RURvTBma6twNi6SL3T40DN63IbMpa9SAbv8yKRHL9d1OcoNGoQOkKqZUNXkm/sTxTqnN/lwpo3zDETcMEs8jG36a9FKyEMlpk/067s8cCCMQqVk3BJJnageixBQhT6nnkZ0wZ1lGBjHy+MDsp1X3gZCr0OAFfUNi/fol7cCPyxzBfgAIY8GIH7oU5QAAAABJRU5ErkJggg==\"","export default __webpack_public_path__ + \"static/media/upload-time-icon.44d1dfef.png\";","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAAXNSR0IArs4c6QAAAWtJREFUWAntmNFtwjAQhjNKawepj4zQUToCG8AmZQRe2jvboHSEbsAIGYHKCbacxDaXhgutlEgnLOI7f/59Pk4UwuBGGlVLgxc+U7XAz01Befhh/EZrCk/Bp4oH8cqPBhJHPD8r2N/L5BHP4YbHA2l8JzkRJ0kN+wUoJ9a/Uqg08CoNVqGt9Me6c8vEjDkkNbyF+XUd138N6LIAuUuQOLJFISdQsShkpcgVxlEKtT1St2iFBYw+7vZZ/rxa2FgdGia1OKltpGD5FmLKu9FAnM2abW1+AdRtqoTGb6nha7IpPKwqvZ4EVCrYhQHuPSYltcsPbhi7OTLQHDBkoD5MeVJb25Jw2LV0DG6v/7XvwzS7aBuogZM7Wo7PBigG8zCgFMzDgOzCqUcqOHAcSy5miqX5/qWCp8lFMVZYM/8jZIG4XpYGdimVuNa8GTcFddORc0IMinM9Uuw+FMmJe1IIxb0WOb6DIjvMMdFC/QCs2yuMHDlOsAAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAAAXNSR0IArs4c6QAAA3JJREFUWAm1WO1R4zAQdQmU4JHCDD9TQkqgg7sS6AA6IB1AB8kfoi/fmA6gA9KBS8jNW3kVoXFkYRRmGDmSVvu0+3ZXUtMs+GuV2ginH6TTO9npL+nMIJ0++X8zCKc/MIY57dvbeoGKcpF2t7sRzjx6IAyirBVWf0mr/rZKteUaC2YSoNgqnRmEPWyh7NbaddvvbngZfKNPduZeWvUabwQAsRbPXdzeKdUKS27xbrLqfeXU5qcLjiDf2d0AuNh6sjN/mDui019LAKUbIIDESaLAIM3hPp2T/e1Bjfyxh23sqqxgwWDb9zey01u2HnQViDUNdsFCK6OeioQWTFo59cR6ZsGBU+y+a4LifUTghiznJMIa+cgetix87Zbditw3qUv8M48ABaLX5NSksqhz5BwZRKTUIReytQoi5cfRFAGZ+kTEj3wbvhkFidK7UL1PCaZ90qkjZ/N0bOlv6XRPHoutxtxqjSnKKwA27vBUCyBbDevR5m7t25qQdmNHwZYDsO5cvGsADBlBqU0znhJA+pcCTDSFgSHEiQbnbP4rCwrrE6/Qh4dGGrWHxUrdCGQxMN5MDYCB60btG+EMzk4nuJSVzLVTwFjmNwADrcAz9uu3MGUtF9ocMBZZApBymj9wDg1HFy9Y0pYA43W8e5IgyeTKgCd88EoFbSkwHME5P5GezgyojznvBDzXcOUSQLBH4kqfLGuQfykgdlIgvzMfIV2ACzxhrk1d+VtArI9OuCC/Txd0DTvhcsET5loGJg2O377GlXIot7Y06hXrUILlGiWdHnJC8VgAxnfJAlLH8pe+uWYHWrGiFWpUwR/Pl5UAQSW7EefBAEGcz9996Mx8oFrMhX1GfHIoUCLmug9TnwRLrJbLQ5NaZzpRp4lbdHpObutsNRxfaivO4cLTA3Pr4gWIC7pw5jm3WM0x6GJrXVz3rj9f36q8MVzU5Af4AoQgavvEhamsL7r+Fn5NcAEUJdTCp4IE3HNNzo3PWeQ+SspxFKZWmvrt84qPVAqIwovK1FrcR6WLr4m4L/wUFC9EnIvO88g1beYsxXJpm9ZS3LpnOZUuMvWb3hgigLCgsPoFIPGUCfewHL7RB2sIfdjysYrcNlYKnlulJevhYhwBJGVcL7OtOtauFJObwlMmXfuM3gurPxHuASR9q6PEmNMPSx/8/gNjmQb+KBQwcAAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAAAXNSR0IArs4c6QAAAw1JREFUWAm1mIFR5DAMRbeEK+FKoARK0FYAJdABdAAdQAdHB9DBXgdcB5Tgy0/+T7TGThQnYWbHTmJLz5Isy5xODX/J7DaZPSSzP8nsK5l9J7PEH/oXfsOYmwYV8SnJ7Fen+JEggoi2gL9PZr/jGgMjCZRb5YXKbgAtMVwA3lkH8pYtBICPGtvcYoV0iyzzCTeuFUhIzJUcALZZL53Pdy52IGg1UL4AAkIWAOEBy8fMPhNKq4PLRlfNTgx8pKshc5B/Pt8Fpp1OXJWgnkKTGgYls6cwHGNKQX4YlNbh4KCzHnNuB71o8tFt51q59VLU1ZkVOQouRHDuFlNFZe4lY04b4tpLdKE+Lu6U1bvJgZS6PElgFLh0MgoTJT58libm77rx/2jZ+/xb63My+6DHJqu52Fq0FhQTTDsXlt4M6Kz21S8Oh6xiK7paB6YdrNjcBOgS+i1WjwoAgl8bwHBk4XBWfG4CdDv0AWDvBAu5MXPlmHv2AKQMLO4dYKid8BCum5wrRzBZewvgVVg5v07bVFoq7RyYprQAMqfBSN+wGDpJAiNtBExyCJhvkmrYjDxjR5ICbRSMKUD5qbcEz8eqd0aeI1zZAgR75K5EFt8l+FuB5CQX/BefLsLJMXflViAHhnsCjNSnCyXYcKkzgg3l96oYEkSp7YoJXF4A1idY3BH7wCwNLr0bwYZ5/dyloC7Jyd+5E2TIqU5R6MLhxiMNoESu7rJcee3ZlfTDIY6BrsT9qE3073la7AIkua7smWKd21RJcNFqe1hIQGi9tX7U/s5qqBQ2u8YrnuvTKKpOpiLRT3IH+rN/f2Q/mT1z802xlStk7S+Xbv8fQ64ge+6AdAGCzh+VytXwbseh8EMKwO8wOAcFPdVDfQ4Opt4t5hhTch+gpl14RVF54E6RWxGcsVVV5OE1jy4FOmSvg5JsxpwEYXU4flYDFs5SVM3zMSWIuZapxAOi/0qr1v5xh1jF9V9Wx8LQL6eEOYC5b7RefiOCssgPpdWuJ0WRlXUTqhLcsP4WrAIQfMOYxZOkpOQ/OCAZRugTZ1QAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAA4CAYAAACohjseAAAACXBIWXMAACxLAAAsSwGlPZapAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAURSURBVHgB7ZrNUhtHEMe7R7KSW/QGUZ4g4mKcQxK45WbnmBPi5oBB4hZDqlhXxZgbKz5cuQXfcgu55QaOcyAkVYgn8PoNlCNCO5PuQcK7w2r2C0nlqv1VUdqP+eqZ2Z5/zwBQUFBQUFAwEoQctFpOFfqXc76CGiJWUYlP4Q5QKN8ppbolLHWgXO64rtOFjGQysLW03vARFxDUHEyGjlLQ3nu5dQgpSWVg67FTk6XLI8r2OUwDBE+UK/M0ol7yLAmhUatLhGO6rMJ06QoF8+7LrU6SxIkMvB653jlEG9dBEB3+boQED3Lio6oOv2cJqjbiM+iKe5WZJCNZhgTIcu8YlGEcyrYof+zkcQBJaD3+gToXHapwIfC4Kq96v9HvTFz+2BFkh0JT8xcj17Pd/S0HJsjqk3WHOnkz+Iwcz2Kc4xEQAxnXDN5TjxxO2jhG14nQDj3E0KhGYjVQr3MA9VCZ9+QzmBLkQZ3gPX+fgzaOzmN7Cf1+yDgFeOK62x5MicH3HvKefRIatjxWA33l18OJlQdTR10E75BUlC211UB216GiEd7BtEH0wreYY4oqVQvfqrEuCUkw11oaQav+jfWiIRRO3cC0JFrobbAXk71eE1HUSM38J0Acufs/nZhp/KvLhoCS1rBSyddR61fryY9zEuQjUjGfaGVUrhym0Z1RpBtBg9XljQVSFG/JXzsKZIPcbJMaf9xc3tgZptEyr987R8AdTsN/SMKBFu63ZHjtpqyl9U3Oy2UMytqkss+5DshBZgO54TRnXYjQpwpUa+X7py2+9kVvB6I8HT3zr660QmK1xJ0UUU2V64hb62xkNpD0aQMskQWWsLm05NRptB6NTMML9XWU0oTRVGkGtCAj2aeo4WFvv4eaEH17GsK/Vkp1W5o4T2kju4EY41EpOCUPFut1S0J4EJOOnRdkJLOB7C1t76nXTwbedHTjqRN0GlNE36qrbK3Lnjcjg4ZFC29q+FCUCxTfwsjK1Zr+LVdczhNdlmyby04aci0THMLQ9sEivBfAXTaaGjwzFOXcOOHLz1ioD9PwNRk+7+6/0CPDIlr05TxNxlc3htIveeO13f3tzA6Gyb3Qu9cL9qE1zc/a2PkEaRpwx+QawQ8Bu4GGp0RhD00mgTTaEBfhWA2k6MEzip/2liGTqg1WA0tG9KBUaTobvqE2hDedaWvRuj9qn6JSngRvSVrV8+jCu4DbELwvy3AAbGI1cODZgqOYSxfmhSIO1qzvO5iFQswOd7wXNVUGhTMskGHC6DqNiIPVUly+WAO1yjBHkc4oVjjEmRA6EDbPRQJqyUais4mV5Y0Wzf0d8/m1OpG/63M8KbtQqXTzRuA3QXD/su7rOFI8jDqfYJWzd/DCjSsv8elS1NZ5EiiSd9sHz9ei3nHkz8ExpCXF0UEJEvL32ZuT2dkvuUPmIB0Pvpj9+vXp2Z9e8CFH8bRIb0NKBiOXOF8qqabFdVg4J8JX6tbIkyJJNRu0QFcwk2RaBsl8Rs/HWiDEHEXkD4HP83AQ4Y/cacbG7sHzV3yl3T2CO6JFni5GoScAPQn+ReneR0dZv+1c/4RgY3X56aFxpsfHXUe6MwynwSdW7YOtRRgDY4smhK8cMKJ53oCK8ojjPLFK7GTScvrvX93797+6pNH5xpZOB7V723/AmBibgczZP29OyYNeKFQP4HYU0KGo/rvdg61fYYyM7Rs0Gci7ocTrJP0viYKCgoKCgjHyP8ZzDjXxggDpAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAACxLAAAsSwGlPZapAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMTSURBVHgBzVhdUhpBEO7eKJo3bpDNCSQnCDcIN3A0Cak8Sd7UPKgvwhvkJRUwpcsN4ARyBDxB8Ab7lIpUOZ1uw8LMQmB32ZX9qpTp2b+veqa/7h6EhFDqvFhwxkdAVGGzJHMIMNCE3Svv0oOUgJAASh27BcRbHroLX4rota8vDyAFOJAAy8gJiEhV1ek5pIDYBD+qUwU2OR+JvgFB17oR6Ui2AayJLYgJB2mfTJvozQ+vMZIxe23ExM4ml4oF+F3m3x6sgVgeFI8wuXJgs+f6ATmBBmcAKSMWwRfwUDZtHfIOgnbt644PayIeQYSKZbOsQMaIGyRvjfHQXF4BAllBUXhOD3L0ihi7gY2Ew/m70CKoQT8fQfZO2bQfQXdXPfMHdtcmGFlmEOGdKS8/vcZg/i5yTasA4xpLD8QBf6PHqXIYi+A/eZlFMEYNjpkmRga/+6x6eNLqXNe/iB1piefkhWjh8iLS2pnjCQQ1JtmUYSQPRpUXIvTZBSNIDnf2Mqh9UMf9SNVM9eDkV/AwPzBq39RfQwaoqpMaf6AZ2LKVVi5xWF6AcAAZoePVW+b+5oAprSSYRF7WARHcG2ZxNUGWF9NeLC8pAu1stfX5/dd9TbrC/lwYgVb1kmHuFSnbccZNLnbd6fc4W209at3icSR5+J+8pIECPCheXmVM+VwdXcgSR9aubXCGkBHGsOPxj5kaR1KMhPegL8sY/LFtEvK/GykobXjeuc/7qW9MufLPEmpe817bm3Vj0n9wdrgJCELG4IB8RaG5RF1dFlCst6GAfFqtXBDkDFLZRro154KAzAVB4koc7WAdXnkNTwa5IDghYwbglGxu9iCn1PtF87khSIB7hjlVjFwQ/HR4KlLmBrbZkG2coFTOcthkzkmKC8YbJ+hoPniyYfXbGyc4IbMwggW52IO4JI1unKCc1oZS3Mi8bhULhFSyTkYd2oNZ9i6mdWo6JYO6qAH3zblwzRluO0sc46WpZZcWxSSN+DKw9lmH5CzWd51JiguQp0xyh2T33wKH26gL2Cx84fCSdsvh4zzBX5jDHjC93aCWAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAcCAYAAAAJKR1YAAAAAXNSR0IArs4c6QAAAaNJREFUWAntl21VxDAQRR8oQAJSkIADkIADkIADcIAEcAAOwMHiAM4NfWmabbZNs+3+Iefs6SSdj9s0M52V+nEh6V7Sp6SfjX7vkp4kXfYYf9KNpN1GEGMPS2wYwoDOSi+SriSxW1sMYj0n8ZnrtVt42IKgEOOxY4Al7s7eeywYr7HMG+Et7c46gSDIpxwA6fyUBGOxW4AoEasMZ1itc+yoWbe1hgX9yBGFgmJp2XYGa00K+4tZVgpcWreDtLKPVt2Sg2zd/pqBSFlqmB1y5XzV7pjto6MMeHIaHXSaAKRVt/Z8RX9RmEQYKpTsAOOj6ftzwYJ+S9oP8foZQN/9NMhfyXxS9JNMKmYKuR0gHGqv8wW/y2wOTW0XHRxSHrtnB+6j3L5w5ZDXdgz21wxkEBzSvrBTS8bRgHBE2xB6mSUknc1RgMig6waI1LQZaMk5SQFyOQD990P5tuRzCqOLWG2a5r5a5jEzAfroPK3WcM0g9V+gN3RJV59wKm1r+s6IH1R4I8Sidjl+3Cm6vrTAWWGrK7H3Ok/oaB/SL/XaQNSxQfn4BcXLAWUt2DGPAAAAAElFTkSuQmCC\"","export default __webpack_public_path__ + \"static/media/video-search.e5e08a51.png\";","export default __webpack_public_path__ + \"static/media/Age_icon.5ef04b1a.svg\";","export default __webpack_public_path__ + \"static/media/CreatorType_icon.13015a95.svg\";","export default __webpack_public_path__ + \"static/media/Ethnitcity_icon.9f9f9eb8.svg\";","export default __webpack_public_path__ + \"static/media/Gender_icon.54a14814.svg\";","export default __webpack_public_path__ + \"static/media/Lanaguage_icon.6a1bc930.svg\";","export default __webpack_public_path__ + \"static/media/Location_icon.31900c41.svg\";","export default __webpack_public_path__ + \"static/media/speech_report.78f1267f.jpg\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFIAAABSCAYAAADHLIObAAAAAXNSR0IArs4c6QAAAxtJREFUeAHt3OFtozAUB/CMkBGoSaV+zAgZJSN0g3aEbJBukH5JbOyc6AYdod0gI+TOpKWHVT+/BxbXI/9Ilgo2xP3lYWwwzGbB507rQrnqQTnzWrrqVDpzRroYeBNlDptC6yJg6y4qZ+6BxgscH2xdvY+l8mi2QOQhtk5Hs+1gql/VQ5uJQ1nUlClzuG8wfZsIRGEkBsHWtJnK6UdADoNUlX6clc7UgBwI6arXGbo4wxA/gvDkI5JsXH2XaOH06pqTcodktzAJudB61TnFX+FC4fQqFXCAZAQGIBlInCKA5CgxygCSgcQpAkiOEqMMIBlInCKjQJZWr5U121jy+VRlC2uXsW3HWp+s4xjdn9LqJ6qP5TFISEYlqf3nyMtRx8H9SEBeRoaAdOaMiExcJ+Ae9oAE5Nfph9O14EZW33KIyIlF5Pqm0k+xlOqj+XtGsW3HWp+qI+eoGXzW/jpIp/sXIDP9toD8nyD9Pd1C61U07fdL6v8pdrt5dFtqvznzUnVkDGMHt5EYImKI2N49RT9yYv1IXEZz5ow2Eld/6BkiknE32sgptZHKmk3p9HssKXvYUP3IW7tfxrYda32qjhjZUL+gIA+QAiyqKCApHUEeIAVYVNFRIH/iWDv3nE5AUmEmyAOkAIsqCkhKR5AHSAEWVRSQlI4gD5ACLKooICkdQd4okP6iA/Uw011NPyRe1PWc2r5PXlHv5gKnZNFRIJO1mEABQGb6EQEJyEwCmXaDiARkJoFMu0FE/mTI5gVLxANK/tbm1FLpql3q9q5ogkDzRhZr3lI7vcL89KsYPq82A5GYkGD1CysigUgg+kkK/nnL5GFo9brE4dxOAQy91NG8Nee0MAPLiegLpsnc1vYyIxlwMrjW61idOo+VtBmBNNYTwFa/FOHlwcFglX4e68Gif/k9fqKVf5lU9CWcQyAX/uVq+FwE+kICMYigPpBADBD9ohQSiN8gSiGBGEGUQAKRQORCAjGByIEEIgMxBQlEJiIFCUQBYgwSiELE7yCB2AMxhARiT8S/IYE4APETEogDEf3mQMyA+GcXvwFo+d/7aLJcbAAAAABJRU5ErkJggg==\"","export default __webpack_public_path__ + \"static/media/upload_image.a6a59d3b.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOwAAACUCAYAAACQosW4AAAAAXNSR0IArs4c6QAAChRJREFUeAHtnO1RG0kQhgmBEORdXOWfhOAQnMERgjOwQyADyED8gdkPXYkMuAy4DBQCVyNZLmyLUzM7q35353GVCix6t3vftx/NaDWjszP+/aLAYrk8r7twVXXNTb1qnuu+3dR988LjFBq0m6pvnrbad+FqEcLiF3P4DwrsFfgUwqJqHq4B9BRg2nNEeAF336X83CpQ9c1XQLVD5DHbqPr2G+1auALb6W/frD0akJxJLxDLxXp5Xnjblnn5Edaqa54AJwkct/f08T0u0BbIbN23S2CdFqyv/FoX2LLlXnL1d/vtlfluowU1pL9gVM3D13I7uKArj3eDASUdFCHtNtw9LgDcug23Qk3H6D7gM+6qe7guoGXLvcTFen0OrLMYXfcvdBtuQM2Y57iCCWBnBexL9HTGLVv2pTEdnhmsffMSV0KV3dUzvvqqb/ncdcB7RsXZSfR0xi1b9qWx/HB+I2zdN5uiunoRwmeXx/39ZVxtdEqxk0eIVbupu/DIY0QNBuyKOmUPxZ6NHye5MBPC57PkJs40taq65nm7I6N9+DK28MnX2oXHsWsr/fz1gDXdY2sX4dxu+dtut/SdpbgD+xqiCO+Yd/1e53rX7wA7NhOxD5M3YYxVnOIuLilg9xBFcMdYxbI//7t/AuxYTPw8rxKw273RohtDJIH9AdSmzjxNfjeo+2k/wP4Ea6xfVICNPad8c1IZ2N1qllX7V64mAdhcSuY/jwKwO1h936Me61F9YPsm2yLvY2K8+XdG2PyE/nZGb2B3m0L0v79rCsC+xE3Lv/mb9N83gdxPfd/6CbBJer/nIG9g63jD8y3/hZ6fBLBRyKoN39/TAIdikw0B2ENyZn3OE9gprTGfDLBxRcvQnRkAm5WxrCfzBXYao2vs3ykB+7Jo20GLKwA2K2NZT+YF7JRG18kBW7fhbkiXAOwQ9cY91g3YNtwl94XDe9tJjbBDF3onG8N72HFpPTuLfeiy0kn5M9dD/To1YF+GrIA6JIDpOYCdJbBT/AaSyQH7sbu/TO0eE5yHpjkAmyq5+TiPEXbRh8/JPXGoT07w3NmHNtye+hE/V00V6iJuMUr8l5ozbqtLTMlhRgWmBmzs4VNzE/MZ5cwbFj9TTYUHYPN6oXK2yQGbYV2AivZH6wDYoxIVFwCwwpYDrLA5TqUBrJPwlrQAa1GprBiAFfYbYIXNcSoNYJ2Et6QFWItKZcUArLDfACtsjlNpAOskvCUtwFpUKisGYIX9Blhhc5xKA1gn4S1pAdaiUlkxACvsN8AKm+NUGsA6CW9JC7AWlcqKAVhhvwFW2Byn0gDWSXhLWoC1qFRWDMAK+w2wwuY4lQawTsJb0gKsRaWyYgBW2G+AFTbHqTSAdRLekhZgLSqVFQOwwn4DrLA5TqUBrJPwlrQAa1GprBiAFfYbYIXNcSoNYJ2Et6QFWItKZcUArLDfACtsjlNpAOskvCUtwFpUKisGYIX9Blhhc5xKA1gn4S1pAdaiUlkxACvsN8AKm+NUGsA6CW9JC7AWlcqKAVhhvwFW2Byn0gDWSXhLWoC1qFRWDMAK+w2wwuY4lQawTsJb0gKsRaWyYgBW2G+AFTbHqTSAdRLekhZgLSqVFQOwwn4DrLA5TqUBrJPwlrQAa1GprBiAFfYbYIXNcSoNYJ2Et6QFWItKZcUArLDfACtsjlNpAOskvCUtwFpUKisGYIX9Blhhc5xKA1gn4S1pAdaiUlkxACvsN8AKm+NUGsA6CW9JC7AWlcqKAVhhvwFW2Byn0gDWSXhLWoC1qFRWDMAK+w2wwuY4lQawTsJb0gKsRaWyYgBW2G+AFTbHqTSAdRLekhZgLSqVFQOwwn4DrLA5TqUBrJPwlrQAa1GprBiAFfYbYIXNcSoNYJ2Et6QFWItKZcUArLDfACtsjlNpAOskvCUtwFpUKisGYIX9Blhhc5xKA1gn4S1pAdaiUlkxACvsN8AKm+NUGsA6CW9JC7AWlcqKAVhhvwFW2Byn0gDWSXhLWoC1qFRWDMAK+w2wwuY4lQawTsJb0gKsRaWyYgBW2G+AFTbHqTSAdRLekhZgLSqVFQOwwn4DrLA5TqUBrJPwlrQAa1GprBiAFfYbYIXNcSoNYJ2Et6QFWItKZcUArLDfACtsjlNpAOskvCUtwFpUKisGYIX9Blhhc5xKA1gn4S1pAdaiUlkxACvsN8AKm+NUGsA6CW9JC7AWlcqKAVhhvwFW2Byn0gDWSXhLWoC1qFRWDMAK+w2wwuY4lQawTsJb0gKsRaWyYgBW2G+AFTbHqTSAdRLekhZgLSqVFQOwwn4DrLA5TqUBrJPwlrQAa1GprBiAFfYbYIXNcSoNYJ2Et6QFWItKZcUArLDfACtsjlNpAOskvCUtwFpUKisGYI1+V11z4/B4qvvmJeVxEcJn46X9EZaSb3tMFx7/OBlPZFVgcsB2zZMDNzdnyU2cCNzQfACblROZk3kA+7G7vxzaj6c+fnLALtbL89QuSxaXETZVcvNxHsAuQlgk94TTgDU1YDfmDjgQmGwOwB5QM+9THsDGK6j7dpPcFw7QTgvYNtwNaZNkYwB2iOymY92AbcNdcl8A7JEbUV24Mrn/RlCyMQD7hqL5nnYDdtV+Se4LgH0b2GrVPA9tj2RjAHao9EeP9wJ2sV6fT2laPJ0p8cDRNXYMwB7lxi3AC9h4wVUfvif3xolH2fQmPmGhOUZXgHVj0ZTYE9gdtG3y2oBTwq4P7KrdLNZhYXL9SFCysEyJjyg7/M/ewH5ax4949O8Y6wPbPnwZ3g67MwBsLiXzn8cb2HhFdReuknvkRDNOXWBX7abOCOvWkFRRGWHzE/rbGRWA3fbI9q6x7kgrCWzVN0+5psGv+yL51RNgX8s4yu8qwMaL206PV81zcr+kDgyG47SAXbWbi/7h6ygdwV3isWTNcl4lYPcXtJ0ii4ErAGz490Mbbi/69F04e4GP/Ux+xWSEPSbt4L8rAru/qDpOk7twWwvAexZB8XjEhddDFvLvxXzPz2Rg+yauN13zGFOD9PeN7+mBobGxZz923aUHM6cY1Ibqk/X4Kdy2H/CikrS/eAb5Bm0IydpgnCyvAlU/jQ/HZwDRyV48oqd5u4SzySiwfR9iuBMHMG+v6VbTplo1NzINRiF5FZjCB+NqQMjXk2GNed4u42zZFJjazgx5WARmK6e+cZmtGTmRTYGqa64BYTpT3v/ziumwrecnHTWVRd7/16j8bfeCM8ZquEk391yLj6upaPppj7IXbfg+1/7kug4oMGRlDbA7w75qlwcs5ak5KxBvQPG5rDN4CTetdhtD0r/qds49Pftr+3HXeMmIORFwu/DIXeHZY3n8Ai8m9J0+Rb64jLyL63iHECGnwPbucdyRkTBN45iRRuhVu6m6h2vuBsvholPQD3Cv4jLGqmv+qeM3XwDxadYGb7XebbeMq9KY/v7JxX9qI+cFAZKy8QAAAABJRU5ErkJggg==\"","var map = {\n\t\"./NoSummaryAvailable.png\": 476,\n\t\"./SummaryError.png\": 463,\n\t\"./addLink.png\": 477,\n\t\"./analyzed.png\": 452,\n\t\"./analyzingDataMessage.png\": 478,\n\t\"./big-comment.png\": 479,\n\t\"./big-like.png\": 480,\n\t\"./big-view.png\": 481,\n\t\"./brand-safety-icon.png\": 514,\n\t\"./brandSafety.png\": 464,\n\t\"./campaignIcon.png\": 482,\n\t\"./campaignRewardIcon.png\": 483,\n\t\"./creatorIcon.png\": 515,\n\t\"./dateIcon.png\": 484,\n\t\"./demo-edit-icon.png\": 516,\n\t\"./demographicsAddIcon.png\": 485,\n\t\"./descriptionIcon.png\": 486,\n\t\"./dollarIcon.png\": 487,\n\t\"./dropbox-deleted.png\": 459,\n\t\"./dropboxIcon.png\": 488,\n\t\"./editPen.png\": 460,\n\t\"./editPenBlack.png\": 489,\n\t\"./emailIcon.png\": 490,\n\t\"./expand-right-icon.png\": 447,\n\t\"./expandDown.png\": 517,\n\t\"./favIcon.png\": 518,\n\t\"./flagIcon.png\": 519,\n\t\"./hashIcon.png\": 520,\n\t\"./info.png\": 454,\n\t\"./left-arrow.png\": 491,\n\t\"./minors.png\": 465,\n\t\"./musicIcon.png\": 492,\n\t\"./negativeSentimentIcon.png\": 493,\n\t\"./newCreatorIcon.png\": 494,\n\t\"./notAnalyzed.png\": 450,\n\t\"./notesIcon.png\": 495,\n\t\"./pendingAnalysis.png\": 453,\n\t\"./positiveSentimentIcon.png\": 466,\n\t\"./productFeatured.png\": 496,\n\t\"./publishWhiteIcon.png\": 497,\n\t\"./publishWidget.png\": 521,\n\t\"./publishWidgetWhite.png\": 522,\n\t\"./publishedActive.png\": 523,\n\t\"./publishedIcon.png\": 498,\n\t\"./publishedModal.png\": 524,\n\t\"./publishedNonActive.png\": 525,\n\t\"./publishedSwirll.png\": 467,\n\t\"./restore.png\": 290,\n\t\"./right-arrow.png\": 499,\n\t\"./saveIcon.png\": 500,\n\t\"./see-original.png\": 501,\n\t\"./shareIcon.png\": 502,\n\t\"./sizeIcon.png\": 503,\n\t\"./sound-icon.png\": 526,\n\t\"./sound.png\": 468,\n\t\"./speech-icon.png\": 527,\n\t\"./speech.png\": 469,\n\t\"./summaryAccordion.png\": 504,\n\t\"./swirlLogo.png\": 470,\n\t\"./tagsIcon.png\": 528,\n\t\"./tikTokIcon.png\": 471,\n\t\"./trashIcon.png\": 505,\n\t\"./unPublishWidgetWhite.png\": 529,\n\t\"./unPublishedModal.png\": 530,\n\t\"./unPublishedSwirll.png\": 506,\n\t\"./unpublish-Icon.png\": 472,\n\t\"./unpublishWidget.png\": 531,\n\t\"./uploadVideo.png\": 532,\n\t\"./upload_image_video.png\": 507,\n\t\"./videoDetail.png\": 508,\n\t\"./vyrillData.png\": 509,\n\t\"./watchIcon.png\": 510,\n\t\"./youtubeIcon.png\": 473\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = 1178;","export default \"data:image/png;base64,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\"","import { Card } from \"reactstrap\";\n\nconst Categories = ({ items, categoryHandler }) => {\n return (\n \n
\n \n {isCampaignVideo(video?.upload_method) && (\n
\n \n
\n \n
\n );\n};\n\nexport default Categories;\n","import { X } from \"react-feather\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { Modal, ModalBody, ModalHeader } from \"reactstrap\";\nimport { useLocation, useNavigate } from \"react-router-dom\";\n\nimport DropboxPlayer from \"../DropboxPlayer\";\nimport \"./Styles/Styles.scss\";\nimport { TikTokThumbnail, YoutubeThumbnail } from \"./ThumbnailByPlatform\";\nimport {\n updateParams,\n updateVideoPageState,\n} from \"../../Pages/Video/VideoActions\";\nimport { addDefaultSrc } from \"../../utilities\";\nconst defaultIcon = require(\"@src/assets/images/vyrill/default.png\").default;\nimport { updateTutorialState } from \"../Tutorials/TutorialActions\";\nimport { fetchNavbarStats } from \"../../vyrill-ui-config/layout/sidebar/navbarStatsActions\";\n\nconst Step3SuccessMessage = ({\n open,\n handleClose,\n successData,\n addCompetitorVideo,\n}) => {\n const dispatch = useDispatch();\n const navigate = useNavigate();\n const location = useLocation();\n const isCategoryPage = useSelector(\n (state) => state.videoPageStates.isCategoryPage\n );\n const videoData = useSelector((state) => state.videoData.count);\n const videoIndexPage = () => {\n if (!location?.pathname?.includes(\"videos\")) {\n dispatch(fetchNavbarStats());\n navigate(\"/videos\");\n // TODO:\n if (localStorage.getItem(\"toturialScreen\") === \"firstVideo\") {\n dispatch(\n updateTutorialState({\n isTutorial: true,\n activeTutorial: \"first-video\",\n activeStep: 1,\n totalSteps: 2,\n })\n );\n }\n }\n if (isCategoryPage) {\n dispatch(updateVideoPageState({ isCategoryPage: false }));\n }\n if (!(location?.pathname?.includes(\"videos\") && !isCategoryPage)) {\n dispatch(updateParams({ reFetch: true }));\n }\n dispatch(updateParams({ reFetch: true }));\n handleClose(!open, \"step3Modal\");\n };\n const dropboxThumbnail = (\n \n {items.map((i) => (\n categoryHandler(i)}\n >\n 
\n
\n {i.name}
\n \n ))}\n\n
\n );\n\n const tiktokThumbnail = (\n \n {successData.platform === \"localVideo\" && (\n
\n \n\n \n \n {videoData >= 1\n ? \"Congratulations! Your video has been successfully uploaded!\"\n : \"Your first video has been successfully uploaded!\"}\n \n
\n\n \n \n Your new video is now in the Videos tab under{\" \"}\n \n {addCompetitorVideo ? \"My Competitors.\" : \"My Videos.\"}\n {\" \"}\n
\n\n Click here\n {\" \"}\n to view it in the dashboard\n \n
\n \n \n
\n {addCompetitorVideo && (\n
\n {!addCompetitorVideo && (\n \n ({ label: i, value: i }))}\n isMulti\n components={{\n DropdownIndicator: () => null,\n IndicatorSeparator: () => null,\n }}\n styles={fieldStyles}\n placeholder=\"Type here…\"\n />\n
\n )}\n \n Competitor Brand Name\n
\n \n {validationErrors.competitor}{\" \"}\n
\n \n null,\n IndicatorSeparator: () => null,\n }}\n />\n
\n \n Products Featured\n \n 
\n \n {toolTipFunction(productFeaturedTooltip, \"ProductsName\")}\n
\n\n \n \n Product Category\n
\n \n null }}\n styles={fieldStyles}\n placeholder=\"Type here…\"\n />\n
\n \n {validationErrors.tagValueError}{\" \"}\n
\n \n \n Notes\n \n \n \n {toolTipFunction(notesTooltip, \"Notes\")}\n
\n \n
\n \n )}\n \n );\n};\n\nexport default VideoDetails;\n","import { addDefaultSrc } from \"../../utilities\";\nimport DropboxPlayer from \"../DropboxPlayer\";\nimport { TikTokThumbnail, YoutubeThumbnail } from \"./ThumbnailByPlatform\";\n\nconst defaultIcon = require(\"@src/assets/images/vyrill/default.png\").default;\nconst youTubeIcon =\n require(`@src/assets/images/vyrill/icons/youtube_icon.png`).default;\nconst tikTokIcon =\n require(`@src/assets/images/vyrill/icons/tiktok_icon.png`).default;\nconst googleDriveIcon =\n require(`@src/assets/images/vyrill/icons/google_drive_icon.png`).default;\nconst dropboxIcon =\n require(`@src/assets/images/vyrill/reports/dropbox_icon.svg`).default;\nconst instagramIcon =\n require(`@src/assets/images/vyrill/icons/instagram_icon.png`).default;\n\nconst MainThumbnail = ({ selectedImage, singleVideoDetail }) => {\n const dropboxThumbnail = (\n \n {validationErrors.notesError}{\" \"}\n
\n \n
\n );\n\n const tiktokThumbnail = (\n \n 
\n
\n ) : (\n <>\n {singleVideoDetail.platform === \"localVideo\" && (\n \n
\n \n );\n};\n\nexport default MainThumbnail;\n","import { useEffect } from \"react\";\nimport { X } from \"react-feather\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { Button, Modal, ModalBody, Spinner } from \"reactstrap\";\nimport Cookies from \"js-cookie\";\n\nimport VideoDetails from \"./VideoDetails\";\nimport MainThumbnail from \"./MainThumbnail\";\nimport { fetchAutoCompleteProductOrHashtagList } from \"../../Pages/Product/productActions\";\n\nconst Step2FetchDetails = ({\n open,\n savedLoading,\n productsOption,\n singleVideoDetail,\n handleClose,\n updateSwitch,\n handleSuccess,\n onChangeNotes,\n updateVideoTags,\n ShouldNextEnable,\n handleChangeProduct,\n selectCompetitors,\n handleTagsInputChange,\n handleChangeCategory,\n stepBackHandler,\n}) => {\n const { errors } = useSelector((state) => state);\n const { validationErrors } = errors;\n const { platform } = singleVideoDetail;\n const { addCompetitorVideo } = useSelector((state) => state.videoData);\n const dispatch = useDispatch();\n useEffect(() => {\n dispatch(\n fetchAutoCompleteProductOrHashtagList({\n is_hashtag: false,\n brand_id: Cookies.get(\"bId\"),\n user_id: Cookies.get(\"uId\"),\n })\n );\n }, []);\n const SwitchFilter = ({ fieldText, value, name }) => (\n \n {singleVideoDetail.platform === \"Youtube\" && (\n 
\n )}\n {singleVideoDetail.platform === \"Tiktok\" && (\n 
\n )}\n {singleVideoDetail.platform === \"Dropbox\" && (\n 
\n )}\n {singleVideoDetail.platform === \"GoogleDrive\" && (\n 
\n )}\n {singleVideoDetail.platform === \"Instagram\" && (\n 
\n )}\n
\n \n )}\n \n File Link\n
\n \n \n \n {singleVideoDetail.video_url || singleVideoDetail.thumbnail_url}\n \n \n
\n \n \n {\n handleClose(!open, \"step2Modal\");\n }}\n />\n
\n\n \n
\n {singleVideoDetail.title}
\n\n
\n\n {!singleVideoDetail.enableNext && (\n \n
\n \n
\n \n
\n \n {!addCompetitorVideo && (\n \n {SwitchFilter({\n fieldText: \"Verified Shopper\",\n value: singleVideoDetail.is_paid_or_sponsored,\n name: \"is_paid_or_sponsored\",\n })}\n \n {SwitchFilter({\n fieldText: \"Brand Video\",\n value: singleVideoDetail.is_advertisement,\n name: \"is_advertisement\",\n })}{\" \"}\n \n
\n )}\n\n \n {\n stepBackHandler();\n }}\n style={{ right: \"310px\", width: \"178px\", height: \"56px\" }}\n >\n Back\n \n\n \n \n Save {savedLoading &&
\n \n \n \n )}\n \n \n
\n\n \n
\n Are you sure you want to cancel this task?
\n\n handleCancel(!open)}\n >\n No\n \n \n Yes\n \n
\n \n \n
\n\n \n 
\n
\n \n
\n\n \n Video Upload Limit Reached!\n
\n\n \n We can help you add more videos to your dashboard.\n
\n
\n \n \n We can help you add more videos to your dashboard.\n
\n
\n Contact us at{\" \"}\n \n sales@vyrill.com{\" \"}\n \n to upgrade your plan.\n
\n \n {iconData.map((icon, index) => (\n
\n);\n\nconst Step1AddUrl = ({\n open,\n videoUrls,\n videoType,\n handleChange,\n setVideoURL,\n uploadVideoDetails,\n handleClose,\n handleSubmit,\n fetchLoading,\n setVideoType,\n setStep1Modal,\n setUploadVideoModal,\n setSingleVideoDetail,\n}) => {\n const { addCompetitorVideo } = useSelector((state) => state.videoData);\n const { errors } = useSelector((state) => state);\n const { validationErrors } = errors;\n const dispatch = useDispatch();\n\n const URLHandler = () => {\n const detectPlatform = (url) => {\n // disabled facebook for now\n // if (url.includes(\"facebook.com\")) {\n // return \"Facebook\";\n // } else\n if (url.includes(\"instagram.com\")) {\n return \"Instagram\";\n } else if (url.includes(\"youtube.com\") || url.includes(\"youtu.be\")) {\n return \"YouTube\";\n } else if (url.includes(\"tiktok.com\")) {\n return \"TikTok\";\n }\n return null;\n };\n\n return (\n \n
\n ))}\n \n {\n const platform = detectPlatform(e.target.value);\n if (platform) {\n setVideoType({ value: platform });\n } else {\n setVideoType(null);\n }\n handleChange(index, e);\n }}\n placeholder=\"Add your video link here\"\n />\n
\n ))}\n \n );\n };\n\n // Show message to user if the remaining video upload limit is less than or equal to 10\n const notificationBand = () => {\n return (\n uploadVideoDetails &&\n uploadVideoDetails.video_upload_limit &&\n uploadVideoDetails.video_upload_limit -\n uploadVideoDetails.uploaded_videos <=\n 10 && (\n \n You have{\" \"}\n \n {uploadVideoDetails.video_upload_limit &&\n uploadVideoDetails.video_upload_limit -\n uploadVideoDetails.uploaded_videos}{\" \"}\n video uploads\n {\" \"}\n left. Contact\n \n {\" \"}\n sales@vyrill.com{\" \"}\n \n to upgrade your plan\n
\n )\n );\n };\n\n const uplaodVideoBtn = (\n \n
\n \n
\n \n Add {addCompetitorVideo && \"Competitor\"} Video Link\n
\n\n \n <>\n i).length\n ? false\n : true\n }\n color={`${\n videoType && videoUrls.filter((i) => i).length\n ? \"primary\"\n : \"secondary\"\n }`}\n >\n \n Add Video {fetchLoading &&
\n \n \n {notificationBand()}\n \n \n \n
\n {AllIcons}\n \n \n {\n setAuthorizationToken(\"\");\n setDriveAccessToken(\"\");\n setUploadVideoModal(false);\n setStep1Modal(true);\n setChooserOpen(false);\n sessionStorage.removeItem(\"authorizationDropboxToken\");\n }}\n >\n 
\n \n Add a video link\n \n
\n \n \n \n dispatch(receiveValidationErrors({}))}\n dropboxRef={dropboxRef}\n chooserOpen={chooserOpen}\n setChooserOpen={setChooserOpen}\n // authorizationDropboxToken={authorizationDropboxToken}\n />\n
\n {videoIcon}
\n \n \n \n Select File\n \n \n \n \n Local Computer\n \n \n \n \n \n Dropbox\n \n \n */}\n\n authorizeDropbox()}>\n \n Dropbox\n \n \n \n \n \n Google Drive\n \n \n \n \n \n
\n Drag and drop videos to upload
\n\n
\n );\n return (\n \n \n {singleVideoDetail.platform === \"localVideo\" && (\n \n )}\n {singleVideoDetail?.platform === \"Dropbox\" && dropboxThumbnail}\n {singleVideoDetail?.platform === \"GoogleDrive\" && (\n {\n e.target.src =\n require(\"@src/assets/images/vyrill/default.png\").default;\n }}\n width={\"100%\"}\n />\n )}\n
\n \n \n dispatch(receiveValidationErrors({}))}\n setStep1Modal={setStep1Modal}\n setUploadVideoModal={setUploadVideoModal}\n />\n {step2Modal && (\n
\n );\n};\n\nexport default UploadVideoProcess;\n","import React from \"react\";\nimport { string } from \"prop-types\";\n\nconst AuthField = ({\n required,\n header,\n error,\n name,\n value,\n update,\n placeholder,\n description,\n noIcon,\n type,\n minLength,\n maxLength,\n pattern,\n title,\n classNameField,\n classNameLabel,\n classNameText,\n classNameInput,\n classNameMessage,\n storeUrl,\n disabled,\n}) => {\n // Conditional styles for disabled state\n const disabledStyles = disabled\n ? {\n backgroundColor: \"#f0f0f0\", \n color: \"#999\",\n cursor: \"not-allowed\",\n }\n : {};\n\n return (\n \n );\n};\n\nAuthField.defaultProps = {\n classNameField: \"\",\n classNameText: \"\",\n classNameLabel: \"\",\n classNameInput: \"\",\n classNameMessage: \"\",\n};\n\nAuthField.propTypes = {\n classNameField: string,\n classNameText: string,\n classNameLabel: string,\n classNameInput: string,\n classNameMessage: string,\n};\n\nexport default AuthField;\n","export default __webpack_public_path__ + \"static/media/campaign-default.67c17bc3.png\";","import { ChevronLeft, ChevronRight } from \"react-feather\";\n\nimport \"./Styles/IndexPageGrid.scss\";\n\nconst IndexFilterToggle = ({ filtersOpen, toggleFilters }) => {\n return (\n \n
\n );\n};\nexport default Loading;\n","import { Button } from \"reactstrap\";\nimport { isEmpty } from \"lodash\";\nimport Cookies from \"js-cookie\";\nimport { updateVideoPageState } from \"../../Pages/Video/VideoActions\";\nimport { useDispatch, useSelector } from \"react-redux\";\n\nexport const AddVideosBtn = ({ uploadVideoDetails, setUploadVideoModal }) => {\n return (\n // \n
\n Add Video
\n \n );\n};\n\nexport const CreateCampaign = () => {\n return (\n \n {isPublished ? (\n
\n \n {isPublished ? \"Unpublish Video\" : \"Publish Video\"}\n
\n \n );\n};\n","// ** React Imports\nimport { forwardRef } from \"react\";\n\n// ** Third Party Components\nimport Proptypes from \"prop-types\";\nimport classnames from \"classnames\";\n\n// ** Reactstrap Imports\nimport { Badge } from \"reactstrap\";\n\nconst Avatar = forwardRef((props, ref) => {\n // ** Props\n const {\n img,\n size,\n icon,\n color,\n status,\n badgeUp,\n content,\n tag: Tag,\n initials,\n imgWidth,\n className,\n badgeText,\n imgHeight,\n badgeColor,\n imgClassName,\n contentStyles,\n ...rest\n } = props;\n\n // ** Function to extract initials from content\n const getInitials = (str) => {\n const results = [];\n const wordArray = str.split(\" \");\n wordArray.forEach((e) => {\n results.push(e[0]);\n });\n return results.join(\"\");\n };\n\n return (\n \n
\n );\n }\n}\n\nexport const SearchTarget = ({ search, text }) => {\n const regex = new RegExp(search, \"gi\");\n const match = regex.exec(text);\n if (!match) return {text};\n return (\n \n {text.slice(0, match.index)}\n {match[0]}\n {text.slice(regex.lastIndex)}\n \n );\n};\n\nexport default SearchFilters;\n","import React, { Fragment, useEffect, useState } from \"react\";\nimport { Link, useLocation } from \"react-router-dom\";\n\nimport Cookies from \"js-cookie\";\nimport { string, shape, func } from \"prop-types\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport {\n Card,\n CardBody,\n CardFooter,\n Collapse,\n Row,\n Col,\n Container,\n FormGroup,\n Label,\n Input,\n Button,\n Spinner,\n ButtonDropdown,\n DropdownToggle,\n DropdownMenu,\n DropdownItem,\n} from \"reactstrap\";\nimport TranscriptTab from \"./TranscriptTab\";\nimport { VideoNote } from \"../../../Shared/Notes/Notes\";\nimport { SearchTarget } from \"../../../Shared/SearchFilters\";\nimport {\n fetchTranscript,\n getTranscripts,\n updateCopyTranscript,\n} from \"../VideoActions\";\nimport {\n dateString,\n addDefaultSrc,\n getFilterSearchTranscript,\n abbreviateNumber,\n} from \"../../../utilities\";\nimport DropboxPlayer from \"../../../Shared/DropboxPlayer\";\nimport GenerateTiktokThumbnail from \"../../../Shared/GenerateTiktokThumbnail\";\n\nconst brand_id = Cookies.get(\"bId\");\nconst user_id = Cookies.get(\"uId\");\nconst { REACT_APP_BASE_URL } = process.env;\n\nconst lodash = require(\"lodash\");\nconst mainCard = {\n padding: \"8px\",\n margin: \"8px 25px 8px 8px\",\n borderRadius: \"10px\",\n border: \"0.5px solid #dedee3\",\n};\n\nconst img = {\n borderRadius: \"10px\",\n display: \"block\",\n maxWidth: \"100%\",\n maxHeight: \"100%\",\n};\n\nconst style = {\n width: \"100%\",\n height: \"260px\",\n objectFit: \"contain\",\n background: \"black\",\n borderRadius: \"10px\",\n};\n\nconst link = {\n textDecoration: \"underline\",\n color: \"#4b0c64\",\n};\n\nconst linkColor = {\n color: \"#4b0c64\",\n};\n\nconst useStyles = {\n mainCard: {\n padding: \"2px\",\n margin: \"auto\",\n borderRadius: \"10px\",\n },\n collapse: {\n borderRadius: \"10px\",\n },\n img: {\n borderRadius: \"10px\",\n display: \"block\",\n maxWidth: \"100%\",\n maxHeight: \"100%\",\n },\n video_title: {\n textDecoration: \"underline\",\n },\n transcript: {\n borderRadius: \"10px\",\n padding: \"7px\",\n backgroundColor: \"#dfffffbf\",\n },\n expand: {\n transform: \"rotate(0deg)\",\n marginLeft: \"auto\",\n },\n expandOpen: {\n transform: \"rotate(180deg)\",\n },\n collapseCard: {\n borderRadius: \"10px\",\n },\n\n link: {\n textDecoration: \"underline\",\n color: \"#4b0c64\",\n },\n linkColor: {\n color: \"#4b0c64\",\n },\n videoFrame: {\n borderRadius: \"10px\",\n backgroundColor: \"black\",\n height: \"100%\",\n position: \"absolute\",\n top: 0,\n },\n};\n\nconst iconStyle = {\n marginRight: \"5px\",\n};\n\nexport default function Transcript({\n video,\n transcript,\n search,\n note,\n handlePlayVideoSentence,\n totalVideo,\n toggleTranscript,\n keywordsSwitch,\n}) {\n Transcript.propTypes = {\n video: shape({}).isRequired,\n search: string.isRequired,\n note: shape({}).isRequired,\n transcript: shape({}).isRequired,\n handlePlayVideoSentence: func.isRequired,\n };\n\n const dispatch = useDispatch();\n const [expanded, setExpanded] = useState(false);\n const [checked, setChecked] = useState(true);\n const [loadingFile, setLoadingFile] = useState(false);\n const [downloadDropdown, setDownloadDropdown] = useState(false);\n\n const navbarStatsReducer = useSelector((state) => state.navbarStatsReducer);\n const copyText = useSelector((state) => state.copyTranscriptReducer);\n\n const location = useLocation();\n const isAppManager = location.pathname === \"/published\";\n\n const classes = useStyles;\n\n const toggleDropdown = () => setDownloadDropdown(!downloadDropdown);\n\n const handleDownloadReport = (fileType) => {\n setLoadingFile(true);\n const body = {\n highlight: search,\n report_type: checked ? \"keywords_only\" : \"all_transcripts\",\n video_id: video._id,\n brand_id,\n user_id,\n // filters: selectedFilters, TODO: All Videos\n };\n //const csrfToken = document.querySelector('meta[name=csrf-token]').content;\n const headers = {\n // 'X-CSRF-Token': csrfToken,\n \"Content-Type\": \"application/json\",\n };\n const config = { method: \"POST\", body: JSON.stringify(body), headers };\n\n fetch(\n `${REACT_APP_BASE_URL}/jwt_api/videos/download_transcript_report.${fileType}`,\n config\n )\n .then((response) => response.blob())\n .then((blob) => URL.createObjectURL(blob))\n .then((url) => {\n // window.open(url, '_blank');\n const link = document.createElement(\"a\");\n link.href = url;\n link.download = `transcript-report.${fileType}`;\n link.setAttribute(\"type\", \"hidden\");\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n // For Firefox it is necessary to delay revoking the ObjectURL\n setTimeout(() => {\n URL.revokeObjectURL(url);\n }, 100);\n setLoadingFile(false);\n })\n .catch((err) => {\n setLoadingFile(false);\n console.log(err);\n });\n };\n\n const handleChange = (event) => {\n setChecked(event.target.checked);\n };\n\n useEffect(() => {\n setExpanded(toggleTranscript);\n }, [toggleTranscript]);\n\n useEffect(() => {\n setChecked(keywordsSwitch);\n }, [keywordsSwitch]);\n\n const avgEngagement = () => {\n const { likes, youtube_dislike_count, comment_count } = video;\n const avgEng = (likes + youtube_dislike_count + comment_count) / totalVideo;\n return Math.round(avgEng);\n };\n\n const handleExpandClick = (id) => {\n if (!expanded) {\n if (transcript.video_id !== id) {\n dispatch(fetchTranscript([id]));\n }\n }\n setExpanded(!expanded);\n };\n\n const imageBlock = () => (\n \n {filters.map((filter) => (\n \n ))}\n
\n \n
\n ) : (\n \n
\n \n
\n );\n\n const disableCopy =\n copyText.loading === video?._id || copyText.copied === video?._id;\n\n const copyTranscript = () => {\n if (disableCopy) {\n return;\n }\n dispatch(updateCopyTranscript({ loading: video?._id }));\n getTranscripts([video?._id])\n .then((data) => {\n let copiedTranscription = \"\";\n if (data.length && data[0].transcription?.length) {\n copiedTranscription = data[0].transcription\n .map((i) => i.content || \"\")\n .join(\"\\r\\n\");\n }\n dispatch(\n updateCopyTranscript({\n loading: \"\",\n copied: video?._id,\n text: copiedTranscription,\n })\n );\n if (copiedTranscription.length) {\n const el = document.createElement(\"textarea\");\n el.value = copiedTranscription;\n document.body.appendChild(el);\n el.select();\n document.execCommand(\"copy\");\n document.body.removeChild(el);\n }\n })\n .catch((err) => {\n console.log(err);\n });\n };\n\n const getFilterTitle =\n search &&\n video?.title &&\n getFilterSearchTranscript(search, video?.title).map((text, index) => (\n \n \n \n Views:\n {abbreviateNumber(video.youtube_view_count || video.view_count)}\n
\n \n \n Comments:\n {abbreviateNumber(video.comment_count)}\n
\n \n \n Likes:\n {abbreviateNumber(video.likes)}\n
\n {video.platform !== \"Tiktok\" && (\n \n \n Dislikes:\n {abbreviateNumber(video.youtube_dislike_count)}\n
\n )}\n \n Avg\n Engagement:\n {abbreviateNumber(avgEngagement())}\n
\n \n \n ));\n\n const expandTranscript = () => (\n
\n \n )\n );\n\n const getSearchFromDecription =\n search &&\n video?.transcription_text &&\n getFilterSearchTranscript(search, video?.video_desc).map((text, index) => (\n \n
\n \n ));\n\n const CollapseSection = () => (\n
\n
\n )}{\" \"}\n {video.platform === \"Youtube\" && video.video_url && (\n \n {/* {video.platform === 'Dropbox' ? (\n
\n \n
\n \n \n \n
\n {videoDetail()}\n \n \n \n {video.title}\n {getFilterTitle}\n \n
\n \n {\" \"}\n {video.author}\n
\n \n \n
\n \n
\n \n
\n Transcript:
\n\n {search && video?.transcription_text && expandTranscript()}\n
\n \n {search && video?.transcription_text ? (\n getFilterSearch && getFilterSearch?.length > 0 ? (\n getFilterSearch\n ) : (\n getSearchFromDecription\n )\n ) : (\n
\n )}\n \n Transcripts are generated for videos with speech in\n English.\n
\n )}\n\n <>\n {videos.map(({ video }) => (\n x.video_id === video._id) || {}}\n key={video._id}\n video={video}\n note={find(notes, video._id, \"video_id\")}\n search={search}\n handlePlayVideoSentence={handlePlayVideoSentence}\n toggleTranscript={toggleTranscript}\n keywordsSwitch={keywordsOnly}\n />\n ))}\n
\n );\n};\n\nTranscriptIndex.defaultProps = {\n videos: [],\n notes: [],\n videoProducts: {},\n transcript: [],\n};\n\nTranscriptIndex.propTypes = {\n videos: arrayOf(shape({})),\n transcript: arrayOf(shape({})),\n search: string.isRequired,\n loading: bool.isRequired,\n notes: arrayOf(shape({})),\n videoProducts: shape({}),\n fetchVideoProducts: func.isRequired,\n};\n\nexport default TranscriptIndex;\n","import React from \"react\";\nimport { Sliders } from \"react-feather\";\nimport { Row, Col, Progress, Modal, ModalBody } from \"reactstrap\";\n\nconst LinearProgressWithLabel = () => (\n \n We are rating and ranking your videos now based on your selection\n
\n \n\n
\n {filtersOpen && (\n \n \n {transcriptView && (\n <>\n {loading ? (\n
\n \n {!loading && totalPages > 1 && (\n this.updateParams(param)()}\n cardType=\"Video\"\n />\n )}\n
\n Filters
\n \n {value?.includes(\"Campaign-\") ? (\n
\n \n ))}\n \n \n \n );\n};\n\nexport default HorizontalFilters;\n","import { useState } from \"react\";\nimport { Download } from \"react-feather\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport {\n Button,\n ButtonDropdown,\n DropdownItem,\n DropdownMenu,\n DropdownToggle,\n Spinner,\n} from \"reactstrap\";\n\nimport JSZip from \"jszip\";\nimport {\n handleDownloadVideo,\n updateVideoPageState,\n} from \"../Pages/Video/VideoActions\";\nimport {\n downloadAndPrepareVideos,\n getDirectory,\n getVideoUrls,\n getVideoUrlsById,\n} from \"../utilities\";\n\nconst MultipleVideoDownloadDropdown = ({\n transcriptDownloadHandle,\n loadingTranscriptPdf,\n}) => {\n const [videoDownloading, setVideoDownloading] = useState(false);\n const videos = useSelector((state) => state.videos);\n\n const [campaignDropdown, setCampaignDropdown] = useState(false);\n const [showTranscriptSubmenu, setShowTranscriptSubmenu] = useState(false);\n const [showVideoSubmenu, setShowVideoSubmenu] = useState(false);\n const downloadVideosCheckList = useSelector(\n (state) => state.videoPageStates.downloadVideosCheckList\n );\n const dispatch = useDispatch();\n\n const toggleDropdown = () => {\n setCampaignDropdown(!campaignDropdown);\n if (!campaignDropdown) {\n setShowTranscriptSubmenu(false);\n setShowVideoSubmenu(false);\n }\n };\n\n async function saveFile(directoryHandle, fileName, blob) {\n try {\n const fileHandle = await directoryHandle.getFileHandle(fileName, {\n create: true,\n });\n const writable = await fileHandle.createWritable();\n await writable.write(blob);\n await writable.close();\n // dispatch(\n // updateVideoPageState({\n // downloadVideoChecks: false,\n // downloadVideosCheckList: [],\n // })\n // );\n } catch (error) {\n console.error(\"Error in saving file:\", error);\n alert(\n \"Failed to save file. Please ensure you have permission to save in this location.\"\n );\n }\n }\n\n const handleDownloadVideos = async (\n getVideoUrlsFunc,\n additionalArgs = []\n ) => {\n const directoryHandle = await getDirectory();\n if (!directoryHandle) {\n setVideoDownloading(false);\n return;\n }\n\n // Invoke the passed function to get the video URLs\n const videoUrls = getVideoUrlsFunc(...additionalArgs);\n const zip = new JSZip();\n\n try {\n setVideoDownloading(true);\n const preparedZip = await downloadAndPrepareVideos(videoUrls, zip);\n const zipBlob = await preparedZip.generateAsync({ type: \"blob\" });\n await saveFile(directoryHandle, \"Campaign videos.zip\", zipBlob);\n } catch (error) {\n console.error(\"Error in downloading videos:\", error);\n alert(`Error downloading videos: ${error.message}`);\n } finally {\n setVideoDownloading(false);\n dispatch(\n updateVideoPageState({\n downloadVideoChecks: false,\n downloadVideosCheckList: [],\n })\n );\n }\n };\n\n // To download all videos\n const handleDownloadAllVideos = () => {\n handleDownloadVideos(getVideoUrls, [videos]);\n };\n\n // To download selected videos based on a checklist\n const handleDownloadSelectedVideos = () => {\n handleDownloadVideos(getVideoUrlsById, [videos, downloadVideosCheckList]);\n };\n\n return (\n <>\n \n {findObjectById(campaigns, value?.split(\"-\")[1])?.name}\n
\n ) : (\n \n {filterValues[value] ||\n isoCountries[value] ||\n platformName[value] ||\n getCompanyNameIfTryAndBuy(value)}\n
\n )}\n \n
\n \n
\n \n {loadingTranscriptPdf || videoDownloading ? (\n
\n\n \n {videoDownloading ? \"Downloading\" : \"Download\"}\n
\n \n {showTranscriptSubmenu && (\n \n transcriptDownloadHandle(\"txt\")}>\n txt\n \n transcriptDownloadHandle(\"pdf\")}>\n pdf\n \n \n )}\n\n {showVideoSubmenu && (\n \n handleDownloadAllVideos()}>\n All Video\n \n {\n dispatch(\n updateVideoPageState({\n downloadVideoChecks: true,\n downloadVideosCheckList: [],\n })\n );\n }}\n >\n Select Video\n \n \n )}\n
\n \n {downloadVideosCheckList.length > 0 && (\n \n {\n dispatch(\n updateVideoPageState({\n downloadVideoChecks: false,\n downloadVideosCheckList: [],\n })\n );\n }}\n />\n
\n \n )}\n \n );\n};\n\nexport default MultipleVideoDownloadDropdown;\n","import { Modal } from \"reactstrap\";\nimport { updateCampaignState } from \"../../VideoActions\";\nimport crossIcon from \"@src/assets/images/vyrill/icons/cross_icon.png\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport PerfectScrollbar from \"react-perfect-scrollbar\";\nimport moment from \"moment\";\nimport {\n rewardIcon,\n calenderIcon,\n timeIcon,\n timeLimiIcon,\n copyIcon,\n qrCodeIcon,\n} from \"../../../../Shared/SVGs/Shared\";\nimport { useState } from \"react\";\nimport {\n updateCampaignFields,\n updateCampaignState as updateCreateCampaignState,\n} from \"../../../CreateCampaign/CampaignActions\";\nimport { useNavigate } from \"react-router-dom\";\nimport QrCodeModal from \"./QrCodeModal\";\n\nconst ShowCampaignDetal = () => {\n const [copied, setCopied] = useState(false);\n const [open, setOpen] = useState(false);\n const handleOpenQr = () => {\n setOpen(true);\n };\n const handleCloseQr = () => {\n setOpen(false);\n };\n const dispatch = useDispatch();\n const showCampaignDetail = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignDetail\n );\n\n const videoData = useSelector(\n (state) => state.videoData.campaign_details_list\n );\n const campaignData = videoData?.campaign_details;\n\n const campaignUrl = `${process.env.REACT_APP_CAMPAGIN_URL}/form/${campaignData?._id}/landing`;\n const handleCopyClick = () => {\n setCopied(!copied);\n navigator.clipboard.writeText(campaignUrl);\n setTimeout(() => {\n setCopied(false);\n }, 500);\n };\n const navigate = useNavigate();\n const handleQrClick = (campaignId) => {\n const queryParams = new URLSearchParams();\n queryParams.append(\"id\", campaignId);\n navigate(\"/create_campaign?\" + queryParams.toString());\n dispatch(updateCreateCampaignState({ activeStep: 5 }));\n dispatch(\n updateCampaignState({ showCampaignStep: true, showCampaignDetail: false })\n );\n \n dispatch(\n updateCampaignFields({\n banner_share_url: \"\",\n banner_with_qr: \"\",\n })\n );\n };\n\n const headline = (\n <>\n {campaignData?.name}
\n \n );\n const hashtags = (\n <>\n {campaignData?.hash_tag}
\n \n );\n\n const productimage = (\n <>\n \n
\n \n );\n\n const discriptions = (\n <>\n \n {campaignData?.reward_type === \"Cash\" && \"$\"}\n {campaignData?.reward_type !== \"Other\" && campaignData?.reward}\n {campaignData?.reward_type === \"Discount\" && \"%\"}\n
\n \n );\n const rewardOther = (\n <>\n \n {campaignData?.reward_type === \"Other\" && (\n
\n \n );\n\n const videoDataattedDate = moment(campaignData?.end_date).format(\n \"YYYY-MM-DD\"\n );\n const EndDate = (\n <>\n {campaignData?.reward}
\n )}\n \n {campaignData?.ongoing ? \"Ongoing\" : videoDataattedDate}\n
\n \n );\n const formattedEndTime = moment(campaignData?.end_date).format(\"hh:mm a\");\n\n const Time = (\n <>\n \n
\n {timeIcon}
\n Time
\n {formattedEndTime}
\n \n );\n\n const campaignVideoLength = (\n <>\n \n
\n {timeLimiIcon}
\n Video Length
\n {campaignData?.video_time_limit}
\n \n );\n\n return (\n \n {\n if (campaignData?.generate_qr === \"Generated\") {\n handleQrClick(campaignData?._id);\n } else {\n handleOpenQr();\n }\n }}\n role=\"button\"\n style={{\n marginLeft: \"25px\",\n marginTop: \"25px\",\n color: \"#783AD0\",\n fontSize: \"18px\",\n }}\n >\n {qrCodeIcon} {\"QR Code\"}\n
\n \n \n \n \n );\n};\n\nexport default ShowCampaignDetal;\n","import { isEmpty } from \"lodash\";\nimport { Download } from \"react-feather\";\nimport React, { useEffect, useState } from \"react\";\nimport {\n Button,\n Spinner,\n ButtonDropdown,\n DropdownToggle,\n DropdownMenu,\n DropdownItem,\n} from \"reactstrap\";\nimport { useLocation } from \"react-router-dom\";\nimport { useSelector, useDispatch } from \"react-redux\";\n\nimport Search from \"../../../Shared/Search\";\nimport {\n setAddCompetitorVideo,\n toggleAllTranscript,\n updateCampaignState,\n updateParams,\n updateVideoPageState,\n} from \"../VideoActions\";\nimport { usePrevious } from \"../../../Shared/CustomHooks\";\nimport { AddVideosBtn } from \"../../../Shared/Components/HeaderButtons\";\nimport MultipleVideoDownloadDropdown from \"../../../Shared/MultipleVideoDownloadDropdown\";\nimport CampaignHeader from \"./Campaign/CampaignHeader\";\nimport ShowCampaignDetal from \"./Campaign/ShowCampaignDetal\";\n\nconst Tab = ({ tab, selected, dispatch }) => (\n \n \n \n\n
\n \n
\n {discriptions}\n\n \n
\n {/* head line */}\n {headline}\n {/* hashtags */}\n {hashtags}\n {/* product image */}\n {productimage}\n\n {/* discription */}\n \n {campaignData?.reward !== \"\" && (\n <>\n \n {campaignData?.end_time !== \"\" && Time}\n
\n \n
\n {rewardOther}\n \n )}\n\n \n
\n {Reward}\n {\" \"}\n {rewardIcon}
\n Reward
\n \n
\n\n \n
\n {EndDate}\n {calenderIcon}
\n End Date
\n \n {campaignData?.video_time_limit !== \"\"\n ? campaignVideoLength\n : null}\n
\n Terms and Conditions
\n {termAndCondition}\n\n\n
\n \n \n Upload Video\n \n
\n \n \n {copyIcon} {copied ? \"Copied\" : \"Copy Link\"}\n
\n \n
\n \n);\n\nconst VideoPageHeader = ({\n search,\n setSearch,\n downloadHandle,\n uploadVideoDetails,\n setLimitReachedModal,\n setUploadVideoModal,\n setOpenMultiPublish,\n tabs,\n count,\n cardType,\n}) => {\n const [openDownloadInfo, setOpenDownloadInfo] = useState(false);\n const [downloadDropdown, setDownloadDropdown] = useState(false);\n const [campaignDropdown, setCampaignDropdown] = useState(false);\n const [showPublish, setShowPublish] = useState(false);\n const [showSubmenu, setShowSubmenu] = useState(false);\n const isAppManagerCategoryPage = useSelector(\n (state) => state.PublishedPageStates.isCategoryPage\n );\n const dispatch = useDispatch();\n\n const videoTab = useSelector((state) => state.videoParams.tab);\n const isFavoriteTab = useSelector((state) => state.videoParams.isFavoriteTab);\n const isFlaggedTab = useSelector((state) => state.videoParams.isFlaggedTab);\n const isTrashTab = useSelector((state) => state.videoParams.isTrashTab);\n const selectedBrand = useSelector(\n (state) => state.selectedBrandReducer.brand_id\n );\n const toggleTranscript = useSelector((state) => state.toggleTranscript);\n\n const transcriptView = useSelector((state) => state.videoData.transcriptView);\n const videoData = useSelector((state) => state.videoData);\n const roles = useSelector((state) => state.navbarStatsReducer.roles);\n const pro = useSelector(\n (state) => state.navbarStatsReducer.current_user.is_subscribed_to_vip\n );\n const loadingTranscriptPdf = useSelector(\n (state) => state.downloadTranscript.loadingTranscriptPdf\n );\n\n const isCategoryPage = useSelector(\n (state) => state.videoPageStates.isCategoryPage\n );\n\n const flaggedChecks = useSelector(\n (state) => state.videoPageStates.flaggedChecks\n );\n const favoriteChecks = useSelector(\n (state) => state.videoPageStates.favoriteChecks\n );\n const deleteChecks = useSelector(\n (state) => state.videoPageStates.deleteChecks\n );\n const restoreChecks = useSelector(\n (state) => state.videoPageStates.restoreChecks\n );\n const restoreVideosCheckList = useSelector(\n (state) => state.videoPageStates.restoreVideosCheckList\n );\n const flaggedVideosCheckList = useSelector(\n (state) => state.videoPageStates.flaggedVideosCheckList\n );\n const deleteVideosCheckList = useSelector(\n (state) => state.videoPageStates.deleteVideosCheckList\n );\n\n const favVideosCheckList = useSelector(\n (state) => state.videoPageStates.favVideosCheckList\n );\n\n const publishSelectAll = useSelector(\n (state) => state.videoPageStates.publishSelectAll\n );\n\n const publishVideosCheckList = useSelector(\n (state) => state.videoPageStates.publishVideosCheckList\n );\n\n const showCampaignHeader = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignHeader\n );\n // const isCampaignTab = videoTab === \"Campaigns\";\n const isCampaignTab = useSelector((state) => state.videoParams.isCampaignTab);\n\n //ispublished\n const videos = useSelector((state) => state.videos);\n const video = videos?.map((data) => data?.video);\n const publishedData = video?.map(\n (data) => data?.additional_data?.data?.published_to_swirl\n );\n const isPublishedSwirlArray = Array.isArray(publishedData);\n const isPublished =\n isPublishedSwirlArray &&\n publishedData.every(\n (status) => status === \"Successfully updated published status\"\n );\n\n const prevVideoTab = usePrevious(videoTab);\n // Reuse video for App-Manager\n const location = useLocation();\n const isAppManager = location.pathname === \"/published\";\n\n // Function to create breadcrumb\n\n const submitSearch = () => {\n if (search || (!search && transcriptView)) {\n dispatch(updateParams({ search, page: 1 }));\n }\n };\n\n const updateSearch = ({ target }) => setSearch(target.value);\n\n // on pressing Enter submit search\n const onKeyUp = ({ keyCode }) => {\n if (keyCode === 13) submitSearch();\n };\n\n const clearSearch = () => {\n setSearch(\"\");\n if (transcriptView) {\n dispatch(updateParams({ search: \"\" }));\n }\n };\n\n useEffect(() => {\n if (!isFlaggedTab || selectedBrand) {\n // Reset for prev tab=flagged and checks enable OR brand change\n dispatch(\n updateVideoPageState({\n flaggedChecks: false,\n favoriteChecks: false,\n flaggedVideosCheckList: [],\n flagSelectAll: false,\n confirmUnflag: false,\n downloadVideoChecks: false,\n publishVideoChecks: false,\n })\n );\n }\n }, [isFlaggedTab, selectedBrand, videoTab]);\n\n useEffect(() => {\n //Flagged folder, switching tab\n if (videoTab !== prevVideoTab || isCategoryPage) {\n dispatch(\n updateVideoPageState({\n flagSelectAll: false,\n flaggedVideosCheckList: [],\n flaggedChecks: false,\n })\n );\n }\n }, [videoTab, isCategoryPage]);\n\n const showAllTranscript = () => {\n dispatch(toggleAllTranscript(!toggleTranscript));\n };\n\n const basic = roles?.includes(\"vip_brand_manager\") && !pro;\n\n const toggleDropdown = () => setDownloadDropdown(!downloadDropdown);\n\n const toggleCampaignDropdown = () => {\n setCampaignDropdown(!campaignDropdown);\n if (!campaignDropdown) {\n setShowSubmenu(false);\n }\n };\n\n const toggleSubmenu = () => {\n setShowSubmenu(true);\n };\n const toggleSubmenuClose = () => {\n setShowSubmenu(false);\n };\n\n const AddVideos = (\n \n {tab.includes(\"Competition\")\n ? \"Competitors\"\n : tab.includes(\"fan\")\n ? \"shopper\"\n : tab}{\" \"}\n
\n {selected && }\n \n
\n Add Video
\n \n );\n const handleCancelClick = (event) => {\n event.stopPropagation();\n setShowPublish(false);\n dispatch(\n updateVideoPageState({\n publishVideoChecks: false,\n publishVideosCheckList: [],\n publishSelectAll: false,\n })\n );\n };\n\n const handlePublishClick = () => {\n setShowPublish(true);\n dispatch(\n updateVideoPageState({\n publishVideoChecks: true,\n publishVideosCheckList: [],\n publishSelectAll: false,\n })\n );\n };\n\n const handlePublishModal = () => {\n if (showPublish && publishVideosCheckList?.length !== 0) {\n setShowPublish(false);\n dispatch(\n updateVideoPageState({\n openSinglePublish: true,\n publishVideoChecks: false,\n })\n );\n }\n };\n\n const handlePublishSelect = () => {\n // Filter out unpublished videos\n const unpublishedVideos = videos?.filter((data) => {\n const publishStatus = data?.additional_data?.data?.published_to_swirl;\n return publishStatus !== \"Successfully updated published status\";\n });\n\n dispatch(\n updateVideoPageState({\n publishSelectAll: true,\n publishVideosCheckList: [unpublishedVideos],\n })\n );\n };\n\n const handlePublishUnSelect = () => {\n dispatch(\n updateVideoPageState({\n publishSelectAll: false,\n })\n );\n };\n\n const SelectAll = (\n Unselect All
\n ) : (\n Select All
\n )}\n \n );\n\n const publishButton = (\n \n \n {isPublished ? (\n
\n );\n\n const PublishVideos = (\n \n {!showPublish && (\n <>\n {isPublished ? (\n
\n \n {!showPublish && (\n <> {isPublished ? \"Unpublish Videos\" : \"Publish Videos\"}\n )}\n
\n {showPublish && (\n \n //
\n // Show Campaign Detail
\n // \n // );\n\n const AddCompetitorVideosBtn = (\n \n
\n\n \n Video \n
\n \n \n Transcript\n \n
\n \n {showSubmenu && (\n \n \n )}\n
\n \n );\n\n const videoContent = (\n <>\n \n txt \n pdf \n
\n \n
\n\n \n
\n \n );\n\n const flaggedTabContent = (\n <>\n \n {/* {!transcriptView &&\n videoTab !== \"Competition\" && */}\n {/* {!showCampaignHeader && videoTab === \"Campaigns\" && showCampaignBtn} */}\n {videoTab !== \"Campaigns\" &&\n videoTab !== \"Competition\" &&\n !showPublish &&\n AddVideos}\n {showPublish && SelectAll}\n {videoTab !== \"Competition\" && videos?.length > 0 && PublishVideos}\n {showPublish && publishButton}\n {videoTab === \"Competition\" && AddCompetitorVideosBtn}\n {/* {videoTab !== \"Competition\" && (\n setOpenMultiPublish(true)}\n >\n Publish to App\n \n )} */}\n {/* {console.log(videoTab === \"Campaigns\")} */}\n {/* {videoTab === \"Campaigns\" && downloadDropdownList} */}\n {openDownloadInfo && (\n setOpenDownloadInfo(true)}\n onMouseOut={() => setOpenDownloadInfo(false)}\n >\n {loadingTranscriptPdf ? (\n \n \n \n {[\"txt\", \"pdf\"].map((i) => (\n downloadHandle(i)} key={i}>\n {i}\n \n ))}\n \n \n )}\n \n )}\n {videoTab === \"Campaigns\" && videos?.length > 0 && !showPublish && (\n
\n \n Download all transcripts\n
\n )}\n {videoTab !== \"Campaigns\" && !showPublish && (\n \n
\n )}\n \n \n {tabs.map((tab) => (\n
\n \n {flaggedChecks ? (\n <>\n {flaggedVideosCheckList.length > 0 ? (\n {\n dispatch(updateVideoPageState({ confirmUnflag: true }));\n }}\n >\n Unflag\n \n ) : (\n {\n dispatch(updateVideoPageState({ flagSelectAll: true }));\n }}\n >\n {\"Select All\"}\n \n )}\n \n ) : (\n {\n dispatch(updateVideoPageState({ flaggedChecks: true }));\n }}\n >\n {\"Select\"}\n \n )}\n
\n \n );\n\n const favoriteTabContent = (\n <>\n \n \n {tabs.map((tab) => (\n
\n \n {isFavoriteTab && (\n <>\n {favoriteChecks ? (\n <>\n {favVideosCheckList.length > 0 ? (\n {\n dispatch(updateVideoPageState({ confirmUnfav: true }));\n }}\n >\n Unfavorite Videos\n \n ) : (\n {\n dispatch(updateVideoPageState({ favSelectAll: true }));\n }}\n >\n Select All\n \n )}\n \n ) : (\n {\n dispatch(\n updateVideoPageState({\n favoriteChecks: true,\n favVideosCheckList: [],\n })\n );\n }}\n >\n Select\n \n )}\n \n )}\n
\n \n );\n\n const cancelButton = (\n \n \n {tabs.map((tab) => (\n
\n \n {!restoreChecks && deleteChecks && (\n {\n dispatch(updateVideoPageState({ confirmDelete: true }));\n }}\n >\n Delete Permanently\n \n )}\n {!restoreChecks && !deleteChecks && (\n {\n dispatch(\n updateVideoPageState({\n deleteChecks: true,\n restoreChecks: false,\n deleteVideosCheckList: [],\n restoreVideosCheckList: [],\n })\n );\n }}\n >\n Delete\n \n )}\n {!deleteChecks && (\n \n Restore\n \n )}\n\n {(deleteChecks || restoreChecks) && cancelButton}\n
\n \n );\n\n const renderSections = () => {\n if (isFlaggedTab && !isAppManager) {\n return flaggedTabContent;\n }\n if (isFavoriteTab && !isAppManager) {\n return favoriteTabContent;\n }\n if (isTrashTab && !isAppManager) {\n return trashTabContent;\n }\n if (isAppManager) {\n return appManagerContent;\n } else return videoContent;\n };\n\n // Render add btn for category page\n if (isCategoryPage && !isAppManager) {\n return null;\n }\n\n return (\n <>\n {renderSections()}
\n {transcriptView && !videoData.loading && (\n {downloadTrancriptBtn}
\n \n )}\n \n
\n )} */}\n \n );\n};\n\nexport default VideoPageHeader;\n","import React, { useEffect, useRef } from \"react\";\nimport { Link, useLocation } from \"react-router-dom\";\nimport PropTypes from \"prop-types\";\nimport PerfectScrollbar from \"react-perfect-scrollbar\";\nimport { Eye, ThumbsUp, MessageSquare, ThumbsDown } from \"react-feather\";\nimport {\n ListGroup,\n ListGroupItem,\n FormGroup,\n Label,\n Input,\n Row,\n Col,\n} from \"reactstrap\";\n\nimport Loader from \"../../../Shared/Loader\";\nimport DropboxPlayer from \"../../../Shared/DropboxPlayer\";\nimport { addDefaultSrc, abbreviateNumber } from \"../../../utilities\";\nimport GenerateTiktokThumbnail from \"../../../Shared/GenerateTiktokThumbnail\";\nimport useIntersectionObserver from \"../../../Shared/Hooks/useIntersectionObserver\";\n\nconst renderProducts = (products) => {\n if (products?.length > 0) {\n return products.map(({ _id, name }, index) => (\n \n
\n )}\n {video.platform === \"Youtube\" && video.thumbnail_url && (\n \n addDefaultSrc(e)}\n width=\"auto\"\n height={165}\n />\n
\n )}\n {video.platform === \"Tiktok\" && video.thumbnail_url && (\n \n
\n \n \n Title:{\" \"}\n \n {video.title}\n \n
\n \n Creator:{\" \"}\n \n {video.author}\n \n
\n \n Product(s): {renderProducts(products)}\n
\n \n
\n \n \n
\n \n {loading &&
\n \n {isPublish ?
\n);\n\nconst SelectTab = ({\n checkedAllVideos,\n totalVideoCount,\n selectedVideos,\n tabType,\n handleTabType,\n}) => (\n 🎉
:📢
}\n\n {isPublish ? (\n \n Your video(s) have been published to the{\" \"}\n {tabType === \"fan\" ? \"shopper\" : tabType} tab\n \n ) : (\n Your video(s) have been unpublished\n )}\n
\n\n
\n
\n
\n
\n);\n\nconst VideoSubtitle = ({\n selectedVideos,\n checkedAllVideos,\n handleToggleSelectAll,\n}) => (\n <>\n \n \n You selected{\" \"}\n \n {checkedAllVideos\n ? totalVideoCount\n : selectedVideos && selectedVideos.length}\n {\" \"}\n videos\n \n
\n\n
\n
\n \n
\n Where would you like them?\n
\n\n
\n \n {\" \"}\n Shopper video tab\n \n\n \n
\n \n
\n
\n
\n )}\n {step === 3 &&\n (loadingPublish ? (\n \n \n You selected{\" \"}\n \n {checkedAllVideos\n ? totalVideoCount\n : selectedVideos && selectedVideos.length}\n {\" \"}\n videos\n \n
\n\n
\n
\n \n
\n Are you sure you want to unpublish?\n
\n\n
\n ) : (\n \n \n \n \n \n \n
\n );\n};\n","import { useState, useEffect } from \"react\";\nimport \"./Tooltip.css\";\nconst Tooltip = ({ text, children, id }) => {\n const [showTooltip, setShowTooltip] = useState(false);\n\n useEffect(() => {\n const handleMouseEnter = (e) => {\n const target = e.target;\n const rect = target.getBoundingClientRect();\n\n setShowTooltip(true);\n };\n\n const handleMouseLeave = () => {\n setShowTooltip(false);\n };\n\n const target = document.getElementById(`tooltip-target-${id}`);\n if (target) {\n target.addEventListener(\"mouseenter\", handleMouseEnter);\n target.addEventListener(\"mouseleave\", handleMouseLeave);\n }\n\n return () => {\n if (target) {\n target.removeEventListener(\"mouseenter\", handleMouseEnter);\n target.removeEventListener(\"mouseleave\", handleMouseLeave);\n }\n };\n }, []);\n\n return (\n \n {showTooltip &&
\n );\n};\n\nexport default Tooltip;\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAANCAYAAAB/9ZQ7AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACfSURBVHgBzdE9EoIwEAXgt5kUlt5APAKdWOmJbNOJHZ1H8ChOGscOjsARLC0YlgQmDD9hgI5XJTvf7E42pKLsDcIFUyn5mHzD3B5lDQVfUSD3WQcbbOOgoPsQq3PmJmjZVgkxGAcQa8+AvWn0kr2SgcknjEfdT2kAgZvAimwH8+O/w28Jlu71KkrncffCZp/1msYJepgA81X0tPuEN6wr14kqtzMebvcAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAARCAYAAADZsVyDAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGXSURBVHgB1ZNBTgJBEEV/Na3RlRxhvIHeQG6gJ3DcGTRx0A0SE4fEoAvFXghxp55AboA30Bs4R3BlDDBV1gyCkIig4MKXTE9Np+f3r+pqygelFTJoAshiBohIBOlsWCK5B2gmoglE5IHmmhZJkG5FDyRU7sBG+AXWdjyO+YYInn5m7edWsib6GH4L6+6sPKlgEATZFhb2hE2gov3MTX+FyJ2OERkT5guHz/mg6I8T3Q6Ka21afEz+UWcQoNH3ubNfkjRgk7PoRG2iUMuzme4F3DJz+dqdRcMui17LmEsC1nvr5vm18GYXVjJsmsOOFacCtctTXxirqXvAzxjzqO6Pe2uSuK1zqajgSd3m6tXKlnPuZVDLfpVi3VWe9LW8u18KBbT3UR6f0tTI00FFuKAmHEZg8A1X1Uo4x/FqUv9uG5GX1DHWuVp1tOhIx4O4bn393YOjhp7PS+385AETMFa4x9XFSQM/wOCP+H/C/RqzYU9vkocpmI8zSzFJTzjpSclqj97oZcA0xOiK6hgZYclpHGFmqFHGxjvWpZh7o8vjGAAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAARCAYAAADdRIy+AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADWSURBVHgB7dNLDoIwEAbgmUb3HAVvgMcRWVSiCeLCsmGJLvA8HMErcAPZG1tnjERDeDQRd/wJSVPoV9KZAlhkHcaGH5tvBYycCfwTuAr30pc7t2uRL2PXl9HRCgy2kScATyjmRRvKGAooUAgVyMhrvse2XYIwVtR0/AeV0fcl4VeeNxoWjNHQQQ1Jfk6VFdhEGXhPV33YC6xvwCVLsQf9LOjAaqe3ynmWKtolGcK+M9g2NWqDcWZgEUbBMqM3NhXlcKOGcGCEUFVKYfRjQ+MSfg5WQOf8BK4lVEg8XlvSAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAAXNSR0IArs4c6QAAAIRJREFUKBWdkVENgDAMRE8CEpCAIyzgABwgAZyAAyQgAQmQF9qEBQgrl+xn7b32NimuVlIdtWHaJU0RY2OmVVKZa6z+mKBvdrIn0chq5GJqIgIvkork9szhJvLd1BlxuFSAAGMS9VeN1tRbB5BPk9N8An+ECViWWM8zAQmJV5wfHuoGOQALHiBx7nOlMQAAAABJRU5ErkJggg==\"","import React from \"react\";\nimport ReactPaginate from \"react-paginate\";\nimport { useSelector } from \"react-redux\";\nimport \"./Pagination.scss\";\n\nconst Pagination = ({ cardType, update }) => {\n const productData = useSelector((state) => state.productData);\n const videoData = useSelector((state) => state.videoData);\n const productParams = useSelector((state) => state.productParams);\n const videoParams = useSelector((state) => state.videoParams);\n\n const getActiveData = {\n Product: productData,\n Video: videoData,\n };\n\n const getActiveParams = {\n Product: productParams,\n Video: videoParams,\n };\n\n if (getActiveData[cardType].totalPages > 1)\n return (\n {text}
}\n {children}\n \n update({ page: page.selected + 1 })}\n pageCount={getActiveData[cardType].totalPages}\n pageClassName={\"item pagination-page \"}\n pageRangeDisplayed={2}\n previousClassName={\"item previous\"}\n previousLabel={\n
\n );\n else return null;\n};\n\nexport default Pagination;\n","export default __webpack_public_path__ + \"static/media/brand-icon.26924c1b.svg\";","export default __webpack_public_path__ + \"static/media/brand-safety-icon.dabf7b98.svg\";","export default __webpack_public_path__ + \"static/media/campaign.8f941a82.svg\";","export default __webpack_public_path__ + \"static/media/contract-icon.9f2cc066.svg\";","export default __webpack_public_path__ + \"static/media/FlaggedVideos.b10b41e5.jpg\";","export default __webpack_public_path__ + \"static/media/all.648d8f11.jpg\";","export default __webpack_public_path__ + \"static/media/custom-card.f52bbb8e.jpg\";","export default __webpack_public_path__ + \"static/media/demographic-card.fd72dce6.jpg\";","export default __webpack_public_path__ + \"static/media/engagement-card.2e55142c.jpg\";","export default __webpack_public_path__ + \"static/media/sentiment-card-edit.995d510b.jpg\";","export default __webpack_public_path__ + \"static/media/speech-card.766af157.jpg\";","import { useDispatch, useSelector } from \"react-redux\";\nimport { updateCampaignState } from \"../../VideoActions\";\nimport { useNavigate } from \"react-router-dom\";\nimport {\n updateCampaignFields,\n updateCampaignState as updateCreateCampaignState,\n} from \"../../../CreateCampaign/CampaignActions\";\n\nconst CampaignHeader = () => {\n const videoData = useSelector(\n (state) => state.videoData.campaign_details_list\n );\n const campaignData = videoData?.campaign_details;\n const campaignProduct = campaignData?.products?.map(\n (product) => product?.name\n );\n const campaignBrand = campaignData?.manufacturer?.name;\n const dispatch = useDispatch();\n const navigate = useNavigate();\n const handleQrClick = (campaignId) => {\n if (campaignId) {\n const queryParams = new URLSearchParams();\n queryParams.append(\"id\", campaignId);\n navigate(\"/create_campaign?\" + queryParams.toString());\n dispatch(updateCreateCampaignState({ activeStep: 4 }));\n dispatch(updateCampaignState({ showCampaignStep: true }));\n }\n };\n\n return (\n \n
\n }\n nextLabel={\n \n Next \n
\n }\n forcePage={getActiveParams[cardType].page - 1}\n />\n \n handleQrClick(campaignData?._id)}\n >\n View Campaign\n
\n \n );\n};\nexport default CampaignHeader;\n","import { useSelector } from \"react-redux\";\nimport { useParams, useNavigate } from \"react-router-dom\";\nimport PropTypes from \"prop-types\";\nimport { useEffect, useState } from \"react\";\n\nimport { fetchIds } from \"../Pages/Video/VideoActions\";\n\nconst PreviousNextButtons = ({ type }) => {\n const [ids, setIds] = useState([]);\n const params = useParams();\n const navigate = useNavigate();\n const videoParams = useSelector((state) => state.videoParams);\n const influencerParams = useSelector((state) => state.influencerParams);\n const productParams = useSelector((state) => state.productParams);\n\n useEffect(() => {\n const filters = {\n video: videoParams,\n product: productParams,\n influencer: influencerParams,\n };\n fetchIds(filters[type], type)\n .then((response) => {\n if (response) {\n setIds([...response]);\n }\n })\n .catch((err) => {\n console.log(err);\n });\n }, []);\n\n const prevHandler = () => {\n const index = ids.findIndex((i) => i === params.id);\n if (index >= 0) {\n navigate(`/${type}s/${ids[index - 1]}`);\n }\n };\n\n const nextHandler = () => {\n const index = ids.findIndex((i) => i === params.id);\n if (index >= 0) {\n navigate(`/${type}s/${ids[index + 1]}`);\n }\n };\n\n const style = { color: \"#6E6B7A\", fontSize: \"18px\" };\n const idNotFound = !ids.includes(params.id);\n \n return (\n \n
\n \n
\n No. of Videos Collected
\n {videoData?.video_count || 0}
\n \n
\n\n \n
\n No. of Campaign Clicks
\n {campaignData?.clicks || 0}
\n \n
\n\n \n
\n Campaign Duration
\n \n {new Date(campaignData?.start_date).toLocaleDateString(\"en-US\", {\n month: \"short\",\n day: \"numeric\",\n })}{\" \"}\n -{\" \"}\n {campaignData?.ongoing\n ? \"Ongoing\"\n : new Date(campaignData?.end_date).toLocaleDateString(\"en-US\", {\n month: \"short\",\n day: \"numeric\",\n year: \"numeric\",\n })}\n
\n \n
\n \n
\n \n Campaign Type -{\" \"}\n {campaignProduct?.length === 0 ? \"Brand\" : \"Product\"}\n
\n \n {campaignProduct?.length === 0 ? campaignBrand : campaignProduct}\n
\n \n
\n \n
\n Overall Sentiment Score
\n \n {videoData?.overall_sentiment_score || 0}\n
\n \n \n
\n \n
\n \n
\n \n {publishUnPublishIcon(\n isPublished || allPublished ? \"unPublishedModal\" : \"publishedModal\"\n )}\n
\n \n {isPublished || allPublished ? \"Unpublish from\" : \"Publish to\"}\n
\n \n
\n \n {publishVideosCheckList.length !== 0 ? (\n <>{publishVideosCheckList.length} videos selected\n ) : (\n <>Video: {video && video?.title ? video?.title : \"No video title\"}\n )}\n
\n \n \n {isPublished || allPublished ? \"Unpublish\" : \"Publish\"}\n {loading && (\n
\n \n
\n \n
\n \n {publishUnPublishIcon(\n isPublished || allPublished ? \"unPublishedModal\" : \"publishedModal\"\n )}\n
\n \n {isPublished || allPublished ? \" Unpublished!\" : \"Published!\"}{\" \"}\n
\n \n {publishVideosCheckList.length !== 0 ? (\n
\n \n {publishVideosCheckList.length} videos{\" \"}\n {isPublished || allPublished\n ? \"are no more live on\"\n : \"are now live on\"}\n
\n ) : (\n <>Video: {video && video?.title ? video?.title : \"No video title\"}\n )}\n \n As there are too many sentences, the {formatNames[fileType]} will\n contain only a subset.\n
\n(You can still see them all on the dashboard)
\n \n\n
\n );\n};\n\nexport const TikTokThumbnail = ({ selectedImage, customStyles, imgStyles }) => {\n return (\n \n
\n \n
\n \n
\n );\n};\n","export default __webpack_public_path__ + \"static/media/shopify-logo.9852bc48.svg\";","import { InstagramEmbed } from \"react-social-media-embed\";\n\nconst InstagramEmbedd = ({ url }) => {\n return (\n \n
\n {showchecks && (\n \n {\" \"}\n
\n )}\n\n {!showchecks && productTrashTab && (\n \n
\n );\n};\n","import { capitalize } from \"../../../utilities\";\n\nconst ProductCardDetail = ({ item }) => {\n const textWithDots = {\n whiteSpace: \"nowrap\",\n textOverflow: \"ellipsis\",\n overflow: \"hidden\",\n };\n\n const itemName = item?.name || \"\";\n return (\n \n
\n e.stopPropagation()}>\n
\n \n \n {item?.is_hashtag && itemName.charAt(0) !== \"#\"\n ? `#${capitalize(itemName)}`\n : capitalize(itemName)}\n \n
\n );\n};\n\nexport default ProductCardDetail;\n","import moment from \"moment\";\nimport { v4 as uuidv4 } from \"uuid\";\nimport { useNavigate } from \"react-router-dom\";\n\nimport SponsorshipLabel from \"./SponsorshipLabel\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { VideoNote } from \"../../../Shared/Notes/Notes\";\nimport { updateParams } from \"../../Product/productActions\";\nimport Like from \"../../../assets/images/vyrill/products/Like.png\";\nimport Views from \"../../../assets/images/vyrill/products/Views.png\";\nimport Comments from \"../../../assets/images/vyrill/products/Comments.png\";\nimport {\n addDefaultSrc,\n capitalize as capitalizeString,\n abbreviateNumber,\n} from \"../../../utilities\";\n\nconst VideoCardDetail = ({ item, videoProducts, note }) => {\n const defaultCreator =\n require(\"@src/assets/images/vyrill/Creator_Profile_Avatar.png\").default;\n const navigate = useNavigate();\n const tab = useSelector((state) => state.videoParams.tab);\n const dispatch = useDispatch();\n\n const redirectTo = (url) => navigate(url);\n\n const linkName = (length, index, name) => {\n if (length === 1 && name.length < 17) {\n return name;\n }\n if (length === 1 && name.length > 17) {\n return `${name.substring(0, 20)}...`;\n }\n if (length > 1 && !index && name.length > 11) {\n return `${name.substring(0, 11)}...`;\n }\n return ` | ${name.substring(0, 11)}...`;\n };\n\n const productOrHashtag = (prods) => {\n const filteredProds = prods.filter((i) => i.name);\n return filteredProds.map((i, idx) => (\n \n
\n );\n\n const videoUploadDate = moment.utc(item?.created_at).format(\"ll\");\n\n const authorImage = (\n \n \n 
\n {abbreviateNumber(item.likes || 0)}\n
\n \n 
\n \n {abbreviateNumber(item.view_count || 0)}\n \n
\n \n 
\n \n {abbreviateNumber(item.comment_count || 0)}\n \n
\n \n
\n \n {item.author ||\n item.author_name_provided_by_brand_manager ||\n \"Creator\"}\n
\n\n
\n \n );\n};\n\nexport default VideoCardDetail;\n","import ProductCardDetail from \"../../Product/Components/ProductCardDetail\";\nimport VideoCardDetail from \"../../Video/Components/VideoCardDetail\";\n\nexport const DetailsSection = ({ cardType, item, videoProducts, note }) => {\n const renderDetails = () => {\n switch (cardType) {\n case \"Product\":\n return \n {authorImage}\n
\n \n \n
\n \n {item.title ? (\n capitalizeString(item.title)\n ) : (\n \n Add a title to this video for easy identification\n \n )}\n
\n\n {(videoProducts?.length && productOrHashtag(videoProducts)) ||\n \"Not assigned to a product\"}\n
\n {item.upload_method !== \"Vyrill_API\" && videoStats}\n{videoUploadDate}
\n e.stopPropagation()}>\n
\n \n // \n //
\n // );\n\n // useEffect(() => {\n // if (item && item.platform === \"Vyrill_AWS_S3\") {\n // const video = document.getElementById(`S3-${item._id}`);\n // video.addEventListener(\"loadedmetadata\", function () {\n // video.currentTime = 3;\n // });\n // }\n // }, [item._id]);\n\n // const youTubeThumbnail = (\n // // \n // //
\n // );\n\n const instagramThumbnail = (\n \n //
\n // // \n //
\n // // \n {/* Thumbnail as per the video platfrom */}\n {item.platform === \"Dropbox\" && item?.video_url && DropboxThumbnail}\n {/* {item.platform === \"Youtube\" && item?.thumbnail_url && youTubeThumbnail} */}\n {item.platform === \"Tiktok\" && item?.thumbnail_url && tiktokThumbnail}\n {item.platform === \"Instagram\" &&\n item?.thumbnail_url &&\n instagramThumbnail}\n {/* {item.platform === \"GoogleDrive\" && item?.thumbnail_url && DriveThumbnail}\n {item.platform === \"Vyrill_AWS_S3\" && item?.video_url && apiThumbnail} */}\n\n {(item.platform === \"GoogleDrive\" ||\n item.platform === \"AWS_S3_Swirl\" ||\n item.platform === \"Youtube\" ||\n item.platform === \"Vyrill_AWS_S3\") &&\n item?.thumbnail_url &&\n VideoThumbnail}\n\n {/* {item.platform === \"Vyrill_AWS_S3\" && item?.video_url && apiThumbnail} */}\n\n {/* Platfrom icons */}\n {campaignVideo ? (\n <>\n {\" \"}\n \n {platformIcon(item)}\n \n \n {item?.duration_in_seconds !== null &&\n secToHHMMSS(item?.duration_in_seconds)}\n {item?.duration_in_seconds === null &&\n secToHHMMSS(Number(item?.duration || \"0\"))}\n
\n {/* Analysis icons */}\n {noChecks && analysisIcon(item?.analysis_stage || \"pending\")}\n\n {/* Sentiment score */}\n {!(\n renderNoSpeechIcon(item?.audio_labels) === 0 ||\n renderNoSpeechIcon(item?.audio_labels) === null\n )\n ? sentimentScore(item?._id)\n : noSpeechIcon(item?._id)}\n\n {/* Publish icon */}\n {showPublishIcon && publishTag}\n\n {/* API icon for API videos */}\n {/* {showAPIIcon && !isCampaignTab && API} */}\n\n {/* icon for new added videos */}\n {/* {showNewIcon && New} */}\n {campaignVideo && (\n \n
\n );\n } else {\n return null;\n }\n};\n\nexport default FirstVideoAnalyzedStep2;\n","import { Card } from \"reactstrap\";\nimport { uniqueId } from \"lodash\";\nimport { useLocation, useNavigate } from \"react-router-dom\";\n\nimport { Header } from \"./Header\";\nimport { Footer } from \"./Footer\";\nimport { DetailsSection } from \"./DetailsSection\";\nimport { ThumbnailSection } from \"./ThumbnailSection\";\nimport \"../Styles/GridCard.scss\";\nimport FirstVideoAnalyzedStep2 from \"../../../Shared/Tutorials/FirstVideo/FirstVideoAnalyzedStep2\";\n\nconst GridCard = ({\n item,\n note,\n cardType,\n handleOpenSinglePublish,\n handleLinkClick,\n videoProducts,\n}) => {\n const navigate = useNavigate();\n const location = useLocation();\n\n const isAppManager = location.pathname === \"/published\";\n\n const redirectTo = (cardType, itemId) => {\n if (isAppManager) {\n navigate(`/published/${itemId}`);\n } else {\n navigate(`/${cardType.toLowerCase()}s/${itemId}`);\n }\n handleLinkClick();\n };\n\n const renderHeaders = () => {\n switch (cardType) {\n case \"Product\":\n return \n
\n \n
\n \n \n
\n \n Click the video card to explore in-depth video insights!\n
\n \n \n
\n );\n};\n\nexport default IndexPageGrid;\n","import { deleteIcon, videoIcon } from \"../../../../Shared/SVGs/Shared\";\nimport { calculateRemainingTime } from \"../../../../utilities\";\nconst getFormattedDateRange = (date) => {\n const isValidDate = (date) => !isNaN(new Date(date).getTime());\n const currentDate = isValidDate(date) ? new Date(date) : new Date();\n return currentDate.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n day: \"2-digit\",\n year: \"2-digit\",\n });\n};\n\nexport const ActiveCampgainFooter = ({ campaign, videoCount }) => {\n return (\n <>\n \n {getActiveData[cardType].loading ? loadSkeletons() : renderCard()}\n
\n \n \n
\n \n {videoIcon}{\" \"}\n \n {videoCount}\n \n
\n\n \n
\n\n \n {getFormattedDateRange(campaign?.start_date)} -{\" \"}\n {campaign?.ongoing\n ? \"Ongoing\"\n : getFormattedDateRange(campaign?.end_date)}\n
\n {/* {deleteIcon} */}
\n \n {calculateRemainingTime(campaign?.end_date)}\n
\n \n );\n};\n\nexport const PastCampgainFooter = ({ campaign, videoCount }) => {\n return (\n \n
\n );\n};\n\nexport const DraftCampgainFooter = () => {\n return (\n \n {videoIcon}{\" \"}\n {videoCount}\n
\n\n \n
\n\n \n {getFormattedDateRange(campaign?.start_date)} -{\" \"}\n {getFormattedDateRange(campaign?.end_date)}\n
\n {/* {deleteIcon} */}
\n \n
\n );\n};\n","import { Card, Button } from \"reactstrap\";\nimport { useNavigate } from \"react-router-dom\";\n\nconst NoCampaignCard = () => {\n const navigate = useNavigate();\n return (\n {/* {deleteIcon} */}
\n \n {\n navigate(\"/create_campaign\");\n }}\n >\n Create\n \n
\n \n Let’s build your first Video Campaign!\n
\n\n Save valuable time with our pre-built campaign template. Once\n published, your new campaign can be swiftly and effortlessly shared\n with your network.\n
\n{campaign?.name}
\n {tab === \"ACTIVE\" && (\n \n
\n\n {/* \n {/*Sidebar Filter Toggle */}\n {/* \n
\n ) : (\n \n
\n )}\n {/* Rendering in Grid Page */}\n {loading ? (\n \n
\n \n \n
\n )}\n \n {renderCard()}\n
\n \n \n
\n \n );\n};\nexport default CampaignListPage;\n","import React from \"react\";\nimport ReactSelect, { components } from \"react-select\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { updateCampaignSorting } from \"../../VideoActions\";\nconst selectedIcon =\n require(\"@src/assets/images/icons/selected-icon.png\").default;\n\nconst style = {\n control: (provided, state) => ({\n ...provided,\n boxShadow: null,\n borderColor: \"#783ad0\",\n backgroundColor: \"none\",\n cursor: \"pointer\",\n width: \"118px\",\n minHeight: \"24px\",\n maxHeight: \"24px\",\n \"&:hover\": {\n borderColor: \"#783ad0\",\n },\n }),\n\n valueContainer: (provided) => ({\n borderColor: \"#783ad0\",\n ...provided,\n fontSize: \"10px\",\n paddingLeft: \"2px\",\n marginTop: \"-2px\",\n }),\n\n option: (provided, { data, isDisabled, isFocused, isSelected }) => {\n return {\n ...provided,\n cursor: \"pointer\",\n color: isSelected ? \"black\" : \"black\",\n backgroundColor: \"white\",\n fontSize: \"10px\",\n padding:\"5px 12px\"\n };\n },\n dropdownIndicator: (provided, state) => ({\n ...provided,\n position: \"absolute\",\n right: \"-4px\",\n top: \"-5px\",\n width: \"30px\",\n height: \"24px\",\n }),\n menu: (provided) => ({\n ...provided,\n cursor: \"pointer\",\n width: \"118px\",\n color: \"black\",\n fontSize: \"10px\",\n padding: \"0px 7px\",\n border: \"1px solid #783AD0\",\n }),\n};\n\nconst CustomOption = (props) => {\n return (\n \n {tabs?.map((i: any, index: any) => (\n handleChangeTab(i?.value)}\n role=\"button\"\n className={`tab-item${i?.value === tab ? \"-active\" : \" \"}`}\n >\n {i.name}\n
\n ))}\n \n \n
\n \n )}\n {/* \n
\n \n
\n Sort by
\n \n
\n \n \n\n
\n */}\n \n );\n};\n\nexport default VideoHeaderNew;\n","import React from \"react\";\nimport YouTubePlayer from \"youtube-player\";\n\nclass YouTubeVideo extends React.Component {\n componentDidMount() {\n const { videoId, autoplay } = this.props;\n this.player = YouTubePlayer(\"player\", {\n videoId,\n playerVars: { autoplay },\n });\n }\n\n componentDidUpdate({ start, videoId, autoplay }) {\n if (videoId !== this.props.videoId) {\n this.player.loadVideoById(videoId);\n this.player.mute();\n }\n if (start || start === 0) {\n this.player.unMute();\n this.player.seekTo(start);\n this.player.playVideo();\n }\n if (autoplay !== this.props.autoplay && autoplay) {\n this.player.playVideo();\n }\n }\n\n componentDidUpdate() {\n const { autoplay } = this.props;\n if (autoplay) {\n this.player.playVideo();\n }\n }\n\n render() {\n return (\n \n
\n \n \n
\n \n \n
\n );\n }\n}\n\nexport default YouTubeVideo;","export const HistoryIcon = () =>{\n return(\n \n {isEdit.id === id ? (\n <>\n \n \n \n \n setIsEdit({\n id: \"\",\n value: \"\",\n })\n }\n />\n \n ) : (\n <>\n \n setIsEdit({\n id,\n value,\n })\n }\n />\n
\n );\n};\n\nexport default HistoryAction;\n","import ReactSelect from \"react-select\";\nimport { useEffect } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\n\nimport { CustomDropdownIndicator } from \"../../Home/components/CustomDropdownIndicator\";\nimport { updateAskVyrillState } from \"../Actions\";\nimport { getDateString } from \"../../../utilities\";\nimport { dateRangeDurations } from \"../../../constants\";\n\nconst style = {\n control: (provided, state) => ({\n ...provided,\n paddingLeft: \"2px\",\n paddingRight: \"25px\",\n position: \"reletive\",\n maxWidth: \"233px\",\n boxShadow: null,\n borderColor: \"#C4C4C4\",\n backgroundColor: \"#FAF9FF\",\n cursor: \"pointer\",\n minHeight: \"22px\",\n }),\n menu: (provided) => ({\n ...provided,\n backgroundColor: \"#FAF9FF\",\n marginTop: \"0px\",\n borderRadius: \"10px\",\n width: \"233px\",\n }),\n\n valueContainer: (provided) => ({\n ...provided,\n padding: \"0 5px\",\n }),\n\n option: (provided, { data, isDisabled, isFocused, isSelected }) => {\n return {\n ...provided,\n cursor: \"pointer\",\n color: isSelected ? \"#7237c6\" : \"black\",\n backgroundColor: \"#FAF9FF\",\n borderBottom: \"0.2px solid #C7C6C6\",\n };\n },\n dropdownIndicator: (provided, state) => ({\n ...provided,\n position: \"absolute\",\n right: \"2px\",\n top: \"3px\",\n }),\n};\nconst durations = {\n today: \"Today\",\n \"1d\": \"1 day\",\n \"1w\": \"1 week\",\n \"1m\": \"1 month\",\n \"3m\": \"3 month\",\n \"6m\": \"6 month\",\n ytd: \"YTD\",\n \"1y\": \"1 year\",\n all_dates: \"All Dates\",\n custom: \"Custom Date\",\n};\n\nconst generatePlatForm = (data) => {\n return data?.map((k) => ({\n value: k,\n label: (\n \n \n {durations[k]}\n
\n \n {getDateString(k)}\n
\n \n ),\n }));\n};\nconst AskVyrillDuration = ({ customStyles }) => {\n const askVyrillDuration = useSelector(\n (state) => state.askVyrill.askVyrillDuration\n );\n const dispatch = useDispatch();\n\n const handleChange = (selectedOption) => {\n dispatch(\n updateAskVyrillState({\n askVyrillDuration: selectedOption,\n })\n );\n };\n useEffect(() => {\n const defaultDuration = generatePlatForm([askVyrillDuration?.value])[0];\n handleChange(defaultDuration);\n }, []);\n\n return (\n \n onMonthSelect(month, e.target.value)}\n >\n {moment.months().map((label, value) => (\n \n ))}\n \n
\n \n onYearSelect(month, e.target.value)}\n >\n {Array.from(\n { length: yearsToDisplay + 1 },\n (_, i) => currentYear - i\n ).map((year) => (\n \n ))}\n \n
\n \n );\n };\n\n return (\n \n From\n \n \n !isInclusivelyBeforeDay(day, moment())}\n />\n
\n \n To\n \n \n
\n );\n};\n\nexport default AskBarSearch;\n","import { Button, Modal } from \"reactstrap\";\nimport crossIcon from \"@src/assets/images/vyrill/icons/cross_icon.png\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport {\n updateCampaignFields,\n updateCampaignState as updateCreateCampaignState,\n} from \"../../../CreateCampaign/CampaignActions\";\nimport { updateCampaignState } from \"../../VideoActions\";\nimport { useNavigate } from \"react-router-dom\";\n\nconst QrCodeModal = ({ open, handleCloseQr }) => {\n const navigate = useNavigate();\n const dispatch = useDispatch();\n const videoData = useSelector(\n (state) => state.videoData.campaign_details_list\n );\n const campaignData = videoData?.campaign_details;\n const handleQrClick = (campaignId) => {\n const queryParams = new URLSearchParams();\n queryParams.append(\"id\", campaignId);\n navigate(\"/create_campaign?\" + queryParams.toString());\n dispatch(updateCreateCampaignState({ activeStep: 5 }));\n dispatch(\n updateCampaignState({ showCampaignStep: true, showCampaignDetail: false })\n );\n dispatch(\n updateCampaignFields({\n banner_share_url: \"\",\n banner_with_qr: \"\",\n })\n );\n };\n return (\n \n
\n QR Code
\n \n Participants can scan this QR code and easily upload their video to\n participate in your campaign.\n
\n \n
\n \n handleQrClick(campaignData?._id)}\n >\n Generate QR Code\n \n
\n Filters
\n \n {start ? (\n this.setState({ start: this.state.start - 1 })}\n />\n ) : null}\n\n {selectedFilters.slice(start).map(({ key, value, subKey }) => (\n \n this.setState({ start: this.state.start + 1 })}\n />\n ) : null}\n
\n \n );\n }\n}\n\nexport default IndexSelectedFilters;\n","import React from \"react\";\nimport ContentLoader from \"react-content-loader\";\nimport { Card, CardBody } from \"reactstrap\";\n\nexport const CardSkeleton = ({}) => (\n \n
\n \n ))}\n {overflow ? (\n \n {filterValues[value] ||\n isoCountries[value] ||\n platformName[value] ||\n getCompanyNameIfTryAndBuy(value)}\n
\n\n \n
\n \n {sponsorshipLabels.includes(sponsorship) && capitalize(sponsorship)}\n
\n);\n","import { useRef } from \"react\";\nimport { UncontrolledTooltip } from \"reactstrap\";\nimport { Star } from \"react-feather\";\n\nexport const CampaignTag = ({ campaignName, width, style }: any) => {\n const imgRef = useRef(null);\n return (\n \n
\n );\n};\n\nexport const RatingStars = ({ width, rating }: any) => {\n return (\n \n
\n \n \n {campaignName}\n \n
\n \n
\n );\n};\n","import React from \"react\";\nimport \"react-dates/initialize\";\nimport \"./_datepicker.css\";\nimport moment from \"moment\";\nimport { DateRangePicker } from \"react-dates\";\n\nclass DateRange extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n focusedInput: null,\n };\n }\n s;\n focusChange = (focusedInput) => {\n this.setState({ focusedInput });\n };\n\n render() {\n const { dates, filter, updateDates } = this.props;\n const { startDate, endDate } = dates;\n return (\n \n
\n \n {Array.from({ length: 5 }, (_, index) => (\n
\n \n {index < rating ? (\n
\n ))}\n \n
\n \n )}\n {video?.platform === \"GoogleDrive\" && video?.video_url && (\n <>\n {video.video_url.includes(\"denali\") ? (\n \n Sorry, your browser doesn't support embedded videos.\n
\n \n \n ) : (\n\n \n
\n )}\n \n )}\n\n {video?.video_url &&\n (video.platform === \"Vyrill_AWS_S3\" ||\n video.platform === \"AWS_S3_Swirl\") && (\n \n \n
\n )}\n {video.video_embedded_url && video.platform === \"Youtube\" && (\n \n {handleUrl(\n video.video_url.replace(\n /\\b(?:www.dropbox.com|dl=0)\\b/gi,\n (matched) => urlUpdate[matched]\n )\n )}\n \n
\n )}\n\n {video.video_url && video.platform === \"Tiktok\" && (\n Sorry, your browser doesn't support embedded videos.
\n \n\n
\n Title:{\" \"}\n
\n Creator:{\" \"}\n
\n Product(s): {renderProducts()}\n
\n\n\n
\n \n \n Views:{\" \"}\n {video.youtube_view_count ||\n (video.view_count &&\n abbreviateNumber(\n video.youtube_view_count || video.view_count\n ))}\n
\n\n \n Comments:{\" \"}\n {video.comment_count && abbreviateNumber(video.comment_count)}\n
\n\n \n Likes: {video.likes && abbreviateNumber(video.likes)}\n
\n {video.platform !== \"Tiktok\" && (\n\n \n Dislikes:{\" \"}\n {video.youtube_dislike_count &&\n abbreviateNumber(video.youtube_dislike_count)}\n
\n )}\n\n
\n )}\n \n );\n};\n","import React from 'react';\n\nconst SpeakerIcon = ({ circleColor, pathColor }) => {\n return (\n \n {video.transcription_text\n ? completeTranscript.map(\n ({ start_time, content, speaker }, i, array) => {\n let replacedText;\n replacedText = reactStringReplace(\n content,\n brandName,\n (match, i) => (\n \n {match}\n \n )\n );\n\n productName?.forEach(\n (element) =>\n (replacedText = reactStringReplace(\n replacedText,\n element.name,\n (match, i) => (\n \n {match}\n \n )\n ))\n );\n\n if (i === 0 || speaker !== array[i - 1].speaker) {\n return (\n \n \n
\n {showTimestamp && (\n \n \n {showTimestamp && (\n \n {start_time}\n
\n )}\n \n {replacedText}\n
\n \n );\n }\n }\n )\n : \"No Transcript Found\"}\n \n );\n};\nexport default DownloadSpeakerPDF;\n","import React from \"react\";\nimport { Col, Row } from \"reactstrap\";\nimport { useSelector } from \"react-redux\";\nimport lodash, { uniqueId } from \"lodash\";\nimport PerfectScrollbar from \"react-perfect-scrollbar\";\nimport reactStringReplace from \"react-string-replace\";\n\nimport { SpeakerColorScheme } from \"../../../constants\";\nimport SpeakerIcon from \"./SpeakerIcon\";\nimport DownloadSpeakerPDF from \"./DownloadSpeakerPDF\";\n\nconst transcriptType = (\n transcript,\n checked,\n search,\n video,\n handlePlayVideoSentence,\n productName,\n brandName,\n showTimestamp = false\n) => {\n const completeTranscript = useSelector(\n (state) => state.videoAssociations.transcript\n );\n\n if (search) {\n return lodash.size(transcript.transcription) !== 0\n ? transcript.transcription\n .filter((x) => {\n if (checked) {\n return new RegExp(search, \"i\").test(x.content);\n }\n return x.content;\n })\n .map((row, i) => {\n const transcriptSentence = reactStringReplace(\n row.content,\n search,\n (match) => {match}\n );\n\n return (\n \n \n
\n
\n );\n })\n : \"No Transcript Found\";\n }\n return video.transcription_text\n ? completeTranscript.map(({ start_time, content, speaker }, i, array) => {\n let replacedText;\n replacedText = reactStringReplace(content, brandName, (match) => (\n {match}\n ));\n\n productName?.forEach(\n (element) =>\n (replacedText = reactStringReplace(\n replacedText,\n element.name,\n (match) => (\n \n {match}\n \n )\n ))\n );\n\n if (i === 0 || speaker !== array[i - 1].speaker) {\n return (\n \n \n {showTimestamp && (\n \n {start_time}\n
\n )}\n \n {replacedText}\n
\n \n );\n }\n })\n : \"No Transcript Found\";\n};\n\nconst TranscriptTab = ({\n video,\n transcript,\n checked,\n search = \"\",\n handlePlayVideoSentence,\n productName,\n brandName,\n showTimestamp,\n componentRef,\n}) => {\n const completeTranscript = useSelector(\n (state) => state.videoAssociations.transcript\n );\n \n return (\n <>\n */}\n {transcriptType(\n transcript,\n checked,\n search,\n video,\n handlePlayVideoSentence,\n productName,\n brandName,\n showTimestamp\n )}\n {/*
*/}\n \n \n
\n \n );\n};\n\nexport default TranscriptTab;\n","import { useDispatch, useSelector } from \"react-redux\";\nimport { useNavigate } from \"react-router-dom\";\n\nimport { updateCampaignState, updateVideoPageState } from \"../../VideoActions\";\n\nconst CampaignBreadcrumbs = () => {\n const dispatch = useDispatch();\n const campaignBreadcrumbs = useSelector(\n state => state.videoPageStates.campaignsState.breadcrumbs\n );\n const navigate = useNavigate();\n\n const arr = [];\n\n campaignBreadcrumbs.forEach((i, index) => {\n arr.push(\n \n
\n );\n arr.push(\n \n
\n );\n};\n\nexport default CampaignBreadcrumbs;\n","import { useState, useEffect } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { useParams, useLocation, useNavigate } from \"react-router-dom\";\nimport { v4 as uuidv4 } from \"uuid\";\n\nimport {\n updateParams as updateInfluencerParams,\n updateInfluencerPageState,\n} from \"../Pages/Influencer/influencer_actions\";\nimport {\n updateParams as updateProductParams,\n updateProductPageState,\n} from \"../Pages/Product/productActions\";\nimport {\n updateVideoPageState,\n updateParams as updateVideoParams,\n updatePublishedPageState,\n doResetFiltersVideos,\n updateCampaignState,\n} from \"../Pages/Video/VideoActions\";\nimport { numString } from \"../utilities\";\nimport { identifyAccosiactedTab } from \"./SharedActions\";\nimport \"./shared.scss\";\nimport { updateTab } from \"../Pages/Reports/ReportActions\";\nimport { fetchNotes } from \"./Notes/NoteActions\";\nimport Cookies from \"js-cookie\";\nimport CampaignBreadcrumbs from \"../Pages/Video/Components/Campaign/CampaignBreadcrumbs\";\n\nconst GenerateBreadCrumbs = ({ indexName }) => {\n const videoParams = useSelector((state) => state.videoParams);\n const videoDetailBreadcrumb = useSelector(\n (state) => state.VideoDetailBreadcrumb\n );\n const campaignBreadcrumbs = useSelector(\n (state) => state.videoPageStates.campaignsState.breadcrumbs\n );\n\n const videoPageStates = useSelector((state) => state.videoPageStates);\n const isCampaignListPage = useSelector(\n (state) => state.videoPageStates.isCampaignListPage\n );\n const productPageStates = useSelector((state) => state.productPageStates);\n const PublishedPageStates = useSelector((state) => state.PublishedPageStates);\n const InfluencerPageStates = useSelector(\n (state) => state.InfluencerPageStates\n );\n const productParams = useSelector((state) => state.productParams);\n const productData = useSelector((state) => state.productData);\n const influencerParams = useSelector((state) => state.influencerParams);\n const influencerData = useSelector((state) => state.influencerData);\n const videoData = useSelector((state) => state.videoData);\n const videoDataLoading = useSelector((state) => state.videoData.loading);\n const [isDetailPage, setIsDetailPage] = useState(false);\n const [assosiatedTab, setAssosiatedTab] = useState(\"\");\n const [loading, setLoading] = useState(false);\n const [getDataFromRedux, setGetDataFromRedux] = useState(true);\n const [hideBreadcrumb, setHideBreadcrumb] = useState(false);\n\n const isFlaggedTab = useSelector((state) => state.videoParams.isFlaggedTab);\n const videoFavoriteTab = useSelector(\n (state) => state.videoParams.isFavoriteTab\n );\n const productFavoriteTab = useSelector(\n (state) => state.productParams.isFavoriteTab\n );\n const isTrashTab = useSelector((state) => state.productParams.isTrashTab);\n const isVideoTrashTab = useSelector((state) => state.videoParams.isTrashTab);\n const isCampaignTab = useSelector((state) => state.videoParams.isCampaignTab);\n const navigate = useNavigate();\n const dispatch = useDispatch();\n const location = useLocation();\n\n const { id } = useParams();\n\n const fetchTabDetails = () => {\n const generateUrl = {\n Products: `/products/${id}/identify_my_or_competitor_product`,\n Videos: `/videos/${id}/identify_my_or_competitor_video`,\n Published: `/videos/${id}/identify_my_or_competitor_video`, //@TODO CALL\n };\n setLoading(true);\n identifyAccosiactedTab(generateUrl[indexName])\n .then((response) => {\n setLoading(false);\n setAssosiatedTab(response[0]);\n setHideBreadcrumb(false);\n })\n .catch((err) => {\n if (err.response.status === 500) {\n setHideBreadcrumb(true);\n }\n setLoading(false);\n });\n };\n\n useEffect(() => {\n if (location.pathname) setIsDetailPage(id ? true : false);\n }, [location.pathname]);\n\n useEffect(() => {\n if (\n (isDetailPage && indexName === \"Published\" && videoData.count < 1) ||\n (isDetailPage && indexName === \"Products\" && productData.count < 1)\n ) {\n setGetDataFromRedux(false);\n fetchTabDetails();\n }\n }, [productData.count, videoData.count, isDetailPage]);\n\n const isCategoryActive = {\n Products: productPageStates.isCategoryPage,\n Videos: videoPageStates.isCategoryPage,\n influencers: InfluencerPageStates.isCategoryPage, //@TODO\n Published: PublishedPageStates.isCategoryPage, //@TODO\n };\n // console.log(videoPageStates.isCategoryPage, isCampaignListPage);\n const dispatchActiveParams = {\n Products: () => dispatch(updateProductPageState({ isCategoryPage: true })),\n Videos: () => {\n dispatch(\n updateVideoPageState({\n isCategoryPage: true,\n isCampaignListPage: false,\n })\n ),\n dispatch(\n updateCampaignState({ breadcrumbs: [], showCampaignHeader: false })\n );\n Cookies.remove(\"activeTab\");\n navigate(\"/videos\");\n },\n Published: () =>\n dispatch(updatePublishedPageState({ isCategoryPage: true })),\n influencers: () =>\n dispatch(updateInfluencerPageState({ isCategoryPage: true })),\n };\n\n const dispatchFromDetails = {\n Products: () => {\n navigate(\"/products\");\n dispatch(updateProductPageState({ isCategoryPage: true }));\n },\n Videos: () => {\n navigate(\"/videos\");\n dispatch(updateVideoPageState({ isCategoryPage: true }));\n dispatch(updateCampaignState({ breadcrumbs: [] }));\n },\n\n Published: () => {\n navigate(\"/published\");\n dispatch(updatePublishedPageState({ isCategoryPage: true }));\n },\n };\n\n const ActiveTab = {\n Products: productParams.tab,\n Videos: videoParams.tab,\n influencers: influencerParams.tab,\n Published: videoParams.tab,\n };\n\n const tabAsParamName = {\n my_product: \"My Products\",\n competitor_product: \"Competition\",\n my_video: \"My Videos\",\n competitor_video: \"Competition\",\n my_influcencers: \"My Creators\",\n };\n\n const tabAsInBreadcrumb = {\n my_product: \"My Products\",\n competitor_product: \"Competitors\",\n my_video: \"My Videos\",\n competitor_video: \"Competitors\",\n my_influcencers: \"My Creators\",\n };\n\n const ActiveCard = {\n Products: () => {\n navigate(\"/products\");\n dispatch(\n updateProductParams({\n tab: getDataFromRedux\n ? productParams.tab\n : tabAsParamName[assosiatedTab],\n })\n );\n dispatch(updateProductPageState({ isCategoryPage: false }));\n },\n influencers: () => {\n navigate(\"/influencers\");\n dispatch(\n updateInfluencerPageState({\n isCategoryPage: false,\n })\n );\n },\n Videos: () => {\n navigate(\"/videos\");\n dispatch(\n updateVideoParams({\n tab: getDataFromRedux\n ? videoParams.tab\n : tabAsParamName[assosiatedTab],\n })\n );\n dispatch(updateVideoPageState({ isCategoryPage: false }));\n },\n\n Published: () => {\n navigate(\"/published\");\n dispatch(\n updateVideoParams({\n tab: getDataFromRedux\n ? videoParams.tab\n : tabAsParamName[assosiatedTab],\n isCategoryPage: false,\n })\n );\n },\n };\n\n const ActiveCount = {\n Products: productData.count,\n Videos: videoData.count,\n influencers: influencerData.count,\n Published: videoData.count,\n };\n\n const ActiveProduct = {\n Products: \"Product\",\n Videos: \"Video\",\n Published: \"Video\",\n };\n\n const UIConstants = () => {\n // @TODO need improvements\n if (\n ActiveTab[indexName] === \"Competition\" &&\n !isTrashTab &&\n !productFavoriteTab &&\n !isFlaggedTab &&\n !videoFavoriteTab &&\n !isVideoTrashTab\n ) {\n return \"Competitors\";\n }\n if (ActiveTab[indexName] === \"fan\") {\n return \"Shopper\";\n }\n if (isFlaggedTab) {\n return \"Flagged Videos\";\n }\n if (isCampaignTab || isCampaignListPage) {\n return \"Campaigns\";\n }\n if (isTrashTab || isVideoTrashTab) {\n return \"Trash\";\n }\n if (videoFavoriteTab && indexName === \"Videos\") {\n return \"Favorites Videos\";\n }\n if (productFavoriteTab && indexName === \"Products\") {\n return \"Favorites Products\";\n }\n return ActiveTab[indexName];\n };\n\n const renderIndexName = () => {\n if (indexName === \"influencers\") {\n return \"Creators\";\n }\n if (indexName === \"Published\") {\n return \"Published Videos\";\n }\n return indexName;\n };\n\n const renderIndexCrumbs = (\n <>\n {!isCategoryActive[indexName] && (\n {arr}
\n \n
\n )}\n {!isCategoryActive[indexName] && ActiveTab[indexName] && (\n \n \n {UIConstants()}\n {/* TODO: video */}\n {!isCampaignListPage &&\n indexName === \"Videos\" &&\n !videoDataLoading &&\n ` (${numString(ActiveCount[indexName])})`}\n\n {/* {indexName === \"Videos\" &&\n !videoDataLoading &&\n ` (${numString(ActiveCount[indexName])})`} */}\n {indexName !== \"Videos\" &&\n ` (${numString(ActiveCount[indexName])})`}\n \n
\n )}\n \n );\n\n const renderDetailsCrumbs = !loading && !hideBreadcrumb && (\n <>\n \n
\n \n \n {getDataFromRedux ? UIConstants() : tabAsInBreadcrumb[assosiatedTab]}\n \n
\n \n
\n \n {ActiveProduct[indexName]} Details\n
\n \n );\n\n if (\n (location.pathname.includes(\"videos\") ||\n location.pathname.includes(\"published\")) &&\n id\n ) {\n const arr = [];\n let recent = false;\n videoDetailBreadcrumb.forEach((i) => {\n // if (i.name === \"Home\") recent = true;\n arr.push(\n \n
\n );\n });\n\n arr.push(\n \n {recent && \"Recent\"} Video Details\n
\n );\n\n return (\n {arr}
\n \n );\n }\n\n return (\n \n
\n \n );\n};\nexport default GenerateBreadCrumbs;\n","import React, { useState } from \"react\";\nimport lodash, { isEmpty } from \"lodash\";\nimport { MoreVertical } from \"react-feather\";\nimport { useDropzone } from \"react-dropzone\";\nimport { CardImg } from \"reactstrap\";\n\nconst EditProductImage = ({\n image,\n updatedImage,\n updateImage,\n deleteImage,\n tab,\n}) => {\n const [error, setError] = useState({});\n const [openInfoSearch, setOpenInfoSearch] = useState(false);\n const [thumbnailDropdown, setThumbnailDropdown] = useState(false);\n\n const { getRootProps, getInputProps } = useDropzone({\n maxFilesize: 1,\n maxFiles: 1,\n minSize: 0,\n maxSize: 1048576 * 2,\n accept: \"image/jpeg, image/png, image/jpg\",\n onDrop: (acceptedFiles, fileRejections) => {\n if (acceptedFiles.length) {\n updateImage(\n Object.assign(acceptedFiles[0], {\n preview: URL.createObjectURL(acceptedFiles[0]),\n })\n );\n setError({});\n }\n const fileErrors = lodash.get(fileRejections, \"[0].errors[0]\", undefined);\n if (fileErrors) {\n setError(fileErrors);\n }\n },\n });\n\n const imageStyles = {\n transition: \"border .24s ease -in -out\",\n padding: \"5px 10px\",\n };\n\n return (\n \n \n {renderIndexName()}\n
\n {campaignBreadcrumbs.length > 0 ? (\n \n File size Must be less than 2MB\n
\n )}\n {tab !== \"Competition\" && (image || updatedImage) && openInfoSearch && (\n \n \n
\n\n Change
\n \n \n \n
\n \n )}\n \n );\n};\nexport default EditProductImage;\n","import React from \"react\";\nimport { isEmpty } from \"lodash\";\nimport { connect } from \"react-redux\";\nimport { Lock, HelpCircle } from \"react-feather\";\nimport {\n Row,\n Col,\n Modal,\n Card,\n Form,\n Input,\n Label,\n Button,\n Spinner,\n CardBody,\n ModalBody,\n InputGroup,\n ModalHeader,\n InputGroupText,\n FormGroup,\n CardImg,\n UncontrolledTooltip,\n} from \"reactstrap\";\n\nimport { productImage, validAlphaNumeric } from \"../../../utilities\";\nimport {\n fetchUpdateProduct,\n fetchProduct,\n clearUpdatedProductData,\n fetchProducts,\n} from \"../productActions\";\nimport { receiveValidationErrors } from \"../../../Shared/Errors/errorActions\";\nimport EditProductImage from \"./EditProductImage\";\n/* eslint-disable */\n\nclass EditProduct extends React.Component {\n constructor(props) {\n super(props);\n const { product_id } = props;\n const i = props.products\n ? props.products.findIndex(\n ({ _id, name }) => product_id === _id || product_id === name\n )\n : null;\n const product = i === -1 ? {} : props.products[i];\n this.state = {\n upc: product.upc || \"\",\n productDescription: product.desc || \"\",\n productHeading: product.name || \"\",\n updated: false,\n image: productImage(product, props.pictures) || null,\n updatedImage: null,\n imageDeleted: false,\n };\n }\n\n componentWillMount() {\n const { dispatch } = this.props;\n const errors = {};\n dispatch(receiveValidationErrors(errors));\n }\n\n _validateProductForm = () => {\n const { upc, productDescription } = this.state;\n const { dispatch } = this.props;\n let isValid = false;\n const errors = {};\n if (!upc) {\n //errors.upc = 'UPC code is required.'\n } else if (!validAlphaNumeric(upc) || upc.length > 13) {\n errors.upc =\n \"Only alphanumeric values are allowed for UPC code with a maximum length of 13 characters.\";\n }\n\n if (productDescription && productDescription.length > 5000) {\n errors.productDescription =\n \"Product Description can't exceed 5000 characters.\";\n }\n\n if (isEmpty(errors)) {\n isValid = true;\n dispatch(receiveValidationErrors(errors));\n } else {\n dispatch(receiveValidationErrors(errors));\n }\n return isValid;\n };\n\n update = (event) => {\n const { target } = event;\n const value = target.value;\n const { name } = target;\n this.setState({ [name]: value });\n };\n\n updateProduct = (product_id) => {\n const { dispatch } = this.props;\n const formData = new FormData();\n formData.append(\"upc_code\", this.state.upc);\n formData.append(\"description\", this.state.productDescription);\n formData.append(\"product_heading\", this.state.productHeading);\n if (this.state.updatedImage) {\n formData.append(\"picture\", this.state.updatedImage);\n }\n if (!this.state.updatedImage && this.state.imageDeleted) {\n formData.append(\"picture\", \"delete\");\n }\n if (this._validateProductForm()) {\n dispatch(fetchUpdateProduct(product_id, formData));\n this.setState({ updated: true });\n }\n };\n\n closeModal = (product_id) => {\n const { dispatch, showProductEdit, params, updateProduct } = this.props;\n dispatch(fetchProduct(product_id));\n dispatch(clearUpdatedProductData());\n if (updateProduct.success) {\n dispatch(fetchProducts(params));\n }\n showProductEdit;\n };\n\n updateImage = (image) => {\n this.setState({ updatedImage: image });\n };\n\n deleteImage = () => {\n if (this.state.updatedImage) {\n this.setState({ updatedImage: null });\n }\n if (this.state.image) {\n this.setState({ image: null, imageDeleted: true });\n }\n };\n\n render() {\n const {\n products,\n open,\n product_id,\n showProductEdit,\n pictures,\n loading,\n validationErrors,\n updateProduct,\n tab,\n } = this.props;\n const i = products.findIndex(\n ({ _id, name }) => product_id === _id || product_id === name\n );\n const product = i === -1 ? {} : products[i];\n const image = productImage(product, pictures);\n const invalidMessage = {\n fontSize: \"11px\",\n color: \"red\",\n };\n return (\n \n
\n Drag & Drop file or Browse
\n\n
and fetching new videos of the\n product/hashtag\n
\n )}\n {updateProduct.success && (\n \n
\n Please wait, Running AVAand fetching new videos of the\n product/hashtag\n
\n
\n )}\n {!updateProduct.loading && !updateProduct.success && (\n <>\n \n \n \n \n \n \n
\n \n
\n \n Your product have been updated\n
\n\n this.closeModal(product_id)}\n color=\"primary\"\n type=\"submit\"\n >\n Close\n \n
\n \n this.updateProduct(product_id)}\n color=\"primary\"\n type=\"submit\"\n >\n Save\n \n \n Cancel\n \n
\n \n \n )}\n \n
\n \n );\n};\n\nexport default BlankLayout;\n","import React from \"react\";\nimport moment from \"moment\";\nimport { addDefaultSrc } from \"../../../utilities\";\n\nconst Message = ({\n isVyrillMessage,\n isOwnMessage,\n timetoken,\n image,\n children,\n first_name,\n last_name,\n}) => (\n \n
\n \n
\n \n {isVyrillMessage && (\n 
addDefaultSrc(event)} />\n )}\n addDefaultSrc(event)} />\n
\n);\n\nexport default Message;\n","import React, {useCallback} from \"react\";\nimport { Button, Tooltip, UncontrolledTooltip } from \"reactstrap\";\nimport { Edit, Edit2, Flag, Heart, Mail, MessageSquare } from \"react-feather\";\n\nimport EditProduct from \"../../Pages/Product/Components/EditProduct\";\nimport mixpanel from 'mixpanel-browser';\nimport { MIXPANEL_PRODUCTS_VIDEOS_CARD } from '../../mixpanel/mixpanel_constants'\n\nconst NoteText = ({\n text,\n update,\n submit,\n isCreator,\n influencerDetailPage,\n}) => (\n \n
\n )}\n {!isVyrillMessage && !isOwnMessage && (\n \n
\n {isOwnMessage && (\n // {children}
\n \n \n \n {moment(timetoken / 1e4).fromNow()}\n \n
\n \n {first_name && last_name && first_name.charAt(0) + last_name.charAt(0)}\n
\n )}\n Note
\n \n \n Save\n \n \n);\n\n/* eslint-disable */\nclass NoteContainer extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n open: false,\n openEditProduct: false,\n mailTooltipOpen: false,\n chatTooltipOpen: false,\n favTooltipOpen: false,\n flagTooltipOpen: false,\n editTooltipOpen: false,\n editProductTooltipOpen: false,\n text: props.note ? props.note.note : \"\",\n };\n this.mailToggle = this.mailToggle.bind(this);\n this.chatToggle = this.chatToggle.bind(this);\n this.favtoggle = this.favtoggle.bind(this);\n this.flagtoggle = this.flagtoggle.bind(this);\n this.editToggle = this.editToggle.bind(this);\n this.editProToggle = this.editProToggle.bind(this);\n }\n\n componentDidUpdate({ note }) {\n this.setState({ text: note ? note.note : \"\" });\n }\n\n toggleOpen = () => {\n this.setState({ open: !this.state.open });\n if (!this.state.open) mixpanel.track(MIXPANEL_PRODUCTS_VIDEOS_CARD.OPEN_EDIT_NOTE_DIALOG)\n };\n\n updateText = ({ target }) => {\n this.setState({ text: target.value });\n };\n\n toggle = (field) => () => {\n const { id, note, updateNote } = this.props;\n\n // Mixpanel tracking for Favorite\n switch (field) {\n case \"flagged\":\n const flagged = note.flagged || note.flagged_video;\n mixpanel.track(MIXPANEL_PRODUCTS_VIDEOS_CARD.FLAG)\n return updateNote(id, { flagged: !flagged });\n case \"favorite\":\n mixpanel.track(MIXPANEL_PRODUCTS_VIDEOS_CARD.ADD_TO_FAVORITES)\n break;\n }\n updateNote(id, { [field]: !note[field] });\n };\n\n submitText = () => {\n const { id, updateNote } = this.props;\n updateNote(id, { note: this.state.text });\n this.toggleOpen();\n mixpanel.track(MIXPANEL_PRODUCTS_VIDEOS_CARD.SUBMIT_EDIT_NOTE)\n };\n\n showProductEdit = () => {\n this.setState({ openEditProduct: !this.state.openEditProduct });\n if (!this.state.openEditProduct) mixpanel.track(MIXPANEL_PRODUCTS_VIDEOS_CARD.EDIT_PRODUCT)\n };\n\n mailToggle = () => {\n this.setState({\n mailTooltipOpen: !this.state.mailTooltipOpen,\n });\n };\n\n chatToggle = () => {\n this.setState({\n chatTooltipOpen: !this.state.chatTooltipOpen,\n });\n };\n\n favtoggle = () => {\n this.setState({\n favTooltipOpen: !this.state.favTooltipOpen,\n });\n };\n\n flagtoggle = () => {\n this.setState({\n flagTooltipOpen: !this.state.flagTooltipOpen,\n });\n };\n\n editToggle = () => {\n this.setState({\n editTooltipOpen: !this.state.editTooltipOpen,\n });\n };\n\n editProToggle = () => {\n this.setState({\n editProductTooltipOpen: !this.state.editProductTooltipOpen,\n });\n };\n\n render() {\n const {\n isInfluencer,\n note,\n isTryAndBuy,\n handleCopyText,\n id,\n manufacturer_id,\n current_brand,\n current_user,\n product_edit,\n title,\n isEmailCopied,\n isEmailBlocked,\n isCreatorNote,\n is_index,\n tab,\n influencerDetailPage,\n } = this.props;\n const current_id = current_brand\n ? current_brand._id\n : current_user\n ? current_user._id\n : \"\";\n const { open, text, openEditProduct } = this.state;\n\n const handleEmailClick =() => {\n mixpanel.track(MIXPANEL_PRODUCTS_VIDEOS_CARD.COPY_EMAIL)\n handleCopyText()\n }\n\n return (\n \n {isInfluencer && (\n <>\n
\n );\n }\n}\n\nexport default NoteContainer;\n","import React from \"react\";\nimport { Calendar, Eye, Feather, Users, Youtube } from \"react-feather\";\nimport { Link } from \"react-router-dom\";\nimport { InfluencerNote } from \"../../../Shared/Notes/NoteContainer\";\nimport { addDefaultSrc, dateString } from \"../../../utilities\";\n// import { Loader } from '../../shared/loader';\n\nconst ChatNav = ({ user, influencer, note, loading, recipientImage }) =>\n !loading && user && user._id ? (\n \n {} : handleEmailClick}\n >\n \n {title}\n \n
\n \n )}\n \n \n \n {note && note.favorite\n ? \"Remove from Favorites\"\n : \"Add to Favorites\"}\n \n
\n \n \n \n {(note && note.flagged) || (note && note.flagged_video)\n ? \"Unflag\"\n : \"Flag\"}\n \n
\n\n {is_index ? (\n \"\"\n ) : (\n \n \n \n Edit Note\n \n {open ? (\n
\n )}\n {/* {(manufacturer_id === current_id) ? ( */}\n {product_edit ? (\n \n \n \n Edit\n \n {openEditProduct && (\n
\n ) : (\n \"\"\n )}\n \n \n addDefaultSrc(\n event,\n require(\"@src/assets/images/vyrill/default-creators.png\").default\n )\n }\n alt=\"\"\n />\n
\n ) : (\n \n {user && `${user.first_name} ${user.last_name}`}\n
\n {influencer && (\n \n
\n )}\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n View Creator\n \n {/*
\n \n {/*
\n );\n\nexport default ChatNav;\n","import React from \"react\";\nimport { PlusCircle } from \"react-feather\";\n\nexport default ({ label, selected, creating, select, unselect }) => {\n let className = \"tag\";\n if (selected) {\n className += \" selected-tag\";\n }\n\n if (creating) {\n className += \" creating-tag\";\n }\n\n return (\n \n {creating &&
\n );\n};\n","import React from \"react\";\nimport Tag from \"./Tag\";\n\nexport default ({ title, tagList, selectedTags, name, select, unselect }) => (\n {\" X\"}
}\n \n
\n);\n","import React from \"react\";\nimport Creatable from \"react-select/creatable\";\n\nimport Tag from \"./Tag\";\nimport { options } from \"../utilities\";\n\nexport default ({\n label,\n optionList,\n placeholder,\n unselectTag,\n name,\n addFromSelect,\n tags,\n}) => (\n {title}
\n\n {\" \"}\n {tagList.map((tag, index) => (\n select(tag, name)}\n unselect={() => unselect(tag, name)}\n />\n ))}\n
\n \n \n
\n);\n","import React, { Component } from \"react\";\nimport { connect } from \"react-redux\";\n// import { Link } from 'react-router-dom';\nimport {\n sendLicenseRequest,\n resetLicenseRequestVideo,\n} from \"../licensing_redux\";\nimport { sendMessage } from \"../../../Pages/Chat/ChatRedux\";\nimport { fetchVIPVideoNote } from \"../../../Pages/Video/VideoActions\";\nimport SelectableTags from \"../../SelectableTags\";\nimport MySelect from \"../../MySelect\";\nimport YouTubeVideo from \"../../../Shared/YouTubeVideo\";\nimport GenerateTiktokThumbnail from \"../../../Shared/GenerateTiktokThumbnail\";\nimport {\n getLicenseDuration,\n getLicensePrice,\n formatPrice,\n} from \"../../../utilities\";\nimport \"../LisenseRequest.scss\";\n\nconst purposeOptions = [\"Product Page (ecommerce)\", \"Website\", \"Advertisement\"];\n\nconst mimeTypes = {\n ogm: \"video/ogg\",\n ogv: \"video/ogg\",\n ogg: \"video/ogg\",\n mp4: \"video/mp4\",\n webm: \"video/webm\",\n};\n\nclass SendLicenseRequest extends Component {\n constructor(props) {\n super(props);\n this.state = {\n purposes: [],\n message: \"\",\n };\n }\n // eslint-disable-next-line camelcase\n UNSAFE_componentWillMount() {\n const { dispatch, videoId } = this.props;\n dispatch(fetchVIPVideoNote(videoId));\n }\n\n componentWillUnmount() {\n this.props.dispatch(resetLicenseRequestVideo());\n }\n\n submit = () => {\n const {\n currentUser: { _id, first_name, last_name },\n currentBrandName,\n influencerNote: note,\n dispatch,\n licenseRequestVideo,\n influencerAdminId,\n influencerEmail,\n channel,\n } = this.props;\n const { message, purposes } = this.state;\n const data = {\n influencerId: influencerAdminId,\n videoId: licenseRequestVideo._id,\n purpose: purposes,\n };\n const { pubnub } = window;\n\n pubnub.publish({\n channel: \"vyrill\",\n message: {\n channel,\n user: [first_name, last_name].join(\" \"),\n user_id: _id,\n },\n storeInHistory: false,\n });\n dispatch(sendMessage(influencerAdminId));\n dispatch(\n sendLicenseRequest({\n data,\n message,\n channel,\n video: licenseRequestVideo,\n note,\n })\n );\n };\n\n addTag = (tag) => {\n this.setState(({ purposes }) =>\n purposes.includes(tag) ? { purposes } : { purposes: [...purposes, tag] }\n );\n };\n\n removeTag = (tag) => {\n this.setState(({ purposes }) => {\n const indexOfTag = purposes.indexOf(tag);\n if (indexOfTag === -1) {\n return { purposes };\n }\n const newPurposes = [...purposes];\n newPurposes.splice(indexOfTag, 1);\n return {\n purposes: newPurposes,\n };\n });\n };\n\n render() {\n const { licenseRequestVideo, influencerNote: note } = this.props;\n const {\n video_url,\n platform,\n title,\n video_embedded_url,\n _id,\n thumbnail_url,\n } = licenseRequestVideo || {};\n\n const { purposes, message } = this.state;\n\n return (\n \n {\" \"}\n {tags.map((tag, index) => (\n unselectTag(tag, name)}\n creating={!optionList.includes(tag)}\n />\n ))}\n
\n \n this.addTag(options[0].value)}\n tags={purposes.filter((purpose) => !purposeOptions.includes(purpose))}\n />\n
\n );\n }\n}\n\nconst mapStateToProps = ({\n navbarStatsReducer: { current_user, currentBrand },\n licenseRequestVideo,\n vipInfluencerVideoNote,\n}) => ({\n licenseRequestVideo,\n influencerNote: vipInfluencerVideoNote.body,\n currentUser: current_user,\n currentBrandName: currentBrand ? currentBrand.name : \"\",\n});\n\nexport default connect(mapStateToProps)(SendLicenseRequest);\n","import React from \"react\";\nimport { CheckCircle } from \"react-feather\";\nimport {\n getLicensePrice,\n getLicenseFee,\n getLicenseTotalPrice,\n formatPrice,\n} from \"../../../utilities\";\n\nconst LicenseRequestSent = ({ status, note, royalties, totalPrice }) => (\n \n Send a license request\n
\n\n {video_url && platform === \"Dropbox\" ? (\n
\n \n \n
\n ) : null}\n {video_embedded_url && platform === \"Youtube\" && (\n Sorry, your browser doesn't support embedded videos.
\n \n\n
\n )}\n {video_url && platform === \"Tiktok\" && (\n \n
\n \n
\n )}\n \n {title}\n
\n\n Creator priced this license at:\n
\n\n If you would like to request an edit to the length or price, you may\n ask the creator below\n
\n\n \n {getLicenseDuration(note)} license\n \n \n {formatPrice(getLicensePrice(note))}\n \n
\n \n \n \n this.setState({ message: value })\n }\n value={message}\n />\n
\n \n \n Send license request\n \n \n You will not be charged at this time until creator accepts the\n offer.\n \n
\n \n {status === \"PENDING\" && (\n \n )}\n {status === \"DECLINED\" && (\n
\n);\n\nexport default LicenseRequestSent;\n","import React from \"react\";\nimport { Modal, ModalBody } from \"reactstrap\";\n\nconst ModalView = ({ close, setModal, children, isOpen }) => {\n return (\n \n Declined offer\n
\n )}\n {status === \"ACCEPTED\" && (\n \n
\n )}\n {status === \"PENDING\" && (\n \n {`You will be charged ${formatPrice(getLicensePrice(note))} +\n ${formatPrice(\n getLicenseFee(getLicensePrice(note))\n )} (Vyrill fee) for a total of\n ${formatPrice(\n getLicenseTotalPrice(note)\n )}, if the creator accepts.`}\n \n )}\n {status === \"ACCEPTED\" && (\n \n {`You will be charged ${formatPrice(royalties)} +\n ${formatPrice(\n getLicenseFee(royalties)\n )} (Vyrill fee) for a total of\n ${formatPrice(totalPrice)}, if the creator accepts.`}\n \n )}\n \n
\n);\n\nexport default LicenseTerms;\n","import React from \"react\";\nimport { connect } from \"react-redux\";\nimport {\n getLicensePrice,\n getLicenseTotalPrice,\n formatPrice,\n validUrl,\n} from \"../../../utilities\";\nimport AuthField from \"../../../Shared/AuthField\";\nimport TermsAndConditions from \"../../../Shared/TermsAndConditions\";\nimport LicenseTerms from \"./_license_terms\";\nimport { receiveValidationErrors } from \"../../../Shared/Errors/errorActions\";\n\nclass LicenseRequestReceived extends React.Component {\n state = {\n downloadLink: \"\",\n termsAccepted: false,\n };\n\n acceptAgreement = (accepted) => {\n const { downloadLink } = this.state;\n const { note } = this.props;\n const data = accepted ? { accept: true, downloadLink } : { decline: true };\n data.total_license_price = getLicenseTotalPrice(note);\n data.influencer_royalties = getLicensePrice(note);\n if (this._validate()) {\n this.props.acceptAgreement(data);\n }\n };\n\n _validate = () => {\n let isValid = false;\n const { downloadLink } = this.state;\n const { dispatch } = this.props;\n if (!downloadLink || validUrl(downloadLink)) {\n isValid = true;\n } else {\n dispatch(\n receiveValidationErrors({\n downloadLink:\n \"Please enter a valid url, starting with 'http' or 'https'.\",\n })\n );\n }\n return isValid;\n };\n\n render() {\n const { status, validationErrors, royalties } = this.props;\n const { downloadLink, termsAccepted } = this.state;\n\n return (\n \n LICENSE OF CREATOR CONTENT\n
\n\n
\n \n This License of Creator Content (this “License”)\n applies to the license of Creator Content from the creator of such\n content (the “Creator”) to the entity wishing to\n license and exploit such Creator Content (the “Brand”)\n pursuant to the terms (1) in this License and (2) set between the\n parties through the functionality of the Vyrill influencer platform\n located at https://vyrill.com/ (the “Platform”\n ). Each of Creator and Brand may be referred to herein individually as{\" \"}\n “you” or a “party” or collectively as\n the “parties”.{\" \"}\n
\n \n\n Please read this License carefully. By clicking “I Accept” when that\n option is available to you, you agree to be bound by the terms of this\n License and all terms incorporated by reference. If you do not agree\n to the terms of this License in its entirety, you may not use the\n Creator Content.\n
\n\n Vyrill Inc. (“Vyrill”) is a party to this License solely as a\n facilitator between Creator and Brand, and shall have no\n responsibility or liability for any of Creator’s or Brand’s actions or\n inactions, whether relating to this License, use of the Platform, or\n otherwise.\n
\n \n- \n
- \n Defined Terms\n
- \n
- \n “Creator Appearance” means Creator’s name, voice,\n photo, image, likeness, biographical material or any other\n indications of Creator’s appearance or personality.\n \n
- \n “Creator Content” means the specific content (1)\n created, posted, stored and shared through the Platform, including\n messages, text, photos, videos, other materials and Creator\n Appearance and (2) selected by Brand for licensing hereunder.\n \n
- \n “License Terms” means the duration of the license\n to Brand (the “Term”\n ), the territorial restrictions on the license to Brand, if any\n (the “Territory”\n ), the fee for the license (the “License Fee”\n ), the exclusive or non-exclusive nature of the license, and any\n other license terms or restrictions established by the parties\n through the Platform’s functionality.\n \n
\n - License Fee; Appointment of Payment Processing Agent. \n
- Grant of Rights. \n
- Reservation of Rights. \n
- Creator Obligations. \n
- Permissions. \n
- \n Representations and Warranties; Indemnification; Limitation of\n Liability.\n
- \n
- \n Creator represents and warrants that (i) it has the right, power,\n and authority to grant the rights and licenses granted hereunder\n and is the sole owner of the Creator Content; (ii) Brand’s use of\n the Creator Content as permitted by this License will not violate\n or infringe any copyright, trademark, or other intellectual\n property, or any privacy, publicity, contract, or other\n third-party right; and (iii) no consents from, or payments to, any\n third party are required for or by Creator’s grant of rights to\n Brand hereunder or by Brand’s exercise of such rights.\n \n
- \n Brand will indemnify, defend, and hold harmless Creator from and\n against, any losses, damages, liabilities, deficiencies, claims,\n actions, judgments, settlements, interest, awards, penalties,\n fines, costs, or expenses of whatever kind (\n “Losses”\n ), including attorneys’ fees and the cost of enforcing any right\n to indemnification hereunder and the cost of pursuing any\n insurance providers, arising out of or in connection with any\n third-party claim, suit, action, or proceeding arising under US\n law resulting directly or indirectly from the Brand’s use of the\n Creator Content. Notwithstanding the foregoing, Brand will not\n indemnify Creator where such Losses arise out of a breach by\n Creator of its representations and warranties hereunder, failure\n to obtain Permissions, or violation or infringement of any\n copyright, trademark or other intellectual property, or any\n privacy, publicity, contract or other third-party right.\n \n
- \n NEITHER LICENSOR NOR PRODUCER WILL BE LIABLE UNDER OR IN\n CONNECTION WITH THIS LICENSE FOR INDIRECT, INCIDENTAL,\n CONSEQUENTIAL, LIQUIDATED, SPECIAL, OR EXEMPLARY DAMAGES OR\n PENALTIES, INCLUDING WITHOUT LIMITATION, LOSSES OF BUSINESS,\n REVENUE, OR ANTICIPATED PROFITS, REGARDLESS OF WHETHER SUCH DAMAGE\n WAS FORESEEABLE AND WHETHER SUCH PARTY HAS BEEN ADVISED OF THE\n POSSIBILITY OF SUCH DAMAGES.\n \n
\n - \n Standard Terms.\n
- \n
- \n Creator may not terminate, rescind, revoke, or modify this\n License, in whole or in part. Creator hereby waives its right to\n injunctive and other equitable relief in the event of a dispute\n with Brand. Creator has no right to enjoin or interfere with the\n production, distribution, exploitation, advertising, or promotion\n of the Creator Content.{\" \"}\n \n
- \n No waiver by any party of any of the provisions hereof will be\n effective unless explicitly set forth in writing (including\n through the functionality of the Platform). No waiver by any party\n will operate or be construed as a waiver of any failure, breach,\n or default not expressly identified by such written waiver,\n whether of a similar or different character, and whether occurring\n before or after that waiver. No failure to exercise, or delay in\n exercising, any right, remedy, power, or privilege arising from\n this License will operate or be construed as a waiver thereof; nor\n will any single or partial exercise of any right, remedy, power,\n or privilege hereunder preclude any other or further exercise\n thereof or the exercise of any other right, remedy, power, or\n privilege.\n \n
- \n Brand may freely assign or otherwise transfer any of its rights\n and delegate any of its obligations under this License. Creator\n may not assign or otherwise transfer any of its rights or delegate\n any of its obligations under this License without the prior\n written consent of Brand. This License is binding on and inures to\n the benefit of the parties hereto and their respective permitted\n successors and assigns.\n \n
- \n This relationship between the parties is that of independent\n contractors. Nothing contained in this License will be construed\n as creating any agency, partnership, joint venture, or other form\n of joint enterprise, employment, or fiduciary relationship between\n the parties, and neither party shall have authority to contract\n for or bind the other party in any manner whatsoever.\n \n
\n
\n {\" \"}\n In full consideration of the grant of rights and license hereunder, on\n final negotiation of the License Terms, Brand shall pay the Creator\n the License Fee in US Dollars, using Vyrill as a payment processing\n agent, through the functionality of the Platform (including via PayPal\n functionality). Each of Creator and Brand hereby appoint Vyrill as its\n payment processing agent for the limited purpose of receiving or\n making payments on Creator’s or Brand’s behalf. Brand will receive a\n receipt through the functionality of the Platform upon payment of the\n License Fee indicating that payment has been made on the applicable\n date. Vyrill’s obligation to remit funds collected by Vyrill on\n Creator’s behalf shall be limited to funds that Vyrill has actually\n received and that are not subject to reversal, and Vyrill shall have\n no obligation to pursue any collection action against Brand or any\n third party. Receipt of funds from Brand by Vyrill on Creator’s behalf\n in connection with this License of the Creator Content shall be deemed\n receipt of funds from Brand by Creator and will satisfy the\n obligations owed to Creator by Brand in the amount of the applicable\n payment by Brand, even if Viryll fails to remit such funds received\n from Brand, and each party will perform its respective obligations\n under this Agreement as if such funds were received. Each of Creator\n and Brand will pay such fees as established by Vyrill, if any, due and\n owing by such party to Vyrill through the functionality of the\n Platform.\n
\n\n In consideration of the License Fee and the agreements made between\n the Creator and the Brand through the functionality of the Platform,\n Creator hereby grants to Brand and its successors, licensees, and\n assigns during the Term and subject to the other License Terms, the\n right and license throughout the Territory to (a) use the Creator\n Content in all formats and media in and in connection with any\n advertising and promotional activities of the Brand without credit to\n the Creator and (b) reproduce, distribute, display, publicly perform,\n exhibit, and otherwise exploit the Creator Content in advertising and\n promotional activities of the Brand. Notwithstanding the foregoing,\n Brand does not have any obligation to to produce, distribute, or\n otherwise exploit the Creator Content.\n
\n\n Creator owns and retains all right, title, and interest in and to the\n Creator Content, subject to the license granted in Section 3.\n
\n\n After mutual agreement of this License through the functionality of\n the Platform and payment in full of the License Fee to Vyrill, Creator\n shall deliver or make available the Creator Content to Brand through\n the Platform.\n
\n\n Creator has obtained from all persons and entities who are, or whose\n trademark or other property is, identified, depicted, or otherwise\n referred to in the Creator Content, such written and signed licenses,\n permissions, waivers, releases, and consents (collectively,{\" \"}\n ”Permissions” and each, individually, a{\" \"}\n ”Permission”\n ), including those relating to publicity, privacy, and any\n intellectual property rights, as are, or reasonably may be expected to\n be, necessary for Brand to exercise its rights in the Creator Content\n as permitted by this License without incurring any payment or other\n obligation to, or otherwise violating any right of, any such person or\n entity.{\" \"}\n
\n\n \n
\n \n {status !== \"DECLINED\" && (\n
\n );\n }\n}\n\nconst mapStateToProps = ({ errors }) => ({\n validationErrors: errors.validationErrors,\n});\n\nexport default connect(mapStateToProps)(LicenseRequestReceived);\n","import React, { useState } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport {\n formatPrice,\n getLicenseDuration,\n getLicensingDuration,\n getLicensePrice,\n addDefaultSrc,\n} from \"../../../utilities\";\nimport { identifyUrl } from \"../../../Pages/Video/video_actions\";\nimport RequestMessageSent from \"./_license_request_sent\";\nimport RequestMessageReceived from \"./_license_request_received\";\nimport GenerateTiktokThumbnail from \"../../GenerateTiktokThumbnail\";\n\nexport default ({\n message,\n agreement: {\n license_agreement: {\n influencer_royalties,\n total_price,\n duration,\n purchased_at,\n },\n license_video: { _id: video_id, thumbnail_url, title, platform, video_url },\n influencer_video_note: note,\n },\n status,\n isRequester,\n user,\n acceptAgreement,\n}) => {\n const [poster, setPoster] = useState(true);\n const urlUpdate = {\n \"www.dropbox.com\": \"dl.dropboxusercontent.com\",\n \"dl=0\": \"raw=1#t=3\",\n };\n const dropboxUrl = video_url.replace(\n /\\b(?:www.dropbox.com|dl=0)\\b/gi,\n (matched) => urlUpdate[matched]\n );\n const handleUrl = (url) => {\n identifyUrl(url)\n .then((response) => {\n if (response) {\n setPoster(true);\n }\n })\n .catch((err) => {\n if (err.status === 404) {\n setPoster(false);\n }\n });\n };\n\n return (\n \n
\n )}\n {status === \"ACCEPTED\" && (\n \n {status === \"PENDING\" && (\n \n this.setState({ downloadLink: options.target.value })\n }\n noIcon\n type=\"text\"\n placeholder=\"https://\"\n error={validationErrors.downloadLink}\n />\n )}\n \n this.setState({ termsAccepted: options.target.checked })\n }\n readOnly={status === \"ACCEPTED\"}\n termsLinkText=\"Terms of the License of Creator Content\"\n >\n this.setState({ termsAccepted: true })}\n />\n \n
\n \n
\n )}\n {status === \"PENDING\" && (\n \n \n Accepted\n
\n \n {`You will be paid a total of ${formatPrice(\n royalties\n )} for your video license. We are\n currently waiving the 3% fee for all creators on the platform as our\n thank you.`}\n \n \n this.acceptAgreement(true)}\n disabled={!this.state.termsAccepted || !this.state.downloadLink}\n >\n \n Accept License Offer\n \n this.acceptAgreement(false)}\n >\n Decline offer\n \n \n If you have more questions, ask before accepting in the chat\n above.\n \n
\n )}\n {status === \"DECLINED\" && (\n \n
\n )}\n \n Declined offer\n
\n \n To potentially receive a better offer, send the brand manager a\n message above.\n \n \n \n 
addDefaultSrc(event)} />\n )}\n {video_url && platform === \"Tiktok\" && (\n
\n );\n};\n","import React from \"react\";\n\nconst Modal = ({ close, setModal, children }) => (\n \n \n
\n {isRequester ? \"License Request Sent\" : \"License Request\"}
\n\n {isRequester\n ? `${user.first_name} has received the request and should respond within 72 hours.`\n : `Congrats! ${user.first_name} ${user.last_name} wants to license your video. Please try to respond within 72 hours.`}\n
\n{message}\n \n {platform === \"Dropbox\" && video_url && (\n <>\n {handleUrl(dropboxUrl)}\n \n
\n )}\n {title}\n \n {status === \"PENDING\" ? (\n \n {`${getLicenseDuration(\n note\n )} license`}\n \n {formatPrice(getLicensePrice(note))}\n \n
\n ) : (\n \n \n {`${\n duration\n ? getLicensingDuration(duration)\n : getLicenseDuration(note)\n } license`}\n \n \n {formatPrice(influencer_royalties)}\n \n
\n )}\n {isRequester ? (\n \n \n {children}\n
\n \n);\n\nexport default Modal;\n","import React from \"react\";\nimport Modal from \"../../../Shared/Modal\";\n\nclass PaymentModal extends React.Component {\n componentDidMount() {\n const { totalLicensePrice, onApprove } = this.props;\n paypal\n .Buttons({\n style: {\n color: \"blue\",\n shape: \"pill\",\n },\n createOrder: (data, actions) =>\n actions.order.create({\n purchase_units: [\n {\n amount: {\n value: `${totalLicensePrice}`,\n },\n },\n ],\n }),\n onApprove: (data, actions) => {\n actions.order.capture().then(() => onApprove());\n },\n })\n .render(\"#paypal\");\n }\n\n setModal = (node) => (this.modal = node);\n\n render() {\n const { close, paymentPriceExplanation } = this.props;\n return (\n \n
\n Payment
\n \n {paymentPriceExplanation}\n
\n \n \n this.setState({ paymentOpen: false })}\n onApprove={this.onApprove}\n totalLicensePrice={totalLicensePrice}\n paymentPriceExplanation={paymentPriceExplanation}\n />\n )}\n
\n );\n }\n}\n\nexport default LicenseAgreementAccepted;\n","import React from \"react\";\nimport { Link } from \"react-router-dom\";\nimport { formatPrice } from \"../../../utilities\";\n\nconst PurchaserCongrats = ({ influencer, video_title }) => (\n \n Congrats!\n
\n\n {`${first_name} accepted your License Request, and has provided a\n link to the video for download `}\n
\n \n this.setState({ termsAccepted: options.target.checked })\n }\n termsLinkText=\"Terms of the License of Creator Content\"\n >\n \n this.setState({ termsAccepted: !termsAccepted })\n }\n termsAccepted={termsAccepted}\n />\n \n
\n \n this.setState({ paymentOpen: true })}\n disabled={!videoLinkReceived || !termsAccepted}\n >\n \n {purchased_at ? \"Purchased \" : \"Buy \"} License\n \n {paymentPriceExplanation}\n
\n {paymentOpen && (\n \n \n
\n);\n\nconst InfluencerCongrats = ({ user, royalties }) => (\n Thank you!
\n{`You now own the license for ${influencer.author_name}'s video, \"${video_title}\"`}
\n\n ![](\"assets/paypal-email-screenshot.png\")
\n
\n);\n\nconst LicenseAgreementPurchased = (props) =>\n props.isPurchaser ? (\n \n \n
\n Congrats!
\n\n {`${user.first_name} ${\n user.company_name && `from ${user.company_name} `\n }licensed your video`}\n
\n{`You will receive ${formatPrice(royalties)} in royalites.`}
\n\n \n
\n \n Please make sure that your PayPal account email address for payment\n processing is entered on your profile\n {\" in order to receive your payment.\"}\n \n Important, please read
\n\n \n
\n \n );\n }\n\n return (\n \n
\n \n \n
\n \n
\n );\n};\n\nChatDetail.defaultProps = {};\n\nChatDetail.propTypes = {};\n\nconst mapStateToProps = ({\n navbarStatsReducer: { current_user, influencer: currentInfluencer },\n // channels,\n messages,\n recipients,\n influencerNotes: notes,\n messagesFetchedForChannel,\n newChatRecipient,\n licenseRequestVideo,\n}) => ({\n currentUser: current_user,\n currentInfluencer,\n // channels,\n messages,\n recipients,\n notes,\n messagesFetchedForChannel,\n newChatRecipient,\n licenseRequestVideo,\n});\n\nexport default connect(mapStateToProps)(ChatDetail);\n","import { useState } from \"react\";\nimport { useMutation, useQuery } from \"@apollo/client\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport Tooltip from \"react-tooltip-lite\";\nimport moment from \"moment\";\n\nimport { ChevronLeft, ChevronRight } from \"react-feather\";\nimport { updateAskVyrillState } from \"../Actions\";\nimport {\n CREATE_CONVERSATION_MUTATION,\n GET_MESSAGES_QUERY,\n UPDATE_CONVERSATION_MUTATION,\n} from \"../../../Queries/ask-vyrill\";\nimport { HistoryIcon } from \"../../../Shared/SVGs/HistoryIcon\";\nimport HistoryAction from \"./HistoryAction\";\n\nfunction TimeAgo({ datetime }) {\n const formattedDate = moment(datetime).fromNow();\n return \n
\n \n \n
\n \n
\n \n {influencer && influencer._id && (\n
\n \n \n View Creator Profile\n \n
\n )}\n {licenseRequestVideo._id ? (\n \n \n \n \n
\n )}\n \n \n Send message\n \n
\n \n {messages &&\n messages.length > 0 &&\n messages.map(\n ({ entry: { message, publisher, meta }, timetoken }, index) =>\n meta ? (\n \n
\n {message}\n \n )\n )}\n {formattedDate}
;\n}\n\nconst ConversationHistory = ({ isHistoryOpen, setIsHistoryOpen }) => {\n const [isEdit, setIsEdit] = useState({\n id: \"\",\n value: \"\",\n });\n const allConversations = useSelector(\n (state) => state.askVyrill?.allConversations\n );\n const conversationId = useSelector(\n (state) => state.askVyrill?.conversationId\n );\n const currentBrandId = useSelector(\n (state) => state.navbarStatsReducer.currentBrand._id\n );\n const dispatch = useDispatch();\n const [createConversation, { data, loading: newConversationLoading, error }] =\n useMutation(CREATE_CONVERSATION_MUTATION);\n const {\n loading,\n error: messagesError,\n data: messagesData,\n refetch: refetchMessages,\n } = useQuery(GET_MESSAGES_QUERY, {\n skip: true,\n });\n const handleConversation = (id) => {\n dispatch(\n updateAskVyrillState({\n messages: [],\n conversationId: id,\n askVyrillError:false,\n askVyrillTimoutError:false\n })\n );\n\n refetchMessages({\n conversationId: id,\n }).then((res) => {\n const sortedData = (res?.data?.getMessages || []).slice().reverse();\n dispatch(\n updateAskVyrillState({\n messages: sortedData,\n })\n );\n });\n // dispatch(\n // updateAskVyrillState({\n // messages: [],\n // messagesLoading: true,\n // conversationId: id,\n // loadFromHistory: true,\n // })\n // );\n };\n\n const handleNewConversation = async () => {\n // Clear existing messages\n dispatch(\n updateAskVyrillState({\n messages: [],\n conversationId: \"\",\n selectedPrompt: \"\",\n isNewChat: true,\n askVyrillError:false,\n askVyrillTimoutError:false\n // allConversations: [newChat, ...allConversations],\n })\n );\n\n try {\n const { data } = await createConversation({\n variables: { brandId: currentBrandId },\n });\n if (data.createConversation) {\n dispatch(\n updateAskVyrillState({\n conversationId: data.createConversation._id,\n })\n );\n }\n } catch (err) {\n // Handle errors\n console.error(err);\n }\n };\n\n const [updateTitle, { data: updateConversation }] = useMutation(\n UPDATE_CONVERSATION_MUTATION,\n {\n variables: {\n conversationId: isEdit.id,\n title: isEdit.value,\n },\n onCompleted: ({ updateConversation }) => {\n const updatedArray = allConversations.map((obj) => {\n if (obj?._id === updateConversation?._id) {\n return updateConversation; // Replaced with the new object\n } else {\n return obj; // Keep the original object\n }\n });\n\n dispatch(\n updateAskVyrillState({\n allConversations: updatedArray,\n })\n );\n setIsEdit({ id: \"\", value: \"\" });\n },\n onError: (error) => {\n console.error(\"Mutation error:\", error);\n },\n }\n );\n\n const handleEdit = () => {\n updateTitle();\n };\n\n return isHistoryOpen ? (\n \n
\n );\n })}\n \n\n \n
\n \n
\n\n \n setIsHistoryOpen(!isHistoryOpen)}>\n
\n \n {allConversations?.map((k, index) => {\n return (\n
\n \n handleConversation(k._id)}\n >\n {k.title}\n
\n \n )}\n {/*for 14 inch */}\n \n
\n\n \n {isEdit.id === k._id ? (\n {\n setIsEdit({ ...isEdit, value: e.target.value });\n }}\n />\n ) : (\n handleConversation(k._id)}\n >\n \n
\n }\n id={index}\n direction=\"left\"\n className=\"customTip\"\n >\n \n
\n \n ) : (\n \n \n New Chat\n \n
\n \n
\n\n Based on the videos captured in
\n \n
\n {askVyrillDuration?.value === \"custom\" && \n Videos - {videosCount}\n
\n \n {} : handleCopyClick}\n >\n {copied ? \"Copied\" : \"Copy\"}\n \n \n {} : emailHandler}\n />\n \n \n \n \n \n\n \n {} : handleRegenerate\n }\n role=\"button\"\n >\n \n
\n \n );\n};\nexport default ChatBoxHeader;\n","export const DeleteIcon = () => {\n return (\n \n
\n \n {capitalize(k?.content)}\n
\n \n Date range -{\" \"}\n {k?.duration === \"all_dates\"\n ? \"All dates\"\n : k?.duration === \"custom\"\n ? `${custom_start_date_format} - ${custom_end_date_format}`\n : `${start_date} - ${end_date}`}\n
\n \n handleLikeClick(k.like == 1 ? 0 : 1)}\n role=\"button\"\n >\n handleLikeClick(k.like == -1 ? 0 : -1)}\n role=\"button\"\n >\n
\n \n );\n};\n\nexport default QuestionRow;\n","import { useDispatch } from \"react-redux\";\nimport { updateTranscriptModalState } from \"../../../Shared/PopUpModals/Actions\";\nimport { fetchTranscript } from \"../../Video/VideoActions\";\nimport { formatTime, timeInSeconds } from \"../../../utilities\";\n\nconst SupportingData = ({ data }) => {\n const dispatch = useDispatch();\n\n const renderSupportingData = (supportingData) => {\n return supportingData?.map((item, index) => {\n const {\n _id,\n thumbnail_url,\n db_id,\n start_ts,\n source_doc,\n source_doc_type,\n } = item;\n return db_id ? (\n \n
\n ) : null;\n });\n };\n\n if (data?.supporting_data) {\n return renderSupportingData(data?.supporting_data);\n } else null;\n};\n\nconst AnswerRow = ({ k }) => {\n return (\n \n {\n dispatch(fetchTranscript([db_id]));\n dispatch(\n updateTranscriptModalState({\n videoId: db_id,\n shouldOpen: true,\n videoStartAt: timeInSeconds(formatTime(start_ts)),\n pinTime: formatTime(start_ts),\n pinSentence: source_doc,\n })\n );\n }}\n />\n
\n {formatTime(start_ts)}
\n \n {source_doc?.split(\"\\n\").map((line, index) => (\n
\n {line}
\n ))}\n\n
\n );\n};\nexport default AnswerRow;\n","export const AskVyrillError = () => {\n const SummaryError =\n require(\"@src/assets/images/vyrill/videos/SummaryError.png\").default;\n return (\n \n
\n \n {/*
\n {k?.content}
*/}\n \n {k?.content?.split(\"\\n\").map((line, index) => (\n {line}\n ))}\n
\n \n 
\n
\n );\n};\n\nexport const AskVyrillTimeOutError = () => {\n const timeoutError =\n require(\"@src/assets/images/vyrill/timeout_error.png\").default;\n\n return (\n \n We apologize, but an error has occurred on our end!\n
\n \n We are looking into it. Please start a new session.{\" \"}\n
\n \n 
\n
\n );\n};\n","import { useEffect, useRef, useState } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { useMutation, useQuery } from \"@apollo/client\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Margin, Resolution, usePDF } from \"react-to-pdf\";\n\nimport {\n ASK_VYRILL_QUERY,\n GET_CONVERSATIONS,\n CREATE_CONVERSATION_MUTATION,\n} from \"../../Queries/ask-vyrill\";\nimport { RESET_ASK_VYRILL_STATE, updateAskVyrillState } from \"./Actions\";\nimport { usePrevious } from \"../../Shared/CustomHooks\";\n\nimport LoadingDots from \"../Home/components/HomePageLoading/LoadingDots\";\nimport ConversationHistory from \"./Components/ConversationHistory\";\nimport SuggestedPrompts from \"./Components/SuggestedPrompts\";\nimport ChatBoxHeader from \"./Components/ChatBoxHeader\";\nimport AskBarSearch from \"./Components/AskBarSearch\";\nimport QuestionRow from \"./Components/QuestionRow\";\nimport AnswerRow from \"./Components/AnswerRow\";\nimport \"./styles/AskVyrill.scss\";\nimport {\n AskVyrillError,\n AskVyrillTimeOutError,\n} from \"./Components/AskVyrillError\";\nimport moment from \"moment\";\n\nconst createConversation = (brandId, createConversationMutation) => {\n return createConversationMutation({\n variables: {\n brandId,\n },\n });\n};\n\nconst AskVyrillChat = () => {\n const [isHistoryOpen, setIsHistoryOpen] = useState(true);\n\n const messages = useSelector((state) => state.askVyrill.messages);\n\n const askVyrillDuration = useSelector(\n (state) => state.askVyrill.askVyrillDuration\n );\n const custom_start_date = useSelector(\n (state) => state.askVyrill.custom_start_date\n );\n const custom_end_date = useSelector(\n (state) => state.askVyrill.custom_end_date\n );\n const custom_start_date_string = custom_start_date\n ? moment(custom_start_date).toISOString()\n : \"\";\n const custom_end_date_string = custom_end_date\n ? moment(custom_end_date).toISOString()\n : \"\";\n const selectedPrompt = useSelector((state) => state.askVyrill.selectedPrompt);\n\n const currentBrandId = useSelector(\n (state) => state.navbarStatsReducer.currentBrand._id\n );\n\n const messagesLoading = useSelector(\n (state) => state.askVyrill.messagesLoading\n );\n const askVyrillError = useSelector((state) => state.askVyrill.askVyrillError);\n const loadFromHistory = useSelector(\n (state) => state.askVyrill.loadFromHistory\n );\n const askVyrillTimoutError = useSelector(\n (state) => state.askVyrill.askVyrillTimoutError\n );\n\n const dispatch = useDispatch();\n const messagesEndRef = useRef(null);\n const navigate = useNavigate();\n const previousBrand = usePrevious(currentBrandId);\n\n const [\n createConversationMutation, // { data: createConversationData, loading: createConversationLoading, error },\n ] = useMutation(CREATE_CONVERSATION_MUTATION);\n\n const {\n // loading: askVyrillLoading,\n // error: askVyrillError,\n // data: askVyrillData,\n refetch: refetchAskVyrill,\n } = useQuery(ASK_VYRILL_QUERY, {\n skip: true || !currentBrandId,\n onError: (error) => {\n // Handle the error here\n dispatch(\n updateAskVyrillState({\n askVyrillTimoutError: true,\n messagesLoading: false,\n })\n );\n },\n });\n\n const {\n // loading: conversationLoading,\n // error: conversationError,\n // data: conversationData,\n refetch: refetchConversation,\n } = useQuery(GET_CONVERSATIONS, {\n variables: { brandId: currentBrandId },\n skip: true,\n });\n\n useEffect(() => {\n if (currentBrandId && selectedPrompt) {\n dispatch(\n updateAskVyrillState({\n // conversationId: result?.data?.createConversation?._id,\n askVyrillError: false,\n askVyrillTimoutError: false,\n })\n );\n createConversation(currentBrandId, createConversationMutation)\n .then((result) => {\n dispatch(\n updateAskVyrillState({\n conversationId: result?.data?.createConversation?._id,\n messagesLoading: true,\n })\n );\n\n // Call ask-vyrill after creating conversation\n refetchAskVyrill({\n brandId: currentBrandId,\n conversationId: result?.data?.createConversation?._id,\n duration: askVyrillDuration?.value,\n ...(askVyrillDuration?.value === \"custom\" &&\n custom_start_date_string &&\n custom_end_date_string\n ? {\n start_date: custom_start_date_string,\n end_date: custom_end_date_string,\n }\n : {}),\n content: selectedPrompt,\n role: \"user\",\n }).then((result) => {\n if (!result?.data?.askVyrill) {\n dispatch(\n updateAskVyrillState({\n askVyrillError: true,\n messagesLoading: false,\n })\n );\n } else {\n // Fetching all conversation after creating new\n refetchConversation().then((result) => {\n dispatch(\n updateAskVyrillState({\n allConversations: result?.data?.getConversations,\n })\n );\n });\n\n const copyMessages = [...messages];\n const message = copyMessages[copyMessages.length - 1];\n message._id = result?.data?.askVyrill?.question_id || \"\"; //Assigning id to first message\n message.conversation_id =\n result?.data?.askVyrill?.conversation_id || \"\"; //Assigning id to first message\n dispatch(\n updateAskVyrillState({\n messages: [...copyMessages, result?.data?.askVyrill],\n messagesLoading: false,\n isFirstPrompt: false,\n })\n );\n }\n });\n })\n .catch((error) => {\n console.error(\"Error in createConversation request:\", error);\n });\n } else if (loadFromHistory) {\n // console.log('loadFromHistory')\n } else {\n navigate(\"/home\");\n }\n }, []);\n\n const handleNavigation = () => {\n navigate(\"/home\");\n // Set default states\n dispatch({ type: RESET_ASK_VYRILL_STATE });\n dispatch(\n updateAskVyrillState({\n askVyrillError: false,\n messagesLoading: false,\n askVyrillTimoutError: false,\n })\n );\n };\n\n // TODO:for developments\n // useEffect(() => {\n // if(currentBrandId){\n\n // refetchConversation().then((result) => {\n // dispatch(\n // updateAskVyrillState({\n // allConversations: result?.data?.getConversations,\n // })\n // );\n // });\n // }\n // }, [currentBrandId]);\n\n useEffect(() => {\n if (currentBrandId && previousBrand && currentBrandId !== previousBrand) {\n handleNavigation();\n }\n }, [currentBrandId]);\n\n const scrollToBottom = () => {\n messagesEndRef.current?.scrollIntoView({ behavior: \"smooth\" });\n };\n\n useEffect(() => {\n scrollToBottom();\n }, [messages]);\n\n // const handlePrint = useReactToPrint({ content: () => printRef.current });\n\n const { toPDF, targetRef } = usePDF({\n filename: \"vyrill.pdf\",\n page: { margin: Margin.MEDIUM },\n resolution: Resolution.HIGH,\n\n canvas: {\n // default is 'image/jpeg' for better size performance\n // mimeType: 'image/jpeg',\n qualityRatio: 1,\n },\n });\n\n return (\n \n We are sorry, this session has timed out!\n
\n Please start a new session by typing in the Ask Vyrill bar below.
\n \n
\n \n \n
\n \n
\n \n
\n \n
\n \n
\n \n \n \n
\n\n \n {messages?.map((k, index) => {\n return (\n
\n {messagesLoading && (\n \n {k?.role === \"user\" &&
\n );\n })}\n {askVyrillError && \n
\n )}\n \n \n
\n \n \n This feature is under{\" \"}\n Beta testing\n and may provide inaccurate answers. It is still\n undergoing final testing before its official release.{\" \"}\n \n
\n \n {\" \"}\n {\n handleNavigation();\n }}\n />\n
\n \n );\n};\nexport default AskVyrillChat;\n","import { Button, Modal } from \"reactstrap\";\nimport { useState } from \"react\";\nimport { modalCrossIcon } from \"../../../Shared/SVGs/Shared\";\nimport { useSelector } from \"react-redux\";\n\nconst FormStepsModal = ({ step, content, style }) => {\n const lastStepShownKey = \"campaignModals\";\n const lastStepShown = parseInt(localStorage.getItem(lastStepShownKey), 10);\n const [open, setOpen] = useState(\n lastStepShown < step || isNaN(lastStepShown)\n );\n const [secondModalOpen, setSecondModalOpen] = useState(false);\n\n const toggle = () => {\n setOpen(!open);\n if (open && (lastStepShown < step || isNaN(lastStepShown))) {\n localStorage.setItem(lastStepShownKey, step.toString());\n }\n };\n\n const handleNextClick = () => {\n setSecondModalOpen(true);\n window.scrollTo(0, 300);\n };\n const showCampaignStep = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignStep\n );\n\n return (\n <>\n \n {!showCampaignStep && (\n <>\n
\n {!showCampaignStep && {step} of 5
\n {modalCrossIcon}
\n \n )}\n {showCampaignStep && {modalCrossIcon}
}\n Step {step}
}\n{content}
\n {step === 3 && (\n \n {\n handleNextClick();\n toggle();\n }}\n >\n Next\n \n
\n )}\n \n\n {step === 3 && (\n \n
\n {step} of 5
\n setSecondModalOpen(false)}>\n {modalCrossIcon}\n
\n Step {step}
\n\n Please review the Terms & Conditions before completing your campaign\n setup. You have the option to utilize the{\" \"}\n default Vyrill Terms & Conditions or customize your own.\n
\n \n )}\n \n );\n};\n\nexport default FormStepsModal;\n","export const fieldStyles = {\n control: (provided, state) => ({\n ...provided,\n borderColor: \"#C7C6C6\",\n minHeight: \"50px\",\n boxShadow: null,\n borderRadius: \"10px\",\n \"&:hover\": {\n borderColor: \"#C4C4C4\",\n },\n }),\n\n valueContainer: (provided) => ({\n ...provided,\n }),\n\n multiValue: (styles, { data }) => {\n return {\n ...styles,\n backgroundColor: \"#D9D9D9\",\n borderRadius: \"6px\",\n marginRight: \"1px\",\n };\n },\n multiValueLabel: (styles, { data }) => ({\n ...styles,\n }),\n\n option: (styles, { data, isDisabled, isFocused, isSelected }) => {\n return {\n ...styles,\n color: \"black\",\n backgroundColor: \"white\",\n };\n },\n};\n","import React, { useEffect, useState } from \"react\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { Button, Col, FormGroup, Input, Label, Row } from \"reactstrap\";\n\nimport CreatableSelect from \"react-select/creatable\";\nimport FormStepsModal from \"./FormStepsModal\";\nimport Cookies from \"js-cookie\";\n\nimport { fetchAutoCompleteProductOrHashtagList } from \"../../Product/productActions\";\nimport { updateCampaignFields, updateCampaignState } from \"../CampaignActions\";\nimport { uploadLogo, plusIcon } from \"../../../Shared/SVGs/Shared\";\nimport { fieldStyles } from \"./fieldStyle\";\n\nconst Step1 = ({}) => {\n const [menuIsOpen, setMenuIsOpen] = useState(false); //TODO:\n\n const activeStep = useSelector((state) => state.campaign_states.activeStep);\n const form = useSelector((state) => state.campaign_states.form);\n const currentBrand = useSelector(\n (state) => state.navbarStatsReducer.currentBrand.name\n );\n const navbarStatsReducer = useSelector((state) => state.navbarStatsReducer);\n\n const productsList = useSelector(\n (state) => state.autoCompleteProductOrHashtagList.data\n );\n\n const dispatch = useDispatch();\n const sortedProductsList = productsList?.sort((a, b) =>\n a?.name?.localeCompare(b?.name)\n );\n const AddNewProduct = () => (\n setMenuIsOpen(false)} className=\"add-new-product\">\n Add a new Product {plusIcon}\n
\n );\n const options = [\n { label: \n {form.campaign_brand_image_preview ? (\n
\n {form.campaign_brand_image_preview ? null : (\n \n )}\n \n );\n const filePicker = (\n \n \n \n \n dispatch(\n updateCampaignFields({ campaign_headline: e.target.value })\n )\n }\n />\n \n \n \n \n dispatch(\n updateCampaignFields({ campaign_hashtag: e.target.value })\n )\n }\n />\n \n \n \n \n \n dispatch(\n updateCampaignFields({\n campaign_brand_name: e.target.value,\n })\n )\n }\n />\n \n \n {filePicker}\n \n document.getElementById(\"logo-upload-input\")?.click()\n }\n >\n {uploadlogo}\n \n
\n\n \n \n \n\n \n
\n \n \n null,\n IndicatorSeparator: () => null,\n }}\n onMenuOpen={() => setMenuIsOpen(true)}\n onMenuClose={() => setMenuIsOpen(false)}\n />\n
\n \n \n \n handleCheckboxChange(\n form.campaign_allow_rating === true ? false : true\n )\n }\n />\n Yes\n \n handleCheckboxChange(\n form.campaign_allow_rating === false ? true : false\n )\n }\n />\n No\n
\n \n Rate this Product / Brand\n
\n \n \n dispatch(updateCampaignState({ activeStep: activeStep + 1 }))\n }\n disabled={isNextButtonDisabled}\n style={{ background: isNextButtonDisabled ? \"#C4C4C4\" : \"\" }}\n >\n Next\n \n
\n \n \n );\n};\n\nexport default Step1;\n","import React from \"react\";\n\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { dot, editIcon } from \"../../../Shared/SVGs/Shared\";\n\nconst line = ;\n\nconst StepIndecator = ({ editHandler, editable }) => {\n const activeStep = useSelector((state) => state.campaign_states.activeStep);\n const totalSteps = useSelector((state) => state.campaign_states.totalSteps);\n const dispatch = useDispatch();\n const showCampaignStep = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignStep\n );\n\n return (\n \n {/*
\n \n )}\n \n );\n};\n\nexport default StepIndecator;\n","import { Modal, Button, Spinner } from \"reactstrap\";\n\nconst crossIcon = (\n */}\n {!showCampaignStep && (\n \n {[...Array(totalSteps)].map((_, index) => (\n \n {index > 0 && line}\n {index < activeStep ? : dot}\n \n ))}\n
\n )}\n\n {activeStep !== 5 && (\n \n
\n\n \n
\n \n
\n \n {\" \"}\n \n
\n {activeStep === 4 && (\n \n {activeStep === 4 ? (\n
\n ) : (\n \"Campaign Details\"\n )}\n \n Campaign Details - Mobile Preview\n \n As participants will view the campaign in their mobile\n phone\n
\n \n {editable ? (\n
\n )}\n Save
\n ) : (\n {!showCampaignStep && editIcon}
\n )}\n \n {activeStep !== 4 &&\n \"The details you enter here will be visible to the public once the campaign is launched.\"}\n
\n\n
\n \n Would you like to finish your campaign later?\n
\n \n \n Discard\n \n \n Save as draft {loading &&
\n \n
\n \n {/* {activeStep === 5 && (\n
\n \n
\n {activeStep !== 5 && (\n \n {activeStep !== 5 ? (\n \n Your \"{campaign_response?.name}\"{\" \"}\n campaign has been saved to the Drafts tab in the Campaign folder\n \n ) : (\n \n {\" \"}\n Your campaign has been saved in the Campaigns folder! Click on{\" \"}\n \n Active Campaigns{\" \"}\n \n to see the{\" \"}\n \"{campaign_response?.name}\" campaign\n \n )}\n
\n \n Go to Drafts\n
\n \n )}\n {activeStep === 5 && (\n {homeIcon}
\n \n Return to Home\n
\n \n )}\n \n \n );\n};\n\nexport default DraftModal;\n","import { useSelector, useDispatch } from \"react-redux\";\nimport { useNavigate } from \"react-router-dom\";\nimport { backIcon, crossIcon, dot } from \"../../../Shared/SVGs/Shared\";\nimport { updateCampaignFields, updateCampaignState } from \"../CampaignActions\";\nimport ReloadConfirmationModal from \"./ReloadConfirmationModal\";\nimport { useState } from \"react\";\nimport DraftModal from \"./DraftModal\";\nimport gql from \"graphql-tag\";\nimport { useMutation, useQuery } from \"@apollo/client\";\nimport moment from \"moment\";\nimport Cookies from \"js-cookie\";\nimport { removeQueryParams } from \"../../../utilities\";\nimport { updateModalState } from \"../../Dashborad/Actions\";\nimport { convertToRaw } from \"draft-js\";\nimport {\n updateParams,\n updateVideoPageState,\n updateCampaignState as videoUpdateCampaignState,\n} from \"../../Video/VideoActions\";\n\nconst CREATE_CAMPAIGN_MUTATION = gql`\n mutation MyMutation($campaign: clipupInput!) {\n createCampaign(campaign: $campaign) {\n _id\n logo_url\n name\n hash_tag\n banner_url\n manufacturer {\n _id\n name\n }\n products {\n _id\n name\n }\n }\n }\n`;\n\nconst GET_PRESIGNED_URL = gql`\n query GetPresignedURL($fileName: String!) {\n getPresignedURL(fileName: $fileName)\n }\n`;\n\nconst StepsButton = ({ qrcode, setQrcode }) => {\n const [loading, setLoading] = useState(false);\n const [showModal, setShowModal] = useState(false);\n const [draftModal, setDraftModal] = useState(false);\n const activeStep = useSelector((state) => state.campaign_states.activeStep);\n\n const form = useSelector((state) => state.campaign_states.form);\n // console.log(form);\n\n const dispatch = useDispatch();\n const navigate = useNavigate();\n const navigateHome = () => {\n setShowModal(false);\n navigate(\"/\");\n dispatch(updateCampaignState({ activeStep: 1 }));\n dispatch(\n updateCampaignFields({\n campaign_headline: \"\",\n campaign_hashtag: \"\",\n campaign_brand_name: \"\",\n campaign_product: \"\",\n campaign_banner_image: \"\",\n campaign_banner_image_file: null,\n productimageURL: \"\",\n campaign_brand_image_preview: \"\",\n campaign_banner_image_preview: \"\",\n campaign_brand_image: \"\",\n campaign_description: \"\",\n campaign_reward: \"\",\n end_date: null,\n time: \"\",\n start_date: moment(),\n start_time: \"\",\n end_time: \"\",\n campaign_timezone: \"GMT-07:00 (Pacific Daylight Time)\",\n currentTime: \"\",\n campaign_reward_type: \"\",\n ongoing: false,\n products: [],\n campaign_video_limit: 200,\n campaign_video_length: \"\",\n campaign_allow_rating: false,\n banner_with_qr: \"\",\n terms_and_conditions: \"\",\n image_dimensions: \"Fit\",\n description_editor_state: null,\n terms_and_conditions_editor_state: null,\n })\n );\n };\n const cancelReload = () => {\n setShowModal(false);\n };\n const showCampaignStep = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignStep\n );\n const campaignId = useSelector(\n (state) => state.videoPageStates.campaignsState.campaignId\n );\n const openModal = () => {\n if (activeStep === 5 || (activeStep === 4 && showCampaignStep)) {\n if (showCampaignStep) {\n dispatch(\n updateCampaignFields({\n banner_share_url: \"\",\n banner_with_qr: \"\",\n })\n );\n navigate(`/videos/campaigns/${campaignId}`);\n dispatch(\n updateCampaignFields({\n campaign_headline: \"\",\n campaign_hashtag: \"\",\n campaign_brand_name: \"\",\n campaign_product: \"\",\n campaign_banner_image: \"\",\n campaign_banner_image_file: null,\n productimageURL: \"\",\n campaign_brand_image_preview: \"\",\n campaign_banner_image_preview: \"\",\n campaign_brand_image: \"\",\n campaign_description: \"\",\n brand_instruction: \"\",\n campaign_reward: \"\",\n end_date: null,\n time: \"\",\n start_date: moment(),\n start_time: \"\",\n end_time: \"\",\n campaign_timezone: \"GMT-07:00 (Pacific Daylight Time)\",\n currentTime: \"\",\n campaign_reward_type: \"\",\n ongoing: false,\n products: [],\n campaign_video_limit: 200,\n campaign_video_length: \"\",\n campaign_allow_rating: false,\n banner_with_qr: \"\",\n banner_share_url: \"\",\n terms_and_conditions: \"\",\n image_dimensions: \"Fit\",\n description_editor_state: null,\n description_editor_state: null,\n brand_instruction_editor_state: null,\n hashtag_editor_state: null,\n campaign_hashtag_editor: \"\",\n preview_color_change: \"#526261\",\n color_change_hashtag: \"#FC80BB\",\n headline_editor_state: null,\n campaign_headline_editor: \"\",\n terms_and_conditions_editor_state: null,\n campaign_video_length_type: \"\",\n campaign_button_color: \"#96C392\",\n campaign_button_text_color: \"white\",\n campaign_upload_platform: [],\n })\n );\n } else {\n setDraftModal(true);\n }\n } else {\n setShowModal(true);\n }\n };\n\n const [createCampaign] = useMutation(CREATE_CAMPAIGN_MUTATION);\n const { refetch } = useQuery(GET_PRESIGNED_URL, {\n skip: true,\n });\n\n const handleSubmit = async () => {\n setLoading(true);\n const {\n campaign_headline,\n campaign_hashtag,\n campaign_brand_name,\n campaign_brand_image,\n campaign_reward,\n start_date,\n end_date,\n start_time,\n end_time,\n campaign_timezone,\n products,\n ongoing,\n campaign_video_limit,\n campaign_allow_rating,\n campaign_video_length,\n terms_and_conditions,\n campaign_description,\n campaign_reward_type,\n campaign_banner_image_file,\n campaign_banner_image_preview,\n image_dimensions,\n description_editor_state,\n terms_and_conditions_editor_state,\n brand_instruction,\n brand_instruction_editor_state,\n campaign_video_length_type,\n campaign_headline_editor,\n campaign_hashtag_editor,\n headline_editor_state,\n hashtag_editor_state,\n preview_color_change,\n campaign_button_color,\n campaign_button_text_color,\n campaign_upload_platform,\n } = form;\n try {\n let serializedContentDesc = null;\n let serializedContentBrand = null;\n let serializedContentHashtag = null;\n let serializedContentHeadline = null;\n let serializedContentTerm = null;\n\n if (description_editor_state) {\n const rawContentStateDesc = convertToRaw(\n description_editor_state.getCurrentContent()\n );\n serializedContentDesc = JSON.stringify(rawContentStateDesc);\n }\n\n if (headline_editor_state) {\n const rawContentStateHead = convertToRaw(\n headline_editor_state.getCurrentContent()\n );\n serializedContentHeadline = JSON.stringify(rawContentStateHead);\n }\n\n if (hashtag_editor_state) {\n const rawContentStateHash = convertToRaw(\n hashtag_editor_state.getCurrentContent()\n );\n serializedContentHashtag = JSON.stringify(rawContentStateHash);\n }\n\n if (brand_instruction_editor_state) {\n const rawContentStateBrand = convertToRaw(\n brand_instruction_editor_state.getCurrentContent()\n );\n serializedContentBrand = JSON.stringify(rawContentStateBrand);\n }\n\n if (terms_and_conditions_editor_state) {\n const rawContentStateTerm = convertToRaw(\n terms_and_conditions_editor_state.getCurrentContent()\n );\n serializedContentTerm = JSON.stringify(rawContentStateTerm);\n }\n const newProducts = products\n ?.filter((product) => product?.__isNew__)\n .map((product) => product?.label);\n\n const formattedStartTime = start_time && start_time?.format(\"HH:mm\");\n const formattedEndTime = end_time && end_time?.format(\"HH:mm\");\n\n const formattedStartDate = moment(start_date)?.set({\n hour: start_time && start_time?.hour(),\n minute: start_time && start_time?.minute(),\n });\n\n const formattedEndDate = ongoing\n ? false\n : moment(end_date)?.set({\n hour: end_time && end_time?.hour(),\n minute: end_time && end_time?.minute(),\n });\n\n let campaignBannerImage = campaign_banner_image_preview || \"\";\n\n if (campaign_banner_image_file) {\n const { data: urlData } = await refetch({\n fileName: campaign_banner_image_file.name,\n });\n\n const uploadImageResponse = await fetch(urlData.getPresignedURL, {\n method: \"PUT\",\n headers: {\n \"Content-Type\": campaign_banner_image_file.type,\n },\n body: campaign_banner_image_file,\n });\n\n if (!uploadImageResponse.ok) {\n setLoading(false);\n throw new Error(\"Failed to upload image\");\n }\n\n campaignBannerImage = removeQueryParams(urlData.getPresignedURL);\n }\n\n const campaignData = {\n description_editor_state: serializedContentDesc,\n brand_instruction_editor_state: serializedContentBrand,\n headline_editor_state: serializedContentHeadline,\n hashtag_editor_state: serializedContentHashtag,\n terms_and_conditions_editor_state: serializedContentTerm,\n status: \"draft\",\n campaign_banner_image: campaignBannerImage,\n campaign_hashtag,\n campaign_brand_image,\n campaign_brand_name,\n campaign_description,\n campaign_upload_platform,\n brand_instruction,\n campaign_headline_editor,\n campaign_hashtag_editor,\n campaign_headline,\n preview_color_change,\n campaign_button_color,\n campaign_button_text_color,\n campaign_product: \"campaign_product\",\n campaign_reward,\n campaign_reward_type,\n campaign_timezone,\n manufacturer: {\n _id: Cookies.get(\"bId\"),\n name: campaign_brand_name,\n },\n products: products\n ?.filter((product) => !product?.__isNew__)\n .map((product) => ({\n _id: product?.value,\n name: product?.label,\n })),\n ...(newProducts?.length > 0 && { newProducts }),\n start_date: formattedStartDate,\n start_time: formattedStartTime,\n ...(ongoing ? {} : { end_date: formattedEndDate }),\n ongoing,\n end_time: formattedEndTime,\n terms_and_conditions,\n ...(campaign_video_limit > 0 && { campaign_video_limit }),\n campaign_allow_rating,\n campaign_video_time_limit: `${campaign_video_length}`,\n campaign_video_length_type,\n descriptionRenderAs: \"html\",\n termAndConditionRenderAs: \"html\",\n bannerRenderAs: image_dimensions,\n };\n\n const { data: response } = await createCampaign({\n variables: { campaign: campaignData },\n });\n\n if (response) {\n setLoading(false);\n setShowModal(false);\n setDraftModal(true);\n dispatch(\n updateCampaignState({ campaign_response: response.createCampaign })\n );\n }\n } catch (error) {\n setLoading(false);\n console.error(error);\n }\n };\n\n return (\n \n setDraftModal(false)} />\n {\n if (activeStep === 1) {\n navigate(\"/\");\n dispatch(updateModalState(true));\n }\n if (activeStep === 5 && qrcode) {\n setQrcode(false);\n } else {\n dispatch(updateCampaignState({ activeStep: activeStep - 1 }));\n }\n }}\n >\n {activeStep === 5 && qrcode ? (\n <>\n {\" \"}\n
\n\n {backIcon}
Back
\n \n ) : (\n <>\n {\" \"}\n {activeStep !== 5 && activeStep !== 4 && (\n <>\n{backIcon}
Back
\n \n )}\n \n )}\n\n
\n \n Ongoing
\n {watchIcon}
\n \n
\n \n {!form.end_date ? (\n
\n );\n const selectOption = (\n \n
\n )}\n \n {form.end_date ? (\n
\n );\n\n const isNextButtonDisabled =\n !form.campaign_description ||\n form.campaign_description === \"\\n\" ||\n !form.start_date ||\n videoTimeError ||\n (!form.ongoing && (!form.end_date || !form.end_time)) ||\n (!form.ongoing && !form.end_time) ||\n (form.ongoing && !form.start_time);\n\n const timezone = timezones.map((option, i) => {\n if (form.campaign_timezone === option.value) {\n return (\n \n {CalendarIcon}\n {formattedEndDate}\n
\n ) : form.ongoing ? (\n \n
\n ) : (\n {form.ongoing ? \"Ongoing\" : \"\"}
\n {watchIcon}
\n \n
\n )}\n Select
\n{dropdownIcon}
\n\n {option.label}\n
\n{dropdownIcon}
\n \n );\n }\n });\n\n const style = {\n background: \"#fff\",\n color: \"black\",\n width: \"233px\",\n height: \"50px\",\n borderBottom: \"1px solid #c4c4c4\",\n };\n\n const rewardDropdown = (\n\n
\n \n Cash
\n $$
\n \n
\n \n Discount
\n %
\n \n
\n \n Other
\n ...
\n sec
\n min
\n hr
\n \n {form.campaign_reward_type ? (\n form.campaign_reward_type\n ) : (\n Select the type of reward\n )}\n
\n{dropdownIcon}
\n \n );\n const timeDurationType = (\n\n
\n );\n\n const selectedrewardinput = (\n \n {campaign_video_length_type ? (\n campaign_video_length_type\n ) : (\n Select\n )}\n
\n{dropdownIcon}
\n\n {\n dispatch(updateCampaignFields({ campaign_reward: e.target.value }));\n }}\n />\n )}\n
\n );\n\n const handleContentStateChange = (contentState) => {\n dispatch(\n updateCampaignFields({ campaign_description: draftToHtml(contentState) })\n );\n };\n const handleBrandContentStateChange = (contentState) => {\n dispatch(\n updateCampaignFields({ brand_instruction: draftToHtml(contentState) })\n );\n };\n\n const handleEditorStateChange = (editorState) => {\n dispatch(updateCampaignFields({ description_editor_state: editorState }));\n };\n\n const handleBrandEditorStateChange = (editorState) => {\n dispatch(\n updateCampaignFields({ brand_instruction_editor_state: editorState })\n );\n };\n const handlePlatformChange = (value) => {\n let updatedPlatforms = [...form.campaign_upload_platform];\n if (updatedPlatforms.includes(value)) {\n updatedPlatforms = updatedPlatforms.filter(\n (platform) => platform !== value\n );\n } else {\n updatedPlatforms.push(value);\n }\n dispatch(\n updateCampaignFields({ campaign_upload_platform: updatedPlatforms })\n );\n };\n\n const handleTooltipFunction = (click, toggleTooltip, tooltipText, style) => {\n return (\n <>\n \n \n {form.campaign_reward_type === \"Cash\" ? (\n \"$\"\n ) : \"$\" && form.campaign_reward_type === \"Discount\" ? (\n \"%\"\n ) : \"%\" && form.campaign_reward_type === \"Other\" ? (\n
\n {form.campaign_reward_type === \"Other\" ? (\n ...
\n ) : (\n \"$\"\n )}\n \n {\n const inputValue = e.target.value;\n const wordCount = inputValue?.trim()?.split(/\\s+/)?.length;\n if (wordCount <= 141) {\n dispatch(updateCampaignFields({ campaign_reward: inputValue }));\n }\n }}\n />\n
\n ) : (\n \n Word limit{\" \"}\n {141 - form?.campaign_reward.trim()?.split(/\\s+/)?.length}.\n
\n \n
\n )}\n \n );\n };\n return (\n <>\n \n
\n \n \n \n \n \n\n \n \n \n \n \n {ongoingOption}\n \n
\n\n \n \n
\n\n \n \n
\n\n \n
\n \n \n \n
\n \n \n \n
\n \n
\n \n
\n \n \n \n \n {/* selectedOption === calender */}\n {selectOption}\n \n {calenderDropdown}\n \n \n
\n \n \n
\n {option.label}
\n \n ))}\n \n \n
\n \n \n Campaign Video Entry Limit{\" \"}\n {/* * */}\n
\n \n 0\n ? form.campaign_video_limit\n : null\n }\n placeholder=\"200\"\n onChange={(e) => {\n dispatch(\n updateCampaignFields({\n campaign_video_limit: Number(e.target.value),\n })\n );\n }}\n />\n
\n \n \n Campaign Video Length{\" \"}\n
\n \n {\n dispatch(\n updateCampaignFields({\n campaign_video_length: e.target.value,\n })\n );\n }}\n placeholder=\"3\"\n />\n
\n \n \n \n {/* select reward type */}\n {timeDurationType}\n \n {timeDurationDropdown}\n \n
\n \n \n
\n ))}\n \n \n
\n {platformData.map((platform, index) => (\n Video Submission Platform
\n (Select all that apply)
\n \n
\n \n \n \n dispatch(updateCampaignState({ activeStep: activeStep + 1 }))\n }\n disabled={isNextButtonDisabled}\n style={{ background: isNextButtonDisabled ? \"#C4C4C4\" : \"\" }}\n >\n Next\n \n
\n \n \n );\n};\n\nexport default Step2;\n","export const defaultContent = \n\"Please read these terms and conditions carefully before participating in the Video Campaigns ('Campaign'). By submitting a video, you agree to be bound by these terms and conditions.
\\n- \\n
- Eligibility: The Campaign is open to individuals who are 18 years of age or older and are legal residents of the country in which the Campaign is being run. Employees, agents, and affiliates of the Campaign organizers, their immediate families, and household members are not eligible to participate. \\n
- Submission: To participate, submit a video in accordance with the instructions provided. You may only submit one video per campaign. \\n
- Ownership: By submitting a video, you represent and warrant that you own all rights to the video and that the video does not infringe on the intellectual property rights of any third party. \\n
- Grant of Rights: By submitting a video, you grant the Campaign organizers a perpetual, irrevocable, worldwide, royalty-free license to use, reproduce, distribute, and display the video or parts of video in any manner, including but not limited to, on the Campaign organizers' website, social media channels, e-commerce channels, email, SMS and in advertising and promotional materials. \\n
- Compensation: You will not receive any compensation for submitting a video. However, the Campaign organizers may, at their sole discretion, provide incentives, rewards or prizes for certain videos. Any reward, prize or incentive distribution is subject to meeting content submission guidelines. \\n
- Privacy: The personal information collected from you as part of the Campaign will be used in accordance with the Campaign organizers' privacy policy. \\n
- Termination: The Campaign organizers reserve the right to terminate the Campaign at any time and for any reason, without notice. \\n
- Governing Law: These terms and conditions will be governed by and construed in accordance with the laws of the country in which the Campaign is being run. \\n
- Disclaimer of Liability: The Campaign organizers will not be liable for any loss, injury, or damage arising from your participation in the Campaign, or from your submission of a video. \\n
- Modification: The Campaign organizers reserve the right to modify these terms and conditions at any time and without notice. Your continued participation in the Campaign will constitute your acceptance of any such modifications. \\n
- Entire Agreement: These terms and conditions constitute the entire agreement between you and the Campaign organizers with respect to the Campaign and supersede all prior or contemporaneous communications and proposals, whether oral or written. \\n
By submitting a video, you acknowledge that you have read and understood these terms and conditions and agree to be bound by them.
\\n\"\n","import { Modal } from \"reactstrap\";\nimport { useState } from \"react\";\nimport { ImageSizeIcon } from \"../../../Shared/SVGs/Shared\";\nimport { X } from \"react-feather\";\n\nconst ImageSizeModal = ({ open, toggle }) => {\n // const [open, setOpen] = useState(true);\n // const toggle = () => {\n // setOpen(false);\n // };\n const style = {\n color: \"#E62580\",\n };\n return (\n\n
\n \n
\n \n {ImageSizeIcon}\n
\n \n
\n \n );\n};\n\nexport default ImageSizeModal;\n","const toolbarTerms = {\n options: [\n // \"blockType\",\n \"fontFamily\",\n \"fontSize\",\n \"inline\",\n // \"textAlign\",\n // \"list\",\n \"colorPicker\",\n // \"link\",\n // \"embedded\",\n \"emoji\",\n // \"image\",\n // \"remove\",\n // \"history\"\n \n ],\n \n // blockType: {\n // inDropdown: true,\n // options: [\"Normal\", \"H1\", \"H2\", \"H3\", \"H4\", \"H5\", \"H6\", \"Blockquote\"],\n // className: undefined,\n // component: undefined,\n // dropdownClassName: undefined\n // },\n\n // blockType: {\n // inDropdown: true,\n // options: [\"Normal\", \"H1\", \"H2\", \"H3\", \"H4\", \"H5\", \"H6\",\"Blockquote\"],\n // className: 'toolbar-item item-block-type',\n // component: undefined,\n // dropdownClassName: undefined\n // },\n \n fontFamily: {\n inDropdown: true,\n options: [\"Helvetica\", \"Arial\", \"Georgia\", \"Impact\", \"Tahoma\", \"Sf pro\", \"Verdana\"],\n className: 'toolbar-item item-block-type',\n component: undefined,\n dropdownClassName: undefined\n },\n\n fontSize: {\n inDropdown: true,\n options: [10, 12, 14, 18, 24, 30, 36, 48, 60, 72, 96],\n className: 'toolbar-item',\n component: undefined,\n dropdownClassName: undefined\n },\n \n \n inline: {\n inDropdown: false,\n className: 'toolbar-item',\n component: undefined,\n dropdownClassName: undefined,\n options: [\"bold\", \"italic\", \"underline\", \"strikethrough\"]\n },\n \n list: {\n inDropdown: false,\n className: 'toolbar-item',\n component: undefined,\n dropdownClassName: undefined,\n options: [\"unordered\", \"ordered\"]\n },\n \n textAlign: {\n inDropdown: true,\n className: 'toolbar-item',\n component: undefined,\n dropdownClassName: undefined,\n options: [\"left\", \"center\", \"right\"]\n },\n \n colorPicker: {\n icon: '',\n className: 'toolbar-item change-color',\n component: undefined,\n popupClassName: undefined,\n colors: [\"#000000\", \"#ffffff\", \"#ff0000\", \"#00ff00\", \"#0000ff\", \"#ffff00\", \"#00ffff\", \"#ff00ff\", \"#808080\", \"#800000\", \"#808000\", \"#008000\", \"#800080\", \"#008080\", \"#000080\"],\n },\n \n link: {\n inDropdown: false,\n className: 'toolbar-item',\n component: undefined,\n popupClassName: undefined,\n options: [\"link\", \"unlink\"],\n linkCallback: undefined\n },\n \n embedded: {\n icon: '',\n className: 'toolbar-item change-icon-embed',\n component: undefined,\n popupClassName: undefined,\n defaultSize: {\n height: \"auto\",\n width: \"auto\"\n }\n },\n \n emoji: {\n className: 'toolbar-item',\n component: undefined,\n popupClassName: undefined,\n emojis: [ \n '😀', '😃', '😄', '😁', '😆', '😅', '😂', '🤣', '😊', '😇', '🙂', '🙃', '😉', '😌', '😍', '😘', '😗', '😙', '😚', '😋', '😛', '😜', '😝', '😎', '🤓', '🤗', '🤔', '😏', '😒', '😞', '😔', '😟', '😕', '🙁', '☹️', '😣', '😖', '😫', '😩', '😤', '😠', '😡', '😶', '😐', '😑', '😯', '😦', '😧', '😮', '😲', '😵', '😳', '😱', '😨', '😰', '😢', '😥', '🤤', '😭', '😓', '😪', '😴', '🙄', '🤔', '🤥', '😬', '🤐', '🤢', '🤧', '😷', '🤒', '🤕', '😈', '👿', '👹', '👺', '💀', '👻', '👽', '👾', '🤖', '💩', '😺', '😸', '😹', '😻', '😼', '😽', '🙀', '😿', '😾'\n ]\n },\n \n image: {\n className: 'toolbar-item',\n component: undefined,\n popupClassName: undefined,\n urlEnabled: true,\n uploadEnabled: true,\n alignmentEnabled: true,\n uploadCallback: undefined,\n previewImage: false,\n inputAccept: \"image/gif,image/jpeg,image/jpg,image/png,image/svg\"\n },\n \n // remove: {\n // className: undefined,\n // component: undefined\n // },\n \n // history: {\n // inDropdown: false,\n // className: undefined,\n // component: undefined,\n // dropdownClassName: undefined,\n // options: [\"undo\", \"redo\"]\n // }\n };\n \n export default toolbarTerms;\n ","import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport { useDropzone } from \"react-dropzone\";\nimport { Editor } from \"react-draft-wysiwyg\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport {\n Button,\n Dropdown,\n DropdownItem,\n DropdownMenu,\n DropdownToggle,\n} from \"reactstrap\";\nimport { dropdownIcon } from \"../../../Shared/SVGs/Shared\";\nimport { EditorState, convertFromHTML, ContentState } from \"draft-js\";\n\nimport draftToHtml from \"draftjs-to-html\";\n\nimport { updateCampaignFields, updateCampaignState } from \"../CampaignActions\";\nimport { defaultContent } from \"./defaultTermsAndConditions\";\nimport FormStepsModal from \"./FormStepsModal\";\nimport ImageSizeModal from \"./ImageSizeModal\";\nimport Cropper from \"react-easy-crop\";\nimport toolbarTerms from \"../../../utility/toolbarTerms\";\n\nconst infoIcon = require(\"@src/assets/images/vyrill/videos/info.png\").default;\nconst CloseIcon = require(\"@src/assets/images/vyrill/videos/close.svg\").default;\n\nconst FormStep3 = () => {\n const [dropdownOpen, setDropdownOpen] = useState(false);\n const [showImageSizeModal, setShowImageSizeModal] = useState(false);\n const [crop, setCrop] = useState({ x: 0, y: 0 });\n const [zoom, setZoom] = useState(1);\n const [croppedImage, setCroppedImage] = useState(false);\n const [croppedAreaPixels, setCroppedAreaPixels] = useState(null);\n // const [image, setImage] = useState(\"\");\n const dispatch = useDispatch();\n const activeStep = useSelector((state) => state.campaign_states.activeStep);\n const form = useSelector((state) => state.campaign_states.form);\n const terms_and_conditions_editor_state = useSelector(\n (state) => state.campaign_states.form.terms_and_conditions_editor_state\n );\n\n const handleImageTypeSelect = (option) => {\n dispatch(updateCampaignFields({ image_dimensions: option }));\n setDropdownOpen(false);\n };\n const toggleDropdown = () => setDropdownOpen(!dropdownOpen);\n\n const onCropComplete = useCallback((croppedArea, croppedAreaPixels) => {\n setCroppedAreaPixels(croppedAreaPixels);\n }, []);\n\n const onSave = () => {\n if (croppedAreaPixels) {\n const canvas = document.createElement(\"canvas\");\n const image = new Image();\n image.src = form?.campaign_banner_image_preview\n ? form?.campaign_banner_image_preview\n : require(`@src/assets/images/dropzoneimage.png`).default;\n canvas.width = croppedAreaPixels.width;\n canvas.height = croppedAreaPixels.height;\n const ctx = canvas?.getContext(\"2d\");\n\n ctx?.drawImage(\n image,\n croppedAreaPixels.x,\n croppedAreaPixels.y,\n croppedAreaPixels.width,\n croppedAreaPixels.height,\n 0,\n 0,\n croppedAreaPixels.width,\n croppedAreaPixels.height\n );\n canvas?.toBlob((blob) => {\n if (blob) {\n const selectedImage = new File([blob], \"cropped_image.jpeg\", {\n type: blob.type,\n });\n const reader = new FileReader();\n reader.onloadend = () => {\n dispatch(\n updateCampaignFields({\n campaign_banner_image_file: selectedImage,\n })\n );\n };\n reader.readAsDataURL(selectedImage);\n const croppedImageURL = URL?.createObjectURL(blob);\n dispatch(\n updateCampaignFields({\n campaign_banner_image_preview: croppedImageURL,\n })\n );\n }\n }, \"image/jpeg\");\n }\n setCroppedImage(false);\n };\n\n const onCropChange = useCallback((crop) => {\n setCrop(crop);\n }, []);\n\n const onZoomChange = useCallback((zoom) => {\n setZoom(zoom);\n }, []);\n\n const onDrop = async (acceptedFiles) => {\n const selectedImage = acceptedFiles[0];\n const reader = new FileReader();\n\n if (selectedImage) {\n if (selectedImage.size > 9 * 1024 * 1024) {\n setShowImageSizeModal(true);\n } else {\n reader.onloadend = () => {\n dispatch(\n updateCampaignFields({\n // campaign_banner_image: reader.result,\n campaign_banner_image_file: selectedImage,\n })\n );\n };\n reader.readAsDataURL(selectedImage);\n dispatch(\n updateCampaignFields({\n campaign_banner_image_preview: URL.createObjectURL(selectedImage),\n })\n );\n }\n }\n };\n\n useEffect(() => {\n window.scrollTo(0, 0);\n }, []);\n\n const handleCropSelect = () => {\n handleImageTypeSelect(\"Crop\");\n setCroppedImage(true);\n };\n\n const cropMenu = (\n \n Oops! It seems your image size is too large. Please{\" \"}\n upload an image within{\" \"}\n 9 MB\n
\n Fill
\n \n Fit
\n \n Crop
\n \n
\n );\n\n useEffect(() => {\n const blocksFromHTML = convertFromHTML(defaultContent);\n const state = ContentState.createFromBlockArray(\n blocksFromHTML.contentBlocks,\n blocksFromHTML.entityMap\n );\n dispatch(\n updateCampaignFields({\n terms_and_conditions_editor_state: EditorState.createWithContent(state),\n terms_and_conditions: defaultContent,\n })\n );\n }, []);\n\n const handleTermsContentState = (contentState) => {\n dispatch(\n updateCampaignFields({ terms_and_conditions: draftToHtml(contentState) })\n );\n };\n const handleTermsEditorState = (editorState) => {\n dispatch(\n updateCampaignFields({ terms_and_conditions_editor_state: editorState })\n );\n };\n\n const handleNext = async () => {\n dispatch(updateCampaignState({ activeStep: activeStep + 1 }));\n };\n\n const tooltipStyle = { display: hover ? \"block\" : \"none\" };\n const [hover, setHover] = useState(false);\n const toggleVyrillTooltip = (e) => {\n e.preventDefault();\n e.stopPropagation();\n setHover(!hover);\n };\n\n return (\n \n
\n Upload Campaign Image
\n \n \n \n \n {cropMenu}\n \n
\n \n
\n \n {form?.image_dimensions ? (\n form?.image_dimensions\n ) : (\n Fit\n )}\n
\n{dropdownIcon}
\n\n {croppedImage ? (\n
\n \n {}\n
\n )}\n \n {croppedImage &&
\n Save
}\n \n Format: JPG, PNG, TIF, GIF\n \n Preferred Dimension: W 1024 pixel, H 768 pixel\n \n Resolution: 300dpi
\n Image size limit - 9 mb *If no image is\n uploaded, the default image will be the campaign image.\n
\n \n Image size limit - 9 mb *If no image is\n uploaded, the default image will be the campaign image.\n
\n setShowImageSizeModal(false)}\n />\n
\n );\n};\n\nexport default FormStep3;\n","import { Modal } from \"reactstrap\";\nimport { useState } from \"react\";\nimport { X } from \"react-feather\";\nimport { modalEditIcon } from \"../../../Shared/SVGs/Shared\";\nimport { useSelector } from \"react-redux\";\n\nconst Step4EditModal = ({ style }) => {\n const [open, setOpen] = useState(true);\n const toggle = () => {\n setOpen(false);\n };\n const showCampaignStep = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignStep\n );\n return (\n \n Terms and Conditions\n \n
\n\n \n
\n )}\n \n
\n \n handleNext()}\n >\n Next\n \n
\n \n
\n \n
\n {modalEditIcon}
\n \n
\n \n Ready to personalize your campaign? Click here to adjust the colors\n and make it your own\n
\n\n
\n \n );\n};\n\nexport default Step4EditModal;\n","import { useState, useMemo, useRef } from \"react\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Modal } from \"reactstrap\";\nimport {\n EmbedIcon,\n facebookIcon,\n instagramIcon,\n twitterIcon,\n crossIcon,\n homeIcon,\n} from \"../../../Shared/SVGs/Shared\";\nimport FormStepsModal from \"./FormStepsModal\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { updateCampaignFields, updateCampaignState } from \"../CampaignActions\";\nimport { FacebookShareButton, TwitterShareButton } from \"react-share\";\nimport {\n updateCampaignState as videoUpdateCampaignState,\n updateParams,\n updateVideoPageState,\n} from \"../../Video/VideoActions\";\n\nconst content = (\n \n Before sharing your campaign, take a moment to review, change the\n colors and fine-tune the campaign here. This is your chance to ensure\n everything looks just right before it goes live.\n
\n \n Share your campaign easily by{\" \"}\n copying the link or clicking{\" \"}\n 'Generate QR Code' to create and download\n a unique QR code. This code will be prominently displayed on your campaign\n page, allowing anyone to scan and effortlessly upload their video to\n participate in your campaign.\n
\n);\n\nconst FormStep4QRModal = ({ open, toggle }) => {\n const activeStep = useSelector((state) => state.campaign_states.activeStep);\n const campaign_response = useSelector(\n (state) => state.campaign_states.campaign_response\n );\n const [copied, setCopied] = useState(false);\n const form = useSelector((state) => state.campaign_states.form);\n const campaignUrl = `${process.env.REACT_APP_CAMPAGIN_URL}/form/${campaign_response?._id}/landing`;\n\n const componentRef = useRef();\n const navigate = useNavigate();\n\n const dispatch = useDispatch();\n\n const activeCampaign = (state) => {\n dispatch(\n updateCampaignFields({\n banner_share_url: \"\",\n banner_with_qr: \"\",\n })\n );\n navigate(\"/videos/campaigns\");\n // dispatch(\n // updateParams({\n // tab: \"Campaigns\",\n // transcriptView: false,\n // is_widget: false,\n // search: \"\",\n // page: 1,\n // isTrashTab: false,\n // isFlaggedTab: false,\n // isFavoriteTab: false,\n // isCampaignTab: true,\n // updateParamsOnly: true,\n // })\n // );\n // dispatch(\n // updateVideoPageState({\n // isCategoryPage: false,\n // isCampaignListPage: true,\n // })\n // ); \n dispatch(videoUpdateCampaignState({ tab: \"ACTIVE\" }));\n };\n\n const handleCopyClick = () => {\n setCopied(!copied);\n const linkElement = document.getElementById(\"campaign-link\");\n if (linkElement) {\n const linkText = linkElement.textContent;\n const tempInput = document.createElement(\"input\");\n document.body.appendChild(tempInput);\n tempInput.value = linkText;\n tempInput.select();\n document.execCommand(\"copy\");\n document.body.removeChild(tempInput);\n }\n };\n // const closeModal = () => {\n // toggle;\n // };\n\n // console.log(campaign_response);\n const step4Content = (\n <>\n {\" \"}\n {activeStep === 4 && (\n <>\n \n
\n \n window.open(\"https://www.instagram.com\", \"_blank\")}\n >\n {instagramIcon}
*/}\n \n {EmbedIcon}
\n Embed
{\" \"}\n \n \n {facebookIcon}\n
\n\n {/* Facebook
\n \n Instagram
{\" \"}\n {twitterIcon}
{\" \"}\n X
{\" \"}\n \n \n \n \n )}\n \n );\n\n return (\n <>\n {open && }\n \n Share\n \n {crossIcon}\n \n
\n ) : (\n Your campaign is live now!
\n )}\n {/* step 4 content */}\n {step4Content}\n\n {/* step 4 content */}\n {form?.banner_share_url && step5Content}\n \n
\n \n \n {campaignUrl}\n
\n \n {copied ? \"Copied\" : \"COPY\"}\n
\n \n {/*
\n \n \n );\n};\n\nexport default FormStep4QRModal;\n","import React from \"react\";\nimport { X } from \"react-feather\";\nimport { Button, Modal, Spinner } from \"reactstrap\";\nimport { updatedCampaignIcon } from \"../../../Shared/SVGs/Shared\";\n\nconst Step4InfoModal = ({ open, toggle, handleSubmit, loading }) => {\n return (\n {homeIcon}
*/}\n \n See Active Campaign\n
\n \n
\n \n
\n \n {updatedCampaignIcon}\n
\n Your campaign is ready to go live!
\n\n
\n \n Click 'Activate' to launch your campaign. Once live, you can share it\n with your customers by generating a QR code or using the{\" \"}\n provided link. Vyrill will then save you design time by\n creating the campaign banner for you.\n
\n \n \n Activate {loading &&
\n \n );\n};\n\nexport default Step4InfoModal;\n","const toolbarHashtag = {\n options: [\n \"colorPicker\",\n ],\n colorPicker: {\n icon: '',\n className: 'toolbar-item change-color',\n component: undefined,\n popupClassName: undefined,\n colors: [\"#000000\", \"#ffffff\", \"#ff0000\", \"#00ff00\", \"#0000ff\", \"#ffff00\", \"#00ffff\", \"#ff00ff\", \"#808080\", \"#800000\", \"#808000\", \"#008000\", \"#800080\", \"#008080\", \"#000080\"],\n },\n };\n \n export default toolbarHashtag;\n ","import { useEffect, useRef, useState } from \"react\";\nimport { useDropzone } from \"react-dropzone\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport {\n Button,\n Dropdown,\n DropdownItem,\n DropdownMenu,\n DropdownToggle,\n Input,\n Spinner,\n} from \"reactstrap\";\nimport { Editor } from \"react-draft-wysiwyg\";\nimport { SingleDatePicker } from \"react-dates\";\nimport { useMutation, useQuery } from \"@apollo/client\";\nimport { TimePicker } from \"antd\";\nimport ReactGPicker from \"react-gcolor-picker\";\n\nimport PerfectScrollbar from \"react-perfect-scrollbar\";\nimport draftToHtml from \"draftjs-to-html\";\nimport Cookies from \"js-cookie\";\nimport moment from \"moment\";\nimport gql from \"graphql-tag\";\n\nimport {\n uploadIcon,\n rewardIcon,\n calenderIcon,\n timeIcon,\n timeLimiIcon,\n PlatformSubmit,\n qrCodeIcon,\n copyIcon,\n editIcon,\n dropdownIcon,\n} from \"../../../Shared/SVGs/Shared\";\nimport { removeQueryParams } from \"../../../utilities\";\nimport { updateCampaignFields, updateCampaignState } from \"../CampaignActions\";\nimport {\n convertToRaw,\n EditorState,\n convertFromHTML,\n ContentState,\n} from \"draft-js\";\n\nimport Step4EditModal from \"./Step4EditModal\";\nimport toolbar from \"../../../utility/toolbar\";\nimport FormStep4QRModal from \"./FormStep4QRModal\";\nimport \"react-draft-wysiwyg/dist/react-draft-wysiwyg.css\";\nimport Step4InfoModal from \"./Step4InfoModal\";\nimport toolbarTerms from \"../../../utility/toolbarTerms\";\nimport toolbarHashtag from \"../../../utility/toolbarHashtag\";\nimport QrCodeModal from \"../../Video/Components/Campaign/QrCodeModal\";\n\nimport youtube from \"@src/assets/images/vyrill/reports/youtube_icon.png\";\nimport tiktok from \"@src/assets/images/vyrill/icons/tiktok_icon.png\";\nimport instagram from \"@src/assets/images/vyrill/icons/instagram_icon.png\";\nimport upload from \"@src/assets/images/vyrill/icons/upload_icon.png\";\nimport googledrive from \"@src/assets/images/vyrill/icons/google_drive_icon.png\";\nimport dropbox from \"@src/assets/images/vyrill/icons/dropbox_icon.png\";\n\nconst platformData = [\n { name: \"YouTube\", icon: youtube },\n { name: \"TikTok\", icon: tiktok },\n { name: \"Instagram\", icon: instagram },\n { name: \"GoogleDrive\", icon: googledrive },\n { name: \"Dropbox\", icon: dropbox },\n { name: \"Upload\", icon: upload },\n];\n\nconst GET_PRESIGNED_URL = gql`\n query GetPresignedURL($fileName: String!) {\n getPresignedURL(fileName: $fileName)\n }\n`;\n\nconst CREATE_CAMPAIGN_MUTATION = gql`\n mutation MyMutation($campaign: clipupInput!) {\n createCampaign(campaign: $campaign) {\n _id\n logo_url\n bannerRenderAs\n name\n generate_qr\n banner_url\n manufacturer {\n _id\n name\n }\n products {\n _id\n name\n }\n }\n }\n`;\n\nconst FormStep4 = ({\n editable,\n editHandler,\n isColorPickerOpen,\n setIsColorPickerOpen,\n}) => {\n const [qrModal, setQrModal] = useState(false);\n const [loading, setLoading] = useState(false);\n const [open, setOpen] = useState(false);\n const [copied, setCopied] = useState(false);\n const [qrmodal, setQrmodal] = useState(false);\n const [focused, setFocused] = useState(null);\n const [dropdownOpen1, setDropdownOpen1] = useState(false);\n const [isColorPickerButton, setIsColorPickerButton] = useState(false);\n const [isColorPickerButtonText, setIsColorPickerButtonText] = useState(false);\n const handleTimeTypeSelect = (option) => {\n dispatch(updateCampaignFields({ campaign_video_length_type: option }));\n setDropdownOpen1(false);\n };\n const toggleTimeDropdown = () => setDropdownOpen1(!dropdownOpen1);\n const form = useSelector((state) => state.campaign_states.form);\n const [date, setDate] = useState(\n form.end_date ? moment(form.end_date) : null\n );\n console.log(date);\n const end_time = useSelector((state) => state.campaign_states.form.end_time);\n const terms_and_conditions_editor_state = useSelector(\n (state) => state.campaign_states.form.terms_and_conditions_editor_state\n );\n const description_editor_state = useSelector(\n (state) => state.campaign_states.form.description_editor_state\n );\n\n const headline_editor_state = useSelector(\n (state) => state.campaign_states.form.headline_editor_state\n );\n const hashtag_editor_state = useSelector(\n (state) => state.campaign_states.form.hashtag_editor_state\n );\n const brand_instruction_editor_state = useSelector(\n (state) => state.campaign_states.form.brand_instruction_editor_state\n );\n\n const campaign_video_length_type = useSelector(\n (state) => state.campaign_states.form.campaign_video_length_type\n );\n const showCampaignStep = useSelector(\n (state) => state.videoPageStates.campaignsState.showCampaignStep\n );\n const campaign_response = useSelector(\n (state) => state.campaign_states.campaign_response\n );\n\n const selectedPlatformData = platformData.filter((platform) =>\n form?.campaign_upload_platform.includes(platform.name)\n );\n const campaignUrl = `${process.env.REACT_APP_CAMPAGIN_URL}/form/${campaign_response?._id}/landing`;\n const handleCloseQr = () => setQrmodal(false);\n const toggle = () => {\n setOpen(false);\n };\n const toggleQrModal = () => setQrModal(true);\n const closeQrModal = () => {\n setQrModal(false);\n };\n\n const pickerRef = useRef(null);\n const handleClickOutside = (event) => {\n if (pickerRef.current && !pickerRef.current.contains(event.target)) {\n setIsColorPickerOpen(false);\n setIsColorPickerButton(false);\n setIsColorPickerButtonText(false);\n }\n };\n useEffect(() => {\n if (isColorPickerOpen || isColorPickerButton || isColorPickerButtonText) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n } else {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isColorPickerOpen, isColorPickerButton, isColorPickerButtonText]);\n\n useEffect(() => {\n window.scrollTo(0, 0);\n }, []);\n\n useEffect(() => {\n setDate(form.end_date);\n }, [form.end_date]);\n\n const handleCopyClick = () => {\n setCopied(!copied);\n navigator.clipboard.writeText(campaignUrl);\n setTimeout(() => {\n setCopied(false);\n }, 500);\n };\n const handleQrClick = () => {\n dispatch(updateCampaignState({ activeStep: 5 }));\n };\n\n const handleDateChange1 = (newDate) => {\n setDate(newDate);\n dispatch(updateCampaignFields({ end_date: newDate, ongoing: false }));\n };\n const handleFocusChange = ({ focused }) => {\n setFocused(focused);\n };\n\n const [\n createCampaign,\n { data: CampaignData, loading: createCampaignLoading, error },\n ] = useMutation(CREATE_CAMPAIGN_MUTATION);\n\n const { refetch } = useQuery(GET_PRESIGNED_URL, {\n skip: true,\n });\n\n const handleSubmit = async () => {\n setLoading(true);\n const {\n campaign_headline,\n campaign_hashtag,\n campaign_brand_name,\n campaign_brand_image,\n campaign_reward,\n start_date,\n end_date,\n start_time,\n end_time,\n campaign_timezone,\n products,\n ongoing,\n campaign_video_limit,\n campaign_allow_rating,\n campaign_video_length,\n terms_and_conditions,\n campaign_description,\n campaign_reward_type,\n campaign_banner_image_file,\n campaign_banner_image_preview,\n image_dimensions,\n description_editor_state,\n terms_and_conditions_editor_state,\n brand_instruction,\n brand_instruction_editor_state,\n campaign_video_length_type,\n campaign_headline_editor,\n campaign_hashtag_editor,\n headline_editor_state,\n hashtag_editor_state,\n preview_color_change,\n campaign_button_color,\n campaign_button_text_color,\n campaign_upload_platform,\n } = form;\n try {\n let serializedContentDesc = null;\n let serializedContentBrand = null;\n let serializedContentHashtag = null;\n let serializedContentHeadline = null;\n let serializedContentTerm = null;\n\n if (description_editor_state) {\n const rawContentStateDesc = convertToRaw(\n description_editor_state.getCurrentContent()\n );\n serializedContentDesc = JSON.stringify(rawContentStateDesc);\n }\n\n if (headline_editor_state) {\n const rawContentStateHead = convertToRaw(\n headline_editor_state.getCurrentContent()\n );\n serializedContentHeadline = JSON.stringify(rawContentStateHead);\n }\n\n if (hashtag_editor_state) {\n const rawContentStateHash = convertToRaw(\n hashtag_editor_state.getCurrentContent()\n );\n serializedContentHashtag = JSON.stringify(rawContentStateHash);\n }\n\n if (brand_instruction_editor_state) {\n const rawContentStateBrand = convertToRaw(\n brand_instruction_editor_state.getCurrentContent()\n );\n serializedContentBrand = JSON.stringify(rawContentStateBrand);\n }\n\n if (terms_and_conditions_editor_state) {\n const rawContentStateTerm = convertToRaw(\n terms_and_conditions_editor_state.getCurrentContent()\n );\n serializedContentTerm = JSON.stringify(rawContentStateTerm);\n }\n const newProducts = products\n ?.filter((product) => product?.__isNew__)\n .map((product) => product?.label);\n\n const formattedStartTime = start_time.format(\"HH:mm\");\n const formattedEndTime = end_time && end_time.format(\"HH:mm\");\n\n const formattedStartDate = moment(start_date).set({\n hour: start_time.hour(),\n minute: start_time.minute(),\n });\n\n const formattedEndDate = ongoing\n ? false\n : moment(end_date).set({\n hour: end_time.hour(),\n minute: end_time.minute(),\n });\n\n let campaignBannerImage = campaign_banner_image_preview || \"\";\n\n if (campaign_banner_image_file) {\n const { data: urlData } = await refetch({\n fileName: campaign_banner_image_file.name,\n });\n\n // Upload File to preassigned URL\n const uploadImageResponse = await fetch(urlData.getPresignedURL, {\n method: \"PUT\",\n headers: {\n \"Content-Type\": campaign_banner_image_file.type,\n },\n body: campaign_banner_image_file,\n });\n\n if (!uploadImageResponse.ok) {\n setLoading(false);\n throw new Error(\"Failed to upload image\");\n }\n\n campaignBannerImage = removeQueryParams(urlData.getPresignedURL);\n }\n\n const campaignData = {\n description_editor_state: serializedContentDesc,\n brand_instruction_editor_state: serializedContentBrand,\n headline_editor_state: serializedContentHeadline,\n hashtag_editor_state: serializedContentHashtag,\n terms_and_conditions_editor_state: serializedContentTerm,\n status: \"\",\n campaign_banner_image: campaignBannerImage,\n campaign_hashtag,\n campaign_brand_image,\n campaign_brand_name,\n campaign_description,\n campaign_upload_platform,\n brand_instruction,\n campaign_headline_editor,\n campaign_hashtag_editor,\n campaign_headline,\n preview_color_change,\n campaign_button_color,\n campaign_button_text_color,\n campaign_product: \"campaign_product\",\n campaign_reward,\n campaign_reward_type,\n campaign_timezone,\n manufacturer: {\n _id: Cookies.get(\"bId\"),\n name: campaign_brand_name,\n },\n products: products\n ?.filter((product) => !product?.__isNew__)\n .map((product) => ({\n _id: product?.value,\n name: product?.label,\n })),\n ...(newProducts?.length > 0 && { newProducts }),\n start_date: formattedStartDate,\n start_time: formattedStartTime,\n ...(ongoing ? {} : { end_date: formattedEndDate }),\n ongoing,\n end_time: formattedEndTime,\n terms_and_conditions,\n ...(campaign_video_limit > 0 && { campaign_video_limit }),\n campaign_allow_rating,\n campaign_video_time_limit: `${campaign_video_length}`,\n campaign_video_length_type,\n descriptionRenderAs: \"html\",\n termAndConditionRenderAs: \"html\",\n bannerRenderAs: image_dimensions,\n };\n\n const { data: response } = await createCampaign({\n variables: { campaign: campaignData },\n });\n\n if (response) {\n setLoading(false);\n setOpen(false);\n toggleQrModal();\n dispatch(\n updateCampaignState({ campaign_response: response.createCampaign })\n );\n dispatch(\n updateCampaignFields({\n campaign_headline: \"\",\n campaign_hashtag: \"\",\n campaign_brand_name: \"\",\n campaign_product: \"\",\n campaign_banner_image: \"\",\n campaign_banner_image_file: null,\n productimageURL: \"\",\n campaign_description: \"\",\n campaign_reward: \"\",\n end_date: null,\n campaign_upload_platform: [],\n time: \"\",\n start_date: moment(),\n start_time: \"\",\n end_time: \"\",\n campaign_timezone: \"GMT-07:00 (Pacific Daylight Time)\",\n currentTime: \"\",\n campaign_reward_type: \"\",\n ongoing: false,\n products: [],\n campaign_video_limit: 200,\n campaign_video_length: \"\",\n campaign_allow_rating: false,\n terms_and_conditions: \"\",\n image_dimensions: \"Fit\",\n description_editor_state: null,\n brand_instruction_editor_state: null,\n terms_and_conditions_editor_state: null,\n campaign_video_length_type: \"\",\n })\n );\n }\n } catch (error) {\n setLoading(false);\n console.error(error);\n }\n };\n\n const onDrop = (acceptedFiles) => {\n const selectedImage = acceptedFiles[0];\n const reader = new FileReader();\n reader.onloadend = () => {\n dispatch(\n updateCampaignFields({ campaign_banner_image_file: selectedImage })\n );\n };\n\n if (selectedImage) {\n reader.readAsDataURL(selectedImage);\n dispatch(\n updateCampaignFields({\n campaign_banner_image_preview: URL.createObjectURL(selectedImage),\n // campaign_banner_image: reader.result,\n })\n );\n }\n };\n const handleTimeChange1 = (time) => {\n dispatch(updateCampaignFields({ end_time: time }));\n };\n const { getRootProps, getInputProps } = useDropzone({ onDrop });\n const productimage = (\n <>\n {editable ? (\n \n \n
\n ) : (\n \n {form.campaign_banner_image_preview ? (\n <>\n
\n \n
\n \n ) : (\n \n
{uploadIcon}
Drag & Drop\n file or Browse\n \n \n
\n )}\n \n
\n )}\n \n );\n\n useEffect(() => {\n const timer = setTimeout(() => {\n if (form.campaign_headline_editor === \"\") {\n const headlineBlocksFromHTML = convertFromHTML(form?.campaign_headline);\n const headlineState = ContentState.createFromBlockArray(\n headlineBlocksFromHTML.contentBlocks,\n headlineBlocksFromHTML.entityMap\n );\n dispatch(\n updateCampaignFields({\n headline_editor_state: EditorState.createWithContent(headlineState),\n campaign_headline_editor: form?.campaign_headline,\n })\n );\n }\n }, 2000);\n\n return () => clearTimeout(timer);\n }, [\n campaign_response?._id,\n form?._id,\n form.campaign_headline_editor,\n dispatch,\n ]);\n\n useEffect(() => {\n const timer = setTimeout(() => {\n if (form.campaign_hashtag_editor === \"\") {\n const hashtagBlocksFromHTML = convertFromHTML(form?.campaign_hashtag);\n const hashtagState = ContentState.createFromBlockArray(\n hashtagBlocksFromHTML.contentBlocks,\n hashtagBlocksFromHTML.entityMap\n );\n dispatch(\n updateCampaignFields({\n hashtag_editor_state: EditorState.createWithContent(hashtagState),\n campaign_hashtag_editor: form?.campaign_hashtag,\n })\n );\n }\n }, 2000);\n return () => clearTimeout(timer);\n }, [\n campaign_response?._id,\n form?._id,\n form.campaign_hashtag_editor,\n dispatch,\n ]);\n\n const onColorChange = (value) => {\n dispatch(updateCampaignFields({ preview_color_change: value }));\n };\n const onButtonColorChange = (value) => {\n dispatch(updateCampaignFields({ campaign_button_color: value }));\n };\n const onButtonTextColorChange = (value) => {\n dispatch(updateCampaignFields({ campaign_button_text_color: value }));\n };\n\n const handleContentStateChange = (contentState) => {\n dispatch(\n updateCampaignFields({ campaign_description: draftToHtml(contentState) })\n );\n };\n\n const handleEditorStateChange = (editorState) => {\n dispatch(updateCampaignFields({ description_editor_state: editorState }));\n };\n\n const handleTermsContentState = (contentState) => {\n dispatch(\n updateCampaignFields({ terms_and_conditions: draftToHtml(contentState) })\n );\n };\n const handleTermsEditorState = (editorState) => {\n dispatch(\n updateCampaignFields({ terms_and_conditions_editor_state: editorState })\n );\n };\n const handleBrandContentStateChange = (contentState) => {\n dispatch(\n updateCampaignFields({ brand_instruction: draftToHtml(contentState) })\n );\n };\n\n const handleBrandEditorStateChange = (editorState) => {\n dispatch(\n updateCampaignFields({ brand_instruction_editor_state: editorState })\n );\n };\n\n const handleHeadlineEditorStateChange = (editorState) => {\n dispatch(updateCampaignFields({ headline_editor_state: editorState }));\n };\n const handleHeadlineContentStateChange = (contentState) => {\n const blocks = contentState?.blocks;\n const plainText = blocks?.map((block) => block?.text).join(\" \");\n dispatch(\n updateCampaignFields({\n campaign_headline_editor: draftToHtml(contentState),\n campaign_headline: plainText,\n })\n );\n };\n\n const handleHashtagEditorStateChange = (editorState) => {\n dispatch(updateCampaignFields({ hashtag_editor_state: editorState }));\n };\n const handleHashtagContentStateChange = (contentState) => {\n const blocks = contentState?.blocks;\n const plainText = blocks?.map((block) => block?.text).join(\" \");\n dispatch(\n updateCampaignFields({\n campaign_hashtag_editor: draftToHtml(contentState),\n campaign_hashtag: plainText,\n })\n );\n };\n\n const headline = (\n <>\n {editable ? (\n \n
\n ) : (\n <>\n {form.campaign_headline_editor ? (\n \n {form.campaign_headline}\n
\n )}\n \n )}\n \n );\n\n const hashtags = (\n <>\n {editable ? (\n \n
\n ) : (\n <>\n {form.campaign_hashtag_editor ? (\n {form.campaign_hashtag}
\n )}\n \n )}\n \n );\n\n const discriptions = (\n <>\n {editable ? (\n \n
\n ) : (\n Campaign Description
\n \n \n {form?.campaign_description !== \"\" && \"Campaign Description\"}\n
\n \n
\n ) : (\n Brand Instructions
\n \n \n {form?.brand_instruction !== \"\" && \"Brand Instructions\"}\n
\n \n
\n ) : (\n \n {form.campaign_reward_type === \"Cash\" && \"$\"}\n {form.campaign_reward_type !== \"Other\" && form.campaign_reward}\n {form.campaign_reward_type === \"Discount\" && \"%\"}\n
\n )}\n \n );\n const rewardOther = (\n <>\n {editable && form.campaign_reward_type === \"Other\" ? (\n \n {\n const inputValue = e.target.value;\n const wordCount = inputValue.trim().split(/\\s+/)?.length;\n if (wordCount <= 140) {\n dispatch(\n updateCampaignFields({\n campaign_reward: inputValue,\n })\n );\n }\n }}\n />\n
\n ) : (\n {form.campaign_reward}
\n )}\n \n )}\n \n );\n\n const formattedDate = moment(form.end_date).format(\"YYYY-MM-DD\");\n const EndDate = (\n <>\n {editable ? (\n \n {/* {form?.ongoing ? 'Ongoing' : formattedDate} */}\n {form.ongoing ? \"Ongoing\" : formattedDate}\n
\n )}\n \n );\n const formattedEndTime = end_time && end_time?.format(\"hh:mm A\");\n const Time = (\n <>\n \n
\n {editable ? (\n {timeIcon}
\n Time
\n \n
\n ) : (\n {formattedEndTime}
\n )}\n \n );\n const timeDurationDropdown = (\n sec
\n min
\n hr
\n \n
\n );\n\n const campaignVideoLength = (\n <>\n \n {campaign_video_length_type ? (\n campaign_video_length_type\n ) : (\n Select\n )}\n
\n{dropdownIcon}
\n\n
\n {editable ? (\n {timeLimiIcon}
\n Video Length
\n \n
\n ) : (\n \n {\n dispatch(\n updateCampaignFields({\n campaign_video_length: e.target.value,\n })\n );\n }}\n placeholder=\"3\"\n />\n
\n \n \n \n {timeDurationType}\n \n {timeDurationDropdown}\n \n
\n \n {`${form?.campaign_video_length} ${campaign_video_length_type}`}\n
\n )}\n \n );\n\n const handlePlatformChange = (value) => {\n let updatedPlatforms = [...form.campaign_upload_platform];\n if (updatedPlatforms.includes(value)) {\n updatedPlatforms = updatedPlatforms.filter(\n (platform) => platform !== value\n );\n } else {\n updatedPlatforms.push(value);\n }\n dispatch(\n updateCampaignFields({ campaign_upload_platform: updatedPlatforms })\n );\n };\n\n const campaignPlatforms = (\n \n
\n \n );\n\n const dispatch = useDispatch();\n const styles = {\n marginLeft: \"25px\",\n marginTop: \"35px\",\n color: \"#783AD0\",\n fontSize: \"20px\",\n display: \"flex\",\n alignItems: \"center\",\n };\n\n return (\n \n
\n )}\n \n {PlatformSubmit}\n
\n \n Video Submission\n
\n {!editable && (\n \n Share Video\n
\n )}\n {editable && (\n \n
\n \n {selectedPlatformData.map((platform, index) => (\n
\n \n
\n ))}\n \n {platformData.map((platform, index) => (\n \n \n
\n ))}\n \n
\n )}\n\n \n \n {/*
\n FRESHLY LOGO
*/}\n\n {editable && (\n \n setIsColorPickerOpen(true)}\n >\n
\n Background Color
\n \n {isColorPickerOpen && (\n
\n \n
\n )}\n \n
\n {/* head line */}\n {headline}\n {/* hashtags */}\n {hashtags}\n {/* product image */}\n {productimage}\n\n {/* discription */}\n \n
\n {rewardOther}\n \n ) : null}\n\n \n
\n {Reward}\n {\" \"}\n {/* {form.campaign_reward_type === \"Discount\" &&\n form.campaign_reward !== \"\" ? (\n\n \n %\n \n ) : (\n \"\"\n )} */}\n {rewardIcon}
\n Reward
\n \n
\n\n \n
\n {EndDate}\n {calenderIcon}
\n End Date
\n \n {editable || end_time !== \"\" ? Time : null}\n
\n \n {editable ||\n (form.campaign_video_length !== \"\" &&\n campaign_video_length_type !== \"\")\n ? campaignVideoLength\n : null}\n
\n \n {editable || form?.campaign_upload_platform.length !== 0\n ? campaignPlatforms\n : null}\n
\n \n {discriptions}\n {brandInstructions}\n\n Terms and Conditions
\n {termAndCondition}\n\n\n
\n \n
\n \n \n Upload Video\n \n
\n {editable && (\n \n setIsColorPickerButton(true)}\n >\n
\n \n {isColorPickerButton && (\n
\n \n
\n )}\n \n {isColorPickerButtonText && (\n
\n \n )}\n \n \n {!editable && showCampaignStep && (\n \n
\n )}\n \n \n {copyIcon}\n {copied ? \"Copied\" : \"Copy Link\"}\n
\n \n \n {editIcon}\n {\" \"}\n {\"Edit Campaign\"}\n
\n \n )}\n \n {editable && (\n \n setOpen(true)}\n disabled={open}\n color={`${open} ? secondary : primary`}\n style={{ background: open ? \"#C4C4C4\" : \"\" }}\n >\n Next\n \n
\n )}\n \n );\n};\n\nexport default FormStep4;\n","import { useSelector } from \"react-redux\";\nimport { QRCode } from \"react-qrcode-logo\";\nimport { useEffect, useState } from \"react\";\nimport { Spinner } from \"reactstrap\";\n\nconst QRCodeGenerator = ({\n size,\n width,\n id,\n loading,\n setLoading,\n imageData,\n setImageData,\n qrcode,\n}) => {\n const campaign_response = useSelector(\n (state) => state.campaign_states.campaign_response\n );\n const form = useSelector((state) => state.campaign_states.form);\n const campaignUrl = `${process.env.REACT_APP_CAMPAGIN_URL}/form/${campaign_response?._id}/landing`;\n const corsProxyUrl = \"https://api.allorigins.win/raw?url=\";\n\n const imageUrlToBase64 = async (url) => {\n const data = await fetch(url);\n const blob = await data.blob();\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n reader.readAsDataURL(blob);\n reader.onloadend = () => {\n const base64data = reader.result;\n resolve(base64data);\n };\n reader.onerror = reject;\n });\n };\n\n useEffect(() => {\n const timer = setTimeout(() => {\n if (form.campaign_brand_image?.includes(\"data\")) {\n setLoading(false);\n setImageData(form.campaign_brand_image);\n } else {\n setLoading(true);\n imageUrlToBase64(`${corsProxyUrl}${form.campaign_brand_image}`)\n .then((data) => {\n setImageData(data);\n setLoading(false);\n })\n .catch((error) => {\n console.error(\"Error:\", error);\n });\n }\n }, 2000);\n\n return () => clearTimeout(timer);\n }, [form.campaign_brand_image]);\n\n return (\n \n {loading && !qrcode ? (\n \n
\n ) : (\n \n
\n )}\n \n );\n};\nexport default QRCodeGenerator;\n","import { useEffect, useRef, useState } from \"react\";\nimport html2canvas from \"html2canvas\";\nimport {\n Dropdown,\n DropdownItem,\n DropdownMenu,\n DropdownToggle,\n} from \"reactstrap\";\nimport jsPDF from \"jspdf\";\nimport QRCodeGenerator from \"./QRCodeGenerator\";\nimport FormStepsModal from \"./FormStepsModal\";\nimport FormStep4QRModal from \"./FormStep4QRModal\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { Button } from \"reactstrap\";\nimport * as htmlToImage from \"html-to-image\";\nimport { toPng, toJpeg, toBlob, toPixelData, toSvg } from \"html-to-image\";\nimport { updateCampaignFields } from \"../CampaignActions\";\n// import gql from \"graphql-tag\";\nimport { gql, useMutation, useQuery } from \"@apollo/client\";\nimport {\n downloadIcon,\n shareIcon,\n copyIcon,\n copyIconSteps,\n downloadIconbanner,\n} from \"../../../Shared/SVGs/Shared\";\nimport { removeQueryParams } from \"../../../utilities\";\n\nconst GET_CAMPAIGN = gql`\n mutation MyMutation($campaignId: ID!, $campaign: clipupInput!) {\n updateCampaign(campaignId: $campaignId, campaign: $campaign) {\n _id\n generate_qr\n }\n }\n`;\n\nconst Step5 = ({ qrcode, setQrcode }) => {\n const activeStep = useSelector((state) => state.campaign_states.activeStep);\n const [qrModal, setQrModal] = useState(false);\n const toggleQrModal = () => setQrModal(!qrModal);\n const toggleQrModals = () => {\n setQrModal(false);\n };\n const [isOpen, setIsOpen] = useState(false);\n const [copied, setCopied] = useState(false);\n const [loading, setLoading] = useState(false);\n const [imageData, setImageData] = useState(null);\n const form = useSelector((state) => state.campaign_states.form);\n const banner_with_qr = useSelector(\n (state) => state.campaign_states.form.banner_with_qr\n );\n const banner_share_url = useSelector(\n (state) => state.campaign_states.form.banner_share_url\n );\n const campaign_response = useSelector(\n (state) => state.campaign_states.campaign_response\n );\n const dispatch = useDispatch();\n\n const [\n updateCampaign,\n { data: CampaignData, loading: createCampaignLoading, error },\n ] = useMutation(GET_CAMPAIGN, {\n onError: (error) => {\n console.log(error);\n },\n });\n\n useEffect(() => {\n if (campaign_response?._id) {\n updateCampaign({\n variables: {\n campaign: { generate_qr: \"Generated\" },\n campaignId: campaign_response?._id,\n },\n });\n }\n }, [campaign_response]);\n\n const componentRef = useRef(null);\n const campaignUrl = `${process.env.REACT_APP_CAMPAGIN_URL}/form/${campaign_response?._id}/landing`;\n const handleCopyClick = () => {\n setCopied(!copied);\n navigator.clipboard.writeText(campaignUrl);\n };\n const toggleDropdown = () => {\n setIsOpen(!isOpen);\n };\n\n const GET_PRESIGNED_URL = gql`\n query GetPresignedURL($fileName: String!) {\n getPresignedURL(fileName: $fileName)\n }\n `;\n\n // console.log(form?.banner_with_qr);\n const UPLOAD_IMAGE_MUTATION = gql`\n mutation MyMutation($imgData: String!, $fileName: String!) {\n imageUpload(imgData: $imgData, fileName: $fileName)\n }\n `;\n\n const currentDate = new Date();\n const hours = currentDate.getHours().toString().padStart(2, \"0\");\n const minutes = currentDate.getMinutes().toString().padStart(2, \"0\");\n const seconds = currentDate.getSeconds().toString().padStart(2, \"0\");\n\n const { refetch } = useQuery(GET_PRESIGNED_URL, {\n skip: true,\n });\n\n const handleImageUpload = async () => {\n try {\n const imgData = form?.banner_with_qr;\n const fileName = `banner-${hours}:${minutes}:${seconds}`;\n // Get presigned URL\n const { data: urlData } = await refetch({\n fileName: fileName + imgData.name,\n });\n\n // Upload File to preassigned URL\n const uploadImageResponse = await fetch(urlData.getPresignedURL, {\n method: \"PUT\",\n headers: {\n \"Content-Type\": imgData?.type,\n },\n body: imgData,\n });\n\n if (!uploadImageResponse.ok) {\n setLoading(false);\n throw new Error(\"Failed to upload image\");\n }\n dispatch(\n updateCampaignFields({\n banner_share_url: removeQueryParams(urlData.getPresignedURL),\n })\n );\n } catch (error) {\n // console.error(\"Error uploading image:\", error);\n }\n };\n const handleDownload = (format) => {\n const imageElement = document.getElementById(\n qrcode ? \"banner\" : \"image-to-download\"\n );\n\n if (imageElement) {\n html2canvas(imageElement, { useCORS: true })\n .then((canvas) => {\n const dataUrl = canvas.toDataURL(`image/${format}`);\n const link = document.createElement(\"a\");\n link.download = `image.${format}`;\n link.href = dataUrl;\n link.click();\n })\n .catch((error) => {\n console.error(\"Error generating canvas: \", error);\n });\n }\n };\n\n const handleDownloadPdf = () => {\n const imageElement = document.getElementById(\n qrcode ? \"banner\" : \"image-to-download\"\n );\n if (imageElement) {\n html2canvas(imageElement, { useCORS: true })\n .then((canvas) => {\n const pdf = new jsPDF();\n const imgWidth = 180; // Adjust this width as needed for your PDF\n const imgHeight = (canvas.height * imgWidth) / canvas.width;\n const imgData = canvas.toDataURL(\"image/jpeg\");\n\n pdf.addImage(imgData, \"JPEG\", 0, 0, imgWidth, imgHeight);\n pdf.save(\"image.pdf\");\n })\n .catch((error) => {\n console.error(\"Error generating PDF: \", error);\n });\n }\n };\n\n const canvasRef = useRef(null);\n\n const toggleChangeContent = () => {\n setQrcode(!qrcode);\n setTimeout(() => {\n html2canvas(canvasRef.current, { useCORS: true, allowTaint: false })\n .then((canvas) => {\n const resizedCanvas = document.createElement(\"canvas\");\n const resizedContext = resizedCanvas.getContext(\"2d\");\n const extraSpace = 100;\n const scaleFactor = Math.min(\n 700 / canvas.width,\n (700 - extraSpace) / canvas.height\n );\n const newWidth = canvas.width * scaleFactor;\n const newHeight = (canvas.height - extraSpace) * scaleFactor;\n resizedCanvas.width = newWidth;\n resizedCanvas.height = newHeight;\n resizedContext.drawImage(\n canvas,\n 0,\n 0,\n canvas.width,\n canvas.height,\n 0,\n 0,\n newWidth,\n newHeight\n );\n resizedCanvas.toBlob((blob) => {\n if (blob) {\n const file = new File([blob], \"image.png\", { type: \"image/png\" });\n dispatch(updateCampaignFields({ banner_with_qr: file }));\n } else {\n console.error(\"Resized canvas toBlob conversion failed.\");\n }\n }, \"image/png\");\n })\n .catch((error) => {\n console.error(\"html2canvas error:\", error);\n });\n }, 1000);\n };\n\n useEffect(() => {\n if (banner_with_qr) {\n handleImageUpload();\n }\n }, [banner_with_qr]);\n\n const style = { width: \"158px\", color: \"#783ad0\", textAlign: \"center\" };\n\n const dropdown = (\n QR Code
\n \n Participants can scan this QR code and easily upload their video to\n participate in your campaign.\n
\n \n
\n \n \n
\n \n \n {copyIconSteps} {copied ? \"Copied\" : \"Copy\"}\n
\n \n \n \n \n
\n \n {downloadIcon}\n
\n \n {dropdown}\n Download
\n \n
\n \n Preview Campaign Banner with QR Code\n
\n {showCampaignStep && (\n \n \n
\n \n
\n \n
\n \n \n {campaign_response?.name}\n \n Scan QR code to know more\n
\n \n
\n \n
\n \n \n \n
\n {!showCampaignStep && (\n \n \n \n \n
\n \n
\n \n {dropdown}\n {downloadIconbanner}
\n Download
\n \n
\n \n
\n {shareIcon}
\n Share
\n \n {qrcode ? banner : QRCode}\n {activeStep === 5 && (\n
\n );\n};\n\nexport default Step5;\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { gql, useMutation, useQuery } from \"@apollo/client\";\nimport { useNavigate } from \"react-router-dom\";\nimport { useLocation } from \"react-router-dom\";\nimport \"./styles/CreateCampaign.scss\";\nimport \"./styles/pages.scss\";\n// import FormHeader from \"./Components/StepsAction/\";\nimport Step1 from \"./Components/Step1\";\nimport { dot } from \"../../Shared/SVGs/Shared\";\nimport StepIndecator from \"./Components/StepIndecator\";\nimport StepsButton from \"./Components/StepsButton\";\nimport Step2 from \"./Components/Step2\";\nimport Step3 from \"./Components/Step3\";\nimport Step4 from \"./Components/Step4\";\nimport Step5 from \"./Components/Step5\";\nimport { getCurrentTimezone, removeQueryParams } from \"../../utilities\";\nimport { updateCampaignFields, updateCampaignState } from \"./CampaignActions\";\nimport moment from \"moment\";\nimport { EditorState, convertToRaw, convertFromRaw } from \"draft-js\";\nimport Cookies from \"js-cookie\";\n\nconst GET_PRESIGNED_URL = gql`\n query GetPresignedURL($fileName: String!) {\n getPresignedURL(fileName: $fileName)\n }\n`;\n\nconst GET_CAMPAIGN = gql`\n mutation MyMutation($campaignId: ID!, $campaign: clipupInput!) {\n updateCampaign(campaignId: $campaignId, campaign: $campaign) {\n _id\n name\n logo_url\n banner_url\n reward_type\n reward\n start_date\n end_date\n start_time\n end_time\n hash_tag\n timezone\n campaign_product\n generate_qr\n campaign_description\n terms_and_conditions\n termAndConditionRenderAs\n descriptionRenderAs\n ongoing\n manufacturer {\n _id\n name\n }\n products {\n _id\n name\n }\n rating_enabled\n video_time_limit\n bannerRenderAs\n clicks\n status\n description_editor_state\n terms_and_conditions_editor_state\n color_change_hashtag\n preview_color_change\n campaign_headline_editor\n brand_instruction\n campaign_hashtag_editor\n campaign_video_length_type\n campaign_button_color\n campaign_button_text_color\n brand_instruction_editor_state\n hashtag_editor_state\n headline_editor_state\n campaign_upload_platform\n }\n }\n`;\n\nconst CreateCampaign = () => {\n const [qrcode, setQrcode] = useState(false);\n const [editable, setEditable] = useState(false);\n const [isColorPickerOpen, setIsColorPickerOpen] = useState(false);\n const [isColorPickerOpen1, setIsColorPickerOpen1] = useState(false);\n const activeStep = useSelector((state) => state.campaign_states.activeStep);\n const form = useSelector((state) => state.campaign_states.form);\n const campaign_states = useSelector((state) => state.campaign_states);\n const timezones = useSelector((state) => state.campaign_states.timezones);\n const campaign_response = useSelector(\n (state) => state.campaign_states.campaign_response\n );\n const campaign_video_length_type = useSelector(\n (state) => state.campaign_states.form.campaign_video_length_type\n );\n const dispatch = useDispatch();\n\n const editHandler = () => {\n if (campaign_response?._id) {\n handleSubmit();\n }\n setEditable(!editable);\n setIsColorPickerOpen(false);\n setIsColorPickerOpen1(false);\n };\n\n const [\n updateCampaign,\n { data: CampaignData, loading: createCampaignLoading, error },\n ] = useMutation(GET_CAMPAIGN, {\n skip: true,\n onError: (error) => {\n console.log(error);\n },\n });\n\n const { refetch } = useQuery(GET_PRESIGNED_URL, {\n skip: true,\n });\n\n const handleSubmit = async () => {\n const {\n campaign_headline,\n campaign_hashtag,\n campaign_brand_name,\n campaign_brand_image,\n campaign_reward,\n start_date,\n end_date,\n start_time,\n end_time,\n campaign_timezone,\n products,\n ongoing,\n campaign_video_limit,\n campaign_allow_rating,\n campaign_video_length,\n terms_and_conditions,\n campaign_description,\n campaign_reward_type,\n campaign_banner_image_file,\n campaign_banner_image_preview,\n image_dimensions,\n description_editor_state,\n terms_and_conditions_editor_state,\n brand_instruction,\n brand_instruction_editor_state,\n campaign_video_length_type,\n campaign_headline_editor,\n campaign_hashtag_editor,\n headline_editor_state,\n hashtag_editor_state,\n preview_color_change,\n campaign_button_color,\n campaign_button_text_color,\n campaign_upload_platform,\n } = form;\n try {\n let serializedContentDesc = null;\n let serializedContentBrand = null;\n let serializedContentHashtag = null;\n let serializedContentHeadline = null;\n let serializedContentTerm = null;\n\n if (description_editor_state) {\n const rawContentStateDesc = convertToRaw(\n description_editor_state.getCurrentContent()\n );\n serializedContentDesc = JSON.stringify(rawContentStateDesc);\n }\n\n if (headline_editor_state) {\n const rawContentStateHead = convertToRaw(\n headline_editor_state.getCurrentContent()\n );\n serializedContentHeadline = JSON.stringify(rawContentStateHead);\n }\n\n if (hashtag_editor_state) {\n const rawContentStateHash = convertToRaw(\n hashtag_editor_state.getCurrentContent()\n );\n serializedContentHashtag = JSON.stringify(rawContentStateHash);\n }\n\n if (brand_instruction_editor_state) {\n const rawContentStateBrand = convertToRaw(\n brand_instruction_editor_state.getCurrentContent()\n );\n serializedContentBrand = JSON.stringify(rawContentStateBrand);\n }\n\n if (terms_and_conditions_editor_state) {\n const rawContentStateTerm = convertToRaw(\n terms_and_conditions_editor_state.getCurrentContent()\n );\n serializedContentTerm = JSON.stringify(rawContentStateTerm);\n }\n const newProducts = products\n ?.filter((product) => product?.__isNew__)\n .map((product) => product?.label);\n\n const formattedStartTime = start_time.format(\"HH:mm\");\n const formattedEndTime = end_time && end_time.format(\"HH:mm\");\n\n const formattedStartDate = moment(start_date).set({\n hour: start_time.hour(),\n minute: start_time.minute(),\n });\n\n const formattedEndDate = ongoing\n ? false\n : moment(end_date).set({\n hour: end_time.hour(),\n minute: end_time.minute(),\n });\n\n let campaignBannerImage = campaign_banner_image_preview || \"\";\n\n if (campaign_banner_image_file) {\n const { data: urlData } = await refetch({\n fileName: campaign_banner_image_file.name,\n });\n\n // Upload File to preassigned URL\n const uploadImageResponse = await fetch(urlData.getPresignedURL, {\n method: \"PUT\",\n headers: {\n \"Content-Type\": campaign_banner_image_file.type,\n },\n body: campaign_banner_image_file,\n });\n\n if (!uploadImageResponse.ok) {\n setLoading(false);\n throw new Error(\"Failed to upload image\");\n }\n\n campaignBannerImage = removeQueryParams(urlData.getPresignedURL);\n }\n\n const campaignData = {\n description_editor_state: serializedContentDesc,\n brand_instruction_editor_state: serializedContentBrand,\n headline_editor_state: serializedContentHeadline,\n hashtag_editor_state: serializedContentHashtag,\n terms_and_conditions_editor_state: serializedContentTerm,\n status: \"\",\n campaign_banner_image: campaignBannerImage,\n campaign_hashtag,\n campaign_brand_image,\n campaign_brand_name,\n campaign_description,\n brand_instruction,\n campaign_headline_editor,\n campaign_upload_platform,\n campaign_hashtag_editor,\n campaign_headline,\n preview_color_change,\n campaign_button_color,\n campaign_button_text_color,\n campaign_product: \"campaign_product\",\n campaign_reward,\n campaign_reward_type,\n campaign_timezone,\n manufacturer: {\n _id: Cookies.get(\"bId\"),\n name: campaign_brand_name,\n },\n products: products\n ?.filter((product) => !product?.__isNew__)\n .map((product) => ({\n _id: product?.value,\n name: product?.label,\n })),\n ...(newProducts?.length > 0 && { newProducts }),\n start_date: formattedStartDate,\n start_time: formattedStartTime,\n ...(ongoing ? {} : { end_date: formattedEndDate }),\n ongoing,\n end_time: formattedEndTime,\n terms_and_conditions,\n ...(campaign_video_limit > 0 && { campaign_video_limit }),\n campaign_allow_rating,\n campaign_video_time_limit: `${campaign_video_length}`,\n campaign_video_length_type,\n descriptionRenderAs: \"html\",\n termAndConditionRenderAs: \"html\",\n bannerRenderAs: image_dimensions,\n };\n\n const { data: response } = await updateCampaign({\n variables: {\n campaign: campaignData,\n campaignId: campaign_response._id,\n },\n });\n\n if (response) {\n dispatch(\n updateCampaignState({ campaign_response: response.updateCampaign })\n );\n }\n } catch (error) {\n console.error(error);\n }\n };\n\n useEffect(() => {\n const myTimezone = getCurrentTimezone();\n const timezoneExists = timezones.some((tz) => tz.value === myTimezone);\n if (!timezoneExists) {\n dispatch(\n updateCampaignState({\n timezones: [...timezones, { value: myTimezone, label: myTimezone }],\n })\n );\n }\n }, []);\n\n const location = useLocation();\n\n useEffect(() => {\n const params = new URLSearchParams(location.search);\n const id = params.get(\"id\");\n if (id) {\n updateCampaign({\n variables: {\n campaign: {},\n campaignId: id,\n },\n }).then((result) => {\n if (result.data && result.data.updateCampaign) {\n const campaignData = result.data.updateCampaign;\n dispatch(updateCampaignState({ campaign_response: campaignData }));\n\n let editorStateDesc = EditorState.createEmpty();\n if (campaignData?.description_editor_state) {\n try {\n const rawContentStateDesc = JSON.parse(\n campaignData?.description_editor_state\n );\n rawContentStateDesc.entityMap =\n rawContentStateDesc?.entityMap || {};\n const contentStateDesc = convertFromRaw(rawContentStateDesc);\n editorStateDesc = EditorState.createWithContent(contentStateDesc);\n } catch (error) {\n console.error(\"Error parsing description_editor_state:\", error);\n }\n }\n\n let editorStateBrand = EditorState.createEmpty();\n if (campaignData?.brand_instruction_editor_state) {\n try {\n const rawContentStateBrand = JSON.parse(\n campaignData?.brand_instruction_editor_state\n );\n rawContentStateBrand.entityMap =\n rawContentStateBrand?.entityMap || {};\n const contentStateBrand = convertFromRaw(rawContentStateBrand);\n editorStateBrand =\n EditorState.createWithContent(contentStateBrand);\n } catch (error) {\n console.error(\"Error parsing description_editor_state:\", error);\n }\n }\n\n let editorStateHead = EditorState.createEmpty();\n if (campaignData?.headline_editor_state) {\n try {\n const rawContentStateHead = JSON.parse(\n campaignData?.headline_editor_state\n );\n rawContentStateHead.entityMap =\n rawContentStateHead?.entityMap || {};\n const contentStateHead = convertFromRaw(rawContentStateHead);\n editorStateHead = EditorState.createWithContent(contentStateHead);\n } catch (error) {\n console.error(\"Error parsing description_editor_state:\", error);\n }\n }\n\n let editorStateHash = EditorState.createEmpty();\n if (campaignData?.hashtag_editor_state) {\n try {\n const rawContentStateHash = JSON.parse(\n campaignData?.hashtag_editor_state\n );\n rawContentStateHash.entityMap =\n rawContentStateHash?.entityMap || {};\n const contentStateHash = convertFromRaw(rawContentStateHash);\n editorStateHash = EditorState.createWithContent(contentStateHash);\n } catch (error) {\n console.error(\"Error parsing description_editor_state:\", error);\n }\n }\n\n let editorStateTerm = EditorState.createEmpty();\n if (campaignData?.terms_and_conditions_editor_state) {\n try {\n const rawContentStateTerm = JSON.parse(\n campaignData?.terms_and_conditions_editor_state\n );\n rawContentStateTerm.entityMap =\n rawContentStateTerm?.entityMap || {};\n const contentStateTerm = convertFromRaw(rawContentStateTerm);\n editorStateTerm = EditorState.createWithContent(contentStateTerm);\n } catch (error) {\n console.error(\n \"Error parsing terms_and_conditions_editor_state:\",\n error\n );\n }\n }\n\n dispatch(\n updateCampaignFields({\n _id: campaignData?._id,\n image_dimensions: campaignData?.bannerRenderAs,\n campaign_banner_image_preview: campaignData?.banner_url,\n descriptionRenderAs: campaignData?.descriptionRenderAs,\n terms_and_conditions: campaignData?.terms_and_conditions,\n campaign_description: campaignData?.campaign_description,\n description_editor_state: editorStateDesc,\n campaign_upload_platform: campaignData?.campaign_upload_platform,\n brand_instruction_editor_state: editorStateBrand,\n hashtag_editor_state: editorStateHash,\n headline_editor_state: editorStateHead,\n terms_and_conditions_editor_state: editorStateTerm,\n ...(campaignData?.end_date && {\n end_date: campaignData?.ongoing\n ? \"\"\n : moment(campaignData?.end_date),\n }),\n ...(campaignData?.end_date && {\n end_time: campaignData?.ongoing\n ? \"\"\n : moment(campaignData?.end_date),\n }),\n ongoing: campaignData?.ongoing,\n campaign_hashtag: campaignData?.hash_tag,\n campaign_brand_image_preview: campaignData?.logo_url,\n campaign_brand_image: campaignData?.logo_url,\n campaign_headline: campaignData?.name,\n campaign_allow_rating: campaignData?.rating_enabled,\n ...(campaignData?.start_date && {\n start_date: moment(campaignData?.start_date),\n }),\n ...(campaignData?.start_date && {\n start_time: moment(campaignData?.start_date),\n }),\n campaign_timezone: campaignData?.timezone,\n campaign_brand_name: campaignData?.manufacturer?.name,\n products: campaignData?.products?.name,\n campaign_video_length: campaignData?.video_time_limit,\n campaign_reward_type: campaignData?.reward_type,\n campaign_reward: campaignData?.reward,\n brand_instruction: campaignData?.brand_instruction,\n campaign_video_length_type:\n campaignData?.campaign_video_length_type,\n campaign_headline_editor: campaignData?.campaign_headline_editor,\n campaign_hashtag_editor: campaignData?.campaign_hashtag_editor,\n preview_color_change: campaignData?.preview_color_change,\n campaign_button_color: campaignData?.campaign_button_color,\n campaign_button_text_color:\n campaignData?.campaign_button_text_color,\n })\n );\n }\n });\n }\n }, []);\n\n return (\n \n \n Preview\n \n
\n )}\n \n
\n );\n};\nexport default CreateCampaign;\n","import { useEffect, useState } from \"react\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { useNavigate, useLocation } from \"react-router-dom\";\nimport { videoCategories } from \"../../constants\";\nimport Categories from \"../Components/Categories\";\nimport IndexHeader from \"../../Shared/IndexHeader\";\nimport MultiPublish from \"./Components/MultiPublish\";\nimport { usePrevious } from \"../../Shared/CustomHooks\";\nimport VideoIndexContainer from \"./VideoIndexContainer\";\nimport VideoPageHeader from \"./Components/VideoPageHeader\";\nimport TranscriptModel from \"../../Shared/DownloadTranscriptModel\";\nimport { getVideoUploadDetails } from \"../../Pages/Home/home_actions\";\nimport { updateTutorialState } from \"../../Shared/Tutorials/TutorialActions\";\nimport UploadVideoProcess from \"../../Shared/VideosProcess/UploadVideoProcess\";\nimport {\n updateVideoPageState,\n updateParams,\n downloadAllTranscript,\n fetchCampaignList,\n doResetFiltersVideos,\n updateCampaignState,\n} from \"./VideoActions\";\nimport Cookies from \"js-cookie\";\nimport CampaignListPage from \"./CampaignListPage\";\nimport VideoHeaderNew from \"../../Shared/VideoHeaderNew\";\n\nconst CampaignDetailPage = () => {\n const [search, setSearch] = useState(\"\");\n const [openTranscriptModel, setOpenTranscriptModel] = useState(false);\n const [uploadVideoModal, setUploadVideoModal] = useState(false);\n const [limitReachedModal, setLimitReachedModal] = useState(false);\n const [openMultiPublish, setOpenMultiPublish] = useState(false);\n const [uploadVideoDetails, setUploadVideoDetails] = useState({});\n\n const dispatch = useDispatch();\n const navigate = useNavigate();\n\n const videos = useSelector((state) => state.videos);\n const videoParams = useSelector((state) => state.videoParams);\n const roles = useSelector((state) => state.navbarStatsReducer.roles);\n const count = useSelector((state) => state.videoData.count);\n\n const widgetVideoCount = useSelector(\n (state) => state.videoData.widgetVideoCount\n );\n const totalPages = useSelector((state) => state.videoData.totalPages);\n const loadingTranscriptPdf = useSelector(\n (state) => state.downloadTranscript.loadingTranscriptPdf\n );\n\n const currentBrand = useSelector((state) => state.selectedBrandReducer);\n const campaignName = useSelector(\n (state) => state.videoPageStates.campaignsState.campaignName\n );\n const campaignId = useSelector(\n (state) => state.videoPageStates.campaignsState.campaignId\n );\n const isCategoryPage = useSelector(\n (state) => state.videoPageStates.isCategoryPage\n );\n const isCampaignListPage = useSelector(\n (state) => state.videoPageStates.isCampaignListPage\n );\n const { brand_id } = currentBrand;\n const prevBrand = usePrevious(brand_id);\n\n useEffect(() => {\n if (!loadingTranscriptPdf) setOpenTranscriptModel(false);\n }, [loadingTranscriptPdf]);\n\n useEffect(() => {\n if (!campaignId) {\n navigate(\"/videos\");\n }\n }, [!campaignId]);\n\n const truncateName = (name, wordLimit) => {\n const words = name.split(\" \");\n if (words.length > wordLimit) {\n return words.slice(0, wordLimit).join(\" \") + \"...\";\n }\n return name;\n };\n\n useEffect(() => {\n if (campaignId) {\n const truncatedName = truncateName(campaignName, 2);\n dispatch(\n updateParams({\n tab: \"Campaigns\",\n transcriptView: false,\n is_widget: false,\n search: \"\",\n page: 1,\n isTrashTab: false,\n isFlaggedTab: false,\n isFavoriteTab: false,\n isCampaignTab: true,\n campaignId: `${campaignId}`,\n })\n );\n dispatch(\n updateVideoPageState({\n isCampaignListPage: false,\n isCategoryPage: false,\n })\n );\n\n const campaignPageBreadcrumb = [\n {\n name: \"Campaigns\",\n tab: \"Campaigns\",\n type: \"tab\",\n link: \"/videos/campaigns\",\n page: \"videos\",\n },\n {\n name: `${truncatedName}`,\n isCampaign: true,\n // tab: \"Campaigns\",\n // type: \"tab\",\n link: \"\",\n // page: \"videos\",\n },\n ];\n dispatch(\n updateCampaignState({\n breadcrumbs: campaignPageBreadcrumb,\n showCampaignHeader: true,\n })\n );\n dispatch(\n updateParams({\n isCampaignTab: false,\n updateParamsOnly: true,\n })\n );\n }\n }, []);\n\n const fetchCampaignData = async () => {\n const manufacturerId = Cookies.get(\"bId\") || brand_id;\n fetchCampaignList(manufacturerId)\n .then((response) => {\n dispatch(\n updateVideoPageState({\n campaigns: response?.campaign,\n })\n );\n })\n .catch(() => {\n console.log(\"error fetchCampaignList\");\n });\n };\n\n const categoryHandler = (category) => {\n // console.log(category);\n fetchCampaignData();\n const activeTab =\n category.tab === \"flagged\" ||\n category.tab === \"favorites\" ||\n category.tab === \"Campaigns\" ||\n category.tab === \"Trash\"\n ? \"My Videos\"\n : category.tab;\n\n if (category.tab === \"Campaigns\") {\n dispatch(\n updateParams({\n tab: \"Campaigns\",\n transcriptView: false,\n is_widget: false,\n search: \"\",\n page: 1,\n isTrashTab: false,\n isFlaggedTab: false,\n isFavoriteTab: false,\n isCampaignTab: true,\n updateParamsOnly: true,\n })\n );\n dispatch(\n updateVideoPageState({\n isCategoryPage: false,\n isCampaignListPage: true,\n })\n );\n navigate(\"/videos/campaigns\");\n } else {\n // if (category.tab) {\n // Cookies.set(\"activeTab\", JSON.stringify(category));\n dispatch(\n updateCampaignState({ breadcrumbs: [], showCampaignHeader: false })\n );\n // dispatch(fetchNotes(\"video\"));\n\n dispatch(\n updateParams({\n tab: activeTab,\n transcriptView: false,\n is_widget: false,\n search: \"\",\n page: 1,\n campaignId: \"\",\n isTrashTab: category.tab === \"Trash\",\n isFlaggedTab: category.tab === \"flagged\",\n isFavoriteTab: category.tab === \"favorites\",\n isCampaignTab: category.tab === \"Campaigns\",\n })\n );\n dispatch(updateVideoPageState({ isCategoryPage: false }));\n\n // @TODO:THIS SHOULD BE UPDATE AFTER SAVE VIDEO BACKEND AVAILABLE\n if (localStorage.getItem(\"toturialScreen\") === \"firstVideo\") {\n dispatch(\n updateTutorialState({\n isTutorial: true,\n activeTutorial: \"first-video\",\n activeStep: 1,\n totalSteps: 2,\n })\n );\n }\n\n if (\n localStorage.getItem(\"firstVideoAnalysisId\")?.split(\",\")[1] ==\n \"completed\"\n ) {\n dispatch(\n updateTutorialState({\n isTutorial: true,\n activeTutorial: \"first-video-analyzed\",\n activeStep: 2,\n totalSteps: 2,\n })\n );\n }\n // }\n }\n };\n\n const activeTab =\n Cookies.get(\"activeTab\") && JSON.parse(Cookies.get(\"activeTab\"));\n\n useEffect(() => {\n if (activeTab?.tab) {\n categoryHandler(activeTab);\n }\n }, []);\n\n const handleCloseTranscript = () => setOpenTranscriptModel(false);\n\n const verifiedCount = (\n fileType,\n downloadState = true,\n loadingTranscriptPdf = true\n ) => {\n dispatch(\n downloadAllTranscript({ downloadState, loadingTranscriptPdf, fileType })\n );\n };\n\n const downloadHandle = (fileType) => {\n if (count >= 50) {\n setOpenTranscriptModel(true);\n verifiedCount(fileType, false, false);\n } else {\n verifiedCount(fileType);\n }\n };\n\n const getBrandDetails = () => {\n getVideoUploadDetails({})\n .then((response) => {\n setUploadVideoDetails(response);\n })\n .catch((err) => {\n console.log(err);\n });\n };\n\n useEffect(() => {\n getBrandDetails();\n }, []);\n\n useEffect(() => {\n if (prevBrand && prevBrand !== brand_id) {\n getBrandDetails();\n setUploadVideoDetails({});\n fetchCampaignData();\n }\n }, [brand_id]);\n\n const handleCloseMultiPublish = () => setOpenMultiPublish(false);\n\n useEffect(() => {\n // This code will run when the component mounts\n return () => {\n // This code will run when the component unmounts\n dispatch(\n updateCampaignState({ breadcrumbs: [], showCampaignHeader: false })\n );\n };\n }, [dispatch]);\n\n // const headerElements = (\n // \n
\n \n
\n \n
\n \n\n
\n
\n\n \n
\n\n Skin
\n{renderSkinsRadio()}
\n \n
\n\n Content Width
\n\n
\n \n setContentWidth(\"full\")}\n />\n \n
\n \n setContentWidth(\"boxed\")}\n />\n \n
\n \n
\n\n \n setIsRtl(!isRtl)}\n />\n
\n RTL
\n\n
\n \n setTransition(value)}\n />\n
\n Router Transition
\n\n\n
\n
\n\n Menu Layout
\n\n
\n {layout !== \"horizontal\" ? (\n \n
\n \n {\n setLayout(\"vertical\");\n setLastLayout(\"vertical\");\n }}\n />\n \n
\n \n {\n setLayout(\"horizontal\");\n setLastLayout(\"horizontal\");\n }}\n />\n \n
\n \n
\n ) : null}\n\n \n setMenuCollapsed(!menuCollapsed)}\n />\n
\n Menu Collapsed
\n\n
\n \n
\n Menu Hidden
\n\n\n
\n {layout !== \"horizontal\" ? (\n
\n\n \n
\n ) : null}\n\n Navbar Color
\n- \n {renderNavbarColors()}\n
\n
\n \n {layout === \"horizontal\" ? \"Menu\" : \"Navbar\"} Type\n
\n{renderNavbarTypeRadio()}
\n \n\n
\n
\n \n \n );\n};\n\nexport default Customizer;\n","// ** React Imports\nimport { useEffect, useState } from \"react\";\n\n// ** Third Party Components\nimport Proptypes from \"prop-types\";\n\nconst ScrollTop = (props) => {\n // ** Props\n const { showOffset, scrollBehaviour, children, ...rest } = props;\n\n // ** State\n const [visible, setVisible] = useState(false);\n\n useEffect(() => {\n if (window) {\n window.addEventListener(\"scroll\", () => {\n if (window.pageYOffset >= showOffset) {\n setVisible(true);\n } else {\n setVisible(false);\n }\n });\n }\n }, []);\n\n const handleScrollToTop = () => {\n window.scroll({ top: 0, behavior: scrollBehaviour });\n };\n\n return (\n visible && (\n \n
\n Footer Type
\n{renderFooterTypeRadio()}
\n \n {children}\n
\n )\n );\n};\n\nexport default ScrollTop;\n\n// ** PropTypes\nScrollTop.propTypes = {\n showOffset: Proptypes.number,\n children: Proptypes.any.isRequired,\n scrollBehaviour: Proptypes.oneOf([\"smooth\", \"instant\", \"auto\"]),\n};\n\nScrollTop.defaultProps = {\n scrollBehaviour: \"smooth\",\n};\n","// ** Icons Import\nimport { Heart } from \"react-feather\";\n\nconst Footer = () => {\n return (\n \n \n COPYRIGHT © {new Date().getFullYear()}{\" \"}\n
\n {currentUser &&\n currentUser.first_name.charAt(0) + currentUser.last_name.charAt(0)}\n
\n \n \n {currentUser &&\n currentUser.first_name + \" \" + currentUser.last_name}\n \n \n {roles && roles[0]?.replace(/_/gi, \" \")}\n \n
\n \n \n
\n {trending_videos_count > 0 && (\n \n Today\n
\n {/* @TODO */}\n \n ({trending_videos_count > 0 ? 1 : 0})\n
\n \n
\n )}\n {count == 0 && (\n \n \n
\n You have new trending videos
\n \n
\n \n
\n )}\n {/* You have no new notification
\n \n
*/}\n {/* \n
\n You have new chat messages
\n \n
\n \n
*/}\n \n
\n Your customized report is ready
\n \n
\n \n
\n\n \n Next Week\n
\n \n
\n \n \n
\n You have new trending videos
\n \n
\n \n
\n \n
\n You have new chat messages
\n \n
\n - \n
\n
*/}\n \n \n {new Intl.DateTimeFormat(\"en-US\", {\n weekday: \"short\",\n // year: \"2-digit\",\n month: \"long\",\n day: \"2-digit\",\n }).format(new Date())}\n \n
\n - \n
\n setReleaseModal(!releaseModal)}\n />\n
\n \n
\n \n );\n};\n\nexport default ReleaseVersion;\n","// ** React Imports\nimport { Fragment, useState, useRef, useEffect } from \"react\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { useNavigate } from \"react-router-dom\";\n\n// ** Third Party Components\nimport classnames from \"classnames\";\nimport PerfectScrollbar from \"react-perfect-scrollbar\";\n\n// ** Vertical Menu Components\nimport NavbarHeader from \"../header/NavbarHeader\";\nimport VerticalNavMenuItems from \"../../../@core/layouts/components/menu/vertical-menu/VerticalNavMenuItems\";\n\nimport {\n Card,\n CardBody,\n CardText,\n CardTitle,\n Col,\n Dropdown,\n DropdownItem,\n DropdownMenu,\n DropdownToggle,\n Progress,\n Row,\n UncontrolledDropdown,\n} from \"reactstrap\";\nimport {\n Package,\n Video,\n Users,\n ChevronRight,\n Edit,\n Bell,\n Power,\n Settings,\n} from \"react-feather\";\nimport themeConfig from \"@configs/themeConfig\";\nimport \"./style.scss\";\nimport { fetchNavbarStats } from \"./navbarStatsActions\";\nimport { addDefaultSrc } from \"../../../utilities\";\nimport NavSelectBrand from \"./SwitchBrand/NavSelectBrand\";\nimport Cookies from \"js-cookie\";\nimport { usePrevious } from \"../../../Shared/CustomHooks\";\nimport { isEmpty } from \"lodash\";\n// import PubNub from \"../../../Pages/Chat/pubnub_container\";\nimport { isUserLoggedIn } from \"@utils\";\nimport { handleLogout } from \"@store/authentication\";\nimport { LOGOUT } from \"../../../Entry/session_actions\";\nimport { gql, useQuery } from \"@apollo/client\";\nimport ReleaseVersion from \"../../../Shared/PopUpModals/ReleaseVersion/ReleaseVersion\";\n\nconst MY_QUERY = gql`\n query MyQuery {\n getFrontEndAppVersion {\n id\n name\n projectId\n released\n releaseDate\n startDate\n userStartDate\n userReleaseDate\n description\n archived\n }\n }\n`;\n\nconst getPicture = (brandImage) => {\n const { profile_photo: profilePhoto } = brandImage || {};\n const { url } = profilePhoto || {};\n return url;\n};\n\nconst Sidebar = (props) => {\n // ** Props\n const { menuCollapsed, menu, skin, menuData } = props;\n const navbarStatsReducer = useSelector((state) => state.navbarStatsReducer);\n const selectedBrandReducer = useSelector(\n (state) => state.selectedBrandReducer\n );\n const { brand_id } = selectedBrandReducer;\n const dispatch = useDispatch();\n\n // ** States\n const [groupOpen, setGroupOpen] = useState([]);\n const [groupActive, setGroupActive] = useState([]);\n const [currentActiveGroup, setCurrentActiveGroup] = useState([]);\n const [activeItem, setActiveItem] = useState(null);\n const [anchorEl, setAnchorEl] = useState(false);\n // ** Menu Hover State\n const [menuHover, setMenuHover] = useState(false);\n const prevBrand_id = usePrevious(brand_id);\n const [userData, setUserData] = useState({});\n const [releaseModal, setReleaseModal] = useState(false);\n const navigate = useNavigate();\n\n // ** Ref\n const shadowRef = useRef(null);\n const { loading: versionLoading, error, data } = useQuery(MY_QUERY);\n\n useEffect(() => {\n if (Cookies.get(\"bId\")) {\n dispatch(fetchNavbarStats());\n }\n\n if (isUserLoggedIn() !== null) {\n setUserData(JSON.parse(localStorage.getItem(\"session\")));\n }\n }, []);\n\n useEffect(() => {\n if (prevBrand_id) {\n if (prevBrand_id !== brand_id) {\n dispatch(fetchNavbarStats());\n }\n }\n }, [brand_id]);\n\n // ** Function to handle Mouse Enter\n const onMouseEnter = () => {\n setMenuHover(true);\n };\n\n // ** Scroll Menu\n // const scrollMenu = (container) => {\n // if (shadowRef && container.scrollTop > 0) {\n // if (!shadowRef.current.classList.contains(\"d-block\")) {\n // shadowRef.current.classList.add(\"d-block\");\n // }\n // } else {\n // if (shadowRef.current.classList.contains(\"d-block\")) {\n // shadowRef.current.classList.remove(\"d-block\");\n // }\n // }\n // };\n\n const progressCircle = {\n height: \"9px\",\n width: \"9px\",\n borderRadius: \"50%\",\n display: \"inline-block\",\n margin: \"2px\",\n };\n\n const inActiveProgressCircle = {\n ...progressCircle,\n backgroundColor: \"#bbb\",\n };\n const activeProgressCircle = {\n ...progressCircle,\n backgroundColor: \"#6fd1c7\",\n };\n\n const { currentUser } = userData;\n\n const toggleDropDown = () => {\n setAnchorEl(!anchorEl);\n };\n\n const clearAll = () => {\n dispatch(handleLogout());\n dispatch({ type: LOGOUT });\n navigate(\"/login\");\n };\n\n const dropDownMenu = (\n App version info
\n \n
\n \n Version {data?.name} released at {releaseDate}\n
\n \n {data?.description}
\n \n navigate(\"/home\")}\n >\n addDefaultSrc(event)}\n />\n
\n\n {/* ) : (\n // onHover brand Image\n \n addDefaultSrc(event)}\n />\n
\n )} */}\n {/* \n addDefaultSrc(event)}\n onClick={() => navigate(\"/home\")}\n role=\"button\"\n />\n
*/}\n {/* \n 14\n ? { width: \"121px\", lineBreak: \"anywhere\" }\n : {}\n }\n >\n \n {navbarStatsReducer.currentBrand.name\n ? navbarStatsReducer.currentBrand.name.replace(\n /_/g,\n \" \"\n )\n : \"\"}\n \n \n
*/}\n \n\n {/* \n
*/}\n \n\n \n
\n \n \n {(navbarStatsReducer &&\n navbarStatsReducer.counts.products) ||\n 0}\n \n
\n\n Products
\n \n {\" \"}\n
\n \n \n {(navbarStatsReducer &&\n navbarStatsReducer.counts.videos) ||\n 0}\n \n
\n Videos
\n \n {\" \"}\n
\n \n \n {(navbarStatsReducer &&\n navbarStatsReducer.counts.influencers) ||\n 0}\n \n
\n Creators
\n \n {navbarStatsReducer.roles.includes(\"digital_agency\") && (\n
\n\n \n {navbar ? (\n navbar({ skin, setSkin, setMenuVisibility })\n ) : (\n
\n */}\n\n \n \n \n \n
\n ) : null}\n \n );\n};\n\nexport default VerticalLayout;\n","//** React Imports\nimport { useEffect } from \"react\";\n\n// ** Store & Actions\nimport { handleRTL } from \"@store/layout\";\nimport { useDispatch, useSelector } from \"react-redux\";\n\nexport const useRTL = () => {\n // ** Store Vars\n const dispatch = useDispatch();\n const isRtl = useSelector((state) => state.layout.isRTL);\n\n // ** Return a wrapped version of useState's setter function\n const setValue = (value) => {\n dispatch(handleRTL(value));\n };\n\n useEffect(() => {\n // ** Get HTML Tag\n const element = document.getElementsByTagName(\"html\")[0];\n\n // ** If isRTL then add attr dir='rtl' with HTML else attr dir='ltr'\n if (isRtl) {\n element.setAttribute(\"dir\", \"rtl\");\n } else {\n element.setAttribute(\"dir\", \"ltr\");\n }\n }, [isRtl]);\n\n return [isRtl, setValue];\n};\n","// ** Store Imports\nimport { handleNavbarType } from \"@store/layout\";\nimport { useDispatch, useSelector } from \"react-redux\";\n\nexport const useNavbarType = () => {\n // ** Hooks\n const dispatch = useDispatch();\n const store = useSelector((state) => state.layout);\n\n const setNavbarType = (type) => {\n dispatch(handleNavbarType(type));\n };\n\n return { navbarType: store.navbarType, setNavbarType };\n};\n","// ** Store Imports\nimport { handleFooterType } from \"@store/layout\";\nimport { useDispatch, useSelector } from \"react-redux\";\n\nexport const useFooterType = () => {\n // ** Hooks\n const dispatch = useDispatch();\n const store = useSelector((state) => state.layout);\n\n const setFooterType = (type) => {\n dispatch(handleFooterType(type));\n };\n\n return { setFooterType, footerType: store.footerType };\n};\n","// ** Store Imports\nimport { handleNavbarColor } from \"@store/layout\";\nimport { useDispatch, useSelector } from \"react-redux\";\n\nexport const useNavbarColor = () => {\n // ** Hooks\n const dispatch = useDispatch();\n const store = useSelector((state) => state.layout);\n\n // ** Return a wrapped version of useState's setter function\n const setNavbarColor = (value) => {\n dispatch(handleNavbarColor(value));\n };\n\n return { navbarColor: store.navbarColor, setNavbarColor };\n};\n","// ** Store Imports\nimport { handleRouterTransition } from \"@store/layout\";\nimport { useDispatch, useSelector } from \"react-redux\";\n\nexport const useRouterTransition = () => {\n // ** Hooks\n const dispatch = useDispatch();\n const store = useSelector((state) => state.layout);\n\n const setTransition = (type) => {\n dispatch(handleRouterTransition(type));\n };\n\n return { transition: store.routerTransition, setTransition };\n};\n","import { useLocation } from \"react-router-dom\";\n// ** Icons Import\nimport {\n Home,\n Search,\n Package,\n Video,\n Users,\n PieChart,\n MessageSquare,\n Activity,\n Smartphone,\n Grid,\n Mail,\n Youtube,\n} from \"react-feather\";\n\nconst Published = () => {\n const location = useLocation();\n const isPublishedRoute = location.pathname.includes(\"/published\");\n\n const publishedIcon = (iconName) => (\n \n
\n );\n};\n\nexport default React.memo(GenerateTiktokThumbnail);\n","export default __webpack_public_path__ + \"static/media/dropbox_icon.6cc8e24b.svg\";","export default __webpack_public_path__ + \"static/media/tiktok_icon.afcddc89.svg\";","import { uniqueId } from \"lodash\";\nimport { flaggReasonList } from \"../../constants\";\n\nexport const FlagContainer = ({\n state,\n toggleFlagContainer,\n reportFlagReason,\n flagCustomReason,\n onChangeFlag,\n}) => {\n return (\n <>\n \n
\n \n I want to report this video\n
\n\n
\n \n );\n};\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { Tooltip, UncontrolledTooltip } from \"reactstrap\";\nimport { Edit, Edit2, Mail } from \"react-feather\";\nimport { useLocation } from \"react-router-dom\";\n\nimport EditProduct from \"../../Pages/Product/Components/EditProduct\";\nimport { FlagContainer } from \"./FlagContainer\";\nimport { flaggedCheckedList } from \"../../constants\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { updateVideoPageState } from \"../../Pages/Video/VideoActions\";\nimport { updateProductPageState } from \"../../Pages/Product/productActions\";\n\nconst NoteText = ({ text, update, submit, isCreator }) => (\n - \n {flaggReasonList.map((k, i) => {\n return (\n
- \n \n \n );\n })}\n\n {state.isOtherOpen && (\n
\n
\n \n Cancel\n
\n \n Report\n
\n Note
\n \n \n Save\n \n \n);\n\nconst initialStates = {\n open: false,\n openEditProduct: false,\n favTooltipOpen: false,\n flagTooltipOpen: false,\n editTooltipOpen: false,\n editProductTooltipOpen: false,\n isFlagReasonOpen: false,\n customFlagReason: \"\",\n text: \"\",\n isOtherOpen: false,\n selectedCheck: \"\",\n trashTooltipOpen: false,\n};\n\nconst trashIcon =\n require(\"@src/assets/images/vyrill/grey_trash_icon.png\").default;\n\nconst NoteSection = ({\n id,\n tab,\n note,\n title,\n is_index,\n updateNote,\n isInfluencer,\n product_edit,\n isCreatorNote,\n isEmailCopied,\n isEmailBlocked,\n handleCopyText,\n isFlagWithReason,\n detailPage,\n isVerticle,\n displayAtRight,\n isProduct,\n isDetailPage,\n}) => {\n const [state, setState] = useState({ ...initialStates });\n const [openInfoSearch, setOpenInfoSearch] = useState(false);\n const [isMouseOver, setIsMouseOver] = useState(true);\n const [justaddedToFavorite, setJustAddedToFavorite] = useState(false);\n\n const isFlaggedTab = useSelector((state) => state.videoParams.isFlaggedTab);\n\n const isVideoFavoriteTab = useSelector(\n (state) => state.videoParams.isFavoriteTab\n );\n const isProductFavoriteTab = useSelector(\n (state) => state.productParams.isFavoriteTab\n );\n const isProductTrashTab = useSelector(\n (state) => state.productParams.isTrashTab\n );\n const iVideoTrashTab = useSelector((state) => state.videoParams.isTrashTab);\n\n const wrapperRef = useRef(null);\n const dispatch = useDispatch();\n\n const { pathname } = useLocation();\n\n useOutsideAlerter(wrapperRef);\n\n function useOutsideAlerter(ref) {\n useEffect(() => {\n function handleClickOutside(event) {\n if (ref.current && !ref.current.contains(event.target)) {\n setState({ ...state, isFlagReasonOpen: false });\n }\n }\n // Bind the event listener\n document.addEventListener(\"mousedown\", handleClickOutside);\n }, [ref]);\n }\n\n useEffect(() => {\n if (note.note) {\n setState({ ...state, text: note.note });\n }\n }, [note.note]);\n\n const toggleOpen = () => {\n setState({ ...state, open: !state.open });\n };\n\n const toggleFlagContainer = () => {\n if (flaggedCheckedList.includes(note.flagged_reason)) {\n setState({\n ...state,\n isFlagReasonOpen: !state.isFlagReasonOpen,\n selectedCheck: note.flagged_reason,\n });\n } else {\n //Other case\n if (note.flagged_reason === undefined || note.flagged_reason === null) {\n setState({\n ...state,\n isFlagReasonOpen: !state.isFlagReasonOpen,\n isOtherOpen: false,\n selectedCheck: \"\",\n });\n } else {\n setState({\n ...state,\n isFlagReasonOpen: !state.isFlagReasonOpen,\n customFlagReason: note.flagged_reason,\n isOtherOpen: true,\n selectedCheck: \"Other\",\n });\n }\n }\n };\n\n const updateText = ({ target }) => {\n setState({ ...state, text: target.value });\n };\n\n const toggle = (field) => () => {\n if (field === \"flagged\") {\n const flagged = note.flagged || note.flagged_video;\n return updateNote(id, { flagged: !flagged });\n }\n updateNote(id, { [field]: !note[field] });\n };\n\n const handleFavoriteItem = (field) => () => {\n if (pathname?.includes(\"videos\") && isVideoFavoriteTab && note[field]) {\n dispatch(\n updateVideoPageState({\n confirmUnfav: true,\n isVideoDetailPage: true,\n favVideosCheckList: [id],\n })\n );\n } else if (pathname?.includes(\"products\") && isProductFavoriteTab) {\n dispatch(\n updateProductPageState({\n unFavoriteModal: true,\n itemsCheckList: [id],\n isDetailPage,\n })\n );\n } else {\n if (!note.flagged_video) {\n setJustAddedToFavorite(!note[field] || false);\n updateNote(id, { [field]: !note[field] });\n }\n }\n };\n\n const submitText = () => {\n updateNote(id, { note: state.text });\n toggleOpen();\n };\n\n const reportFlagReason = () => {\n if (state.selectedCheck || state.customFlagReason) {\n if (state.selectedCheck === \"Other\" && state.customFlagReason) {\n updateNote(id, {\n flagged_reason: state.customFlagReason,\n flagged_video: true,\n });\n dispatch(\n updateVideoPageState({\n videoReportedAsFlagged: true,\n isVideoDetailPage: detailPage,\n })\n );\n } else {\n if (state.selectedCheck !== \"Other\") {\n updateNote(id, {\n flagged_reason: state.selectedCheck,\n flagged_video: true,\n });\n dispatch(\n updateVideoPageState({\n videoReportedAsFlagged: true,\n isVideoDetailPage: detailPage,\n })\n );\n }\n }\n }\n };\n\n const trashItem = () => {\n if (pathname.includes(\"products\")) {\n if (isProductTrashTab) {\n dispatch(\n updateProductPageState({\n permanentDeleteModal: true,\n itemsCheckList: [id],\n })\n );\n } else {\n dispatch(\n updateProductPageState({\n moveToTrashModal: true,\n updateNote,\n itemId: id,\n isDetailPage,\n })\n );\n }\n }\n if (pathname.includes(\"videos\")) {\n if (iVideoTrashTab) {\n dispatch(\n updateVideoPageState({\n confirmDelete: true,\n deleteVideosCheckList: [id],\n })\n );\n } else {\n dispatch(\n updateVideoPageState({\n trashConfirmationModal: true,\n itemId: id,\n })\n );\n }\n }\n };\n\n const showProductEdit = () => {\n setState({ ...state, openEditProduct: !state.openEditProduct });\n };\n\n const favtoggle = () => {\n setState({ ...state, favTooltipOpen: !state.favTooltipOpen });\n };\n\n const flagtoggle = () => {\n setState({ ...state, flagTooltipOpen: !state.flagTooltipOpen });\n };\n\n const editToggle = () => {\n setState({ ...state, editTooltipOpen: !state.editTooltipOpen });\n };\n\n const editProToggle = () => {\n setState({\n ...state,\n editProductTooltipOpen: !state.editProductTooltipOpen,\n });\n };\n\n const trashToggle = () => {\n setState({ ...state, trashTooltipOpen: !state.trashTooltipOpen });\n };\n\n const onChangeFlag = (e) => {\n const { value } = e.target;\n if (value === \"Other\") {\n setState({ ...state, selectedCheck: value, isOtherOpen: true });\n } else {\n setState({\n ...state,\n selectedCheck: value,\n isOtherOpen: false,\n customFlagReason: \"\",\n });\n }\n };\n\n const flagCustomReason = ({ target }) => {\n setState({ ...state, customFlagReason: target.value });\n };\n\n const handleMouseEnter = () => setIsMouseOver(false);\n\n const handleMouseLeave = () => {\n if (justaddedToFavorite) {\n setJustAddedToFavorite(false);\n }\n setIsMouseOver(false);\n };\n const favoriteHoverMessage = () => {\n if (isFlaggedTab) {\n return \"Flagged videos can't be favorite\";\n } else if ((justaddedToFavorite || isMouseOver) && note?.favorite) {\n return `You can now find this ${\n isProduct ? \"product\" : \"video\"\n } within the favorites folder`;\n } else if (note?.favorite) {\n return \"Remove from Favorites\";\n } else {\n return \"Add to Favorites\";\n }\n };\n const favoriteFeature = (\n \n \n \n {favoriteHoverMessage}\n \n
\n );\n\n const handleFavoriteFeature = () => {\n if (isFlaggedTab) {\n return null;\n } else if (isInfluencer) {\n return favoriteFeature;\n } else if (!note.flagged || !note.flagged_video || !note.flagged_reason) {\n return favoriteFeature;\n } else {\n return null;\n }\n };\n\n const { open, text, openEditProduct } = state;\n return (\n \n {} : handleCopyText}\n >\n \n {title}\n \n
\n \n )}\n {/* Favroute icon */}\n {handleFavoriteFeature()}\n {isFlagWithReason && (\n // New Flagged Feature\n \n {\n dispatch(\n updateVideoPageState({\n confirmUnflag: true,\n flaggedVideosCheckList: [id],\n isVideoDetailPage: detailPage,\n })\n );\n }\n : note.favorite\n ? () => {}\n : toggleFlagContainer\n }\n onMouseLeave={() => {\n setOpenInfoSearch(false);\n }}\n onMouseEnter={() => setOpenInfoSearch(true)}\n >\n \n {note.favorite ? \"Favorite videos can't be flagged.\" : \"Flag\"}\n \n )}\n {state.isFlagReasonOpen && (\n \n
\n )}\n \n )}\n \n unflag video\n
\n )\n ) : (\n \n \n 
\n \n \n {isProduct &&\n (isProductTrashTab ? \"Delete Permanently\" : \"Add to Trash\")}\n {!isProduct &&\n (iVideoTrashTab ? \"Delete Permanently\" : \"Add to Trash\")}\n \n
\n {is_index ? null : (\n \n \n \n Edit Note\n \n {open ? (\n
\n )}\n {product_edit ? (\n \n \n \n Edit\n \n {openEditProduct && (\n
\n ) : (\n \"\"\n )}\n \n );\n};\n\nexport default NoteSection;\n","import { connect } from \"react-redux\";\nimport { updateNote } from \"./NoteActions\";\n// import Note from './NoteContainer' ClassBase\nimport Note from \"./NoteSection\";\n\nconst mapDispatchToProps = (type) => (dispatch) => ({\n updateNote: (id, note) => dispatch(updateNote(id, note, type)),\n});\n\nexport const VideoNote = connect(null, mapDispatchToProps(\"video\"))(Note);\nexport const ProductNote = connect(null, mapDispatchToProps(\"product\"))(Note);\nexport const InfluencerNote = connect(\n null,\n mapDispatchToProps(\"influencer\")\n)(Note);\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAiCAYAAAAtZZsLAAAAAXNSR0IArs4c6QAAAU9JREFUWAnt1tGNwyAMAFBGufFOUKkH+UnoR2+EjtAN2g06SkfICHdy7iy5mKQQQ5sPIlVQC5uHRaQoVegxzv/QX6Gy5cpQHMzLVS5UqQGljWwdbB2UdkCa3+5g66C0Ayn52vr951f/EVubcgchV3d+H8sXx7Tzx3/EPYZ8BoQc4/wd1kEtMYgWIDj8YmHIJSDF4bqiSGOHMxYm4wOSxKdD4AFjuGmtHc64psj4DBkDvgyHJ1xChsCX4xC5c/47xODlD+LTC0FjO9ufsE7VcQaJL1B0hJxVKHpCmKcWyUHm4JiHBVKFSqkUZA4OtmYeFsgAwtIlZC6uCnAOuQZXDRgi1+KqAhEpwVUHwgbSh70TLCDdQZjPPCwg3ECazjwsIN1BmM88xh3GMLil/8p0w21LIGrRtr+qv8+iTXZxBNt0Y2Cinb9Q/Rvno+kON8T9Aoja+C+50Dd7AAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,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\"","export default __webpack_public_path__ + \"static/media/download.49d6c717.png\";","import { components } from \"react-select\";\nimport { ChevronDown, ChevronUp } from \"react-feather\";\n\nconst { DropdownIndicator } = components;\n\nconst CaretDownIcon = () => {\n return