{"version":3,"sources":["webpack:///./client/app/mainframe/components/Editor/PrimerEditor.tsx","webpack:///./client/app/mainframe/components/Primer/PrimerLogs.tsx","webpack:///./client/app/mainframe/components/Primer/PrimerLogList.tsx","webpack:///./client/app/mainframe/components/Primer/PrimerFeaturedContent/PrimerFeaturedContent.tsx","webpack:///./client/app/mainframe/components/Autocomplete/Autocomplete.tsx","webpack:///./client/app/mainframe/pages/app/Primer/Primer.tsx"],"names":["PrimerEditor","_ref","primer","_ref$editable","editable","setBody","setBodyText","useEffect","editor","commands","setContent","body","useEditor","autofocus","content","extensions","Placeholder","configure","placeholder","StarterKit","Typography","Highlight","Link","openOnClick","Extension","create","onUpdate","this","state","doc","textContent","toJSON","textBetween","size","Dropcursor","color","width","React","createElement","Fragment","BubbleMenu","EditorContent","AiOutlineLoading","className","PrimerLogsMasonry","_ref4","logs","_ref4$sortable","sortable","_ref4$slug","slug","map","log","index","SortableLog","key","id","Masonry","breakpointCols","default","columnClassName","LogItem","onClick","e","preventDefault","NiceModal","show","center","onLogClick","_ref5","_useSortable","useSortable","disabled","attributes","isDragging","listeners","setNodeRef","transform","transition","_useRemovePrimerLog","useRemovePrimerLog","removePrimerLog","mutate","isLoading","style","CSS","Transform","toString","opacity","Object","assign","ref","dragOverlay","PopConfirm","text","onConfirm","logId","IoCloseCircleOutline","memo","_ref6","_ref6$sortable","_ref6$dragOverlay","document","cursor","noteText","LogPreview","showContent","ContentPreview","PrimerLogs","mixpanel","useMixpanel","_useInfinitePrimerLog","useInfinitePrimerLogs","data","fetchNextPage","hasNextPage","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","coordinateGetter","sortableKeyboardCoordinates","_useState2","_slicedToArray","useState","activeLog","setActiveLog","_useState4","setLogs","concat","apply","pages","getIndexFromId","findIndex","sortPrimerLogs","useSortPrimerLogs","InfiniteScroll","loadMore","hasMore","loader","DndContext","collisionDetection","closestCenter","onDragStart","_ref2","active","onDragEnd","_ref3","over","newIndex","position","onMutate","arrayMove","track","modifiers","restrictToWindowEdges","SortableContext","strategy","rectSortingStrategy","items","createPortal","DragOverlay","PrimerLogList","_data$pages$","isOwner","length","MdOutlineLayers","to","Button","type","page","LogCard","PrimerFeaturedContent","useFeaturedContent","mutateAsync","useAddPrimerLog","contentId","title","context","enrichOptions","media","icon","FiBook","FiFilm","FiYoutube","FiHeadphones","FiMic","FiTv","Autocomplete","props","onboard","addLog","useAddLog","addToPrimer","parseUrl","useParseContentFromUrl","enrichResult","useEnrichContent","collections","completion","isOpen","query","activeItemId","status","autocompleteState","setAutocompleteState","searchResponse","setSearchResponse","_useState6","keyIndex","selectedResult","setSelectedResult","_useState8","mediaType","setMediaType","autocomplete","useMemo","createAutocomplete","_objectSpread","onStateChange","getSources","sourceId","getItems","getAlgoliaResults","searchClient","queries","indexName","process","params","hitsPerPage","highlightPreTag","highlightPostTag","filters","onSelect","item","setIsOpen","setQuery","objectID","trackContentAdded","parseInt","inputRef","useRef","formRef","panelRef","getEnvironmentProps","current","_getEnvironmentProps","formElement","inputElement","panelElement","onTouchStart","onTouchMove","window","addEventListener","removeEventListener","api","External","search","replace","then","response","onAddFromSearch","arguments","undefined","k","i","result","medium","errors","noResults","getRootProps","getFormProps","_Input","allowClear","prefix","_SearchOutlined","onPressEnter","stopPropagation","getInputProps","onKeyDown","newSelectedResult","at","onPaste","clipboardData","getData","url","getPanelProps","collection","source","getListProps","getItemProps","Image","src","image_url","alt","dangerouslySetInnerHTML","__html","_highlightResult","value","creator_list","c","join","SearchFooter","onClickAdd","setCollections","Popover","_InfoCircleOutlined","option","clsx","selected","num_results","itemIndex","onMouseEnter","onMouseLeave","image","creators","published_at","_Empty","description","unstyled","Primer","organize","useScrollTop","useParams","_useAuth","useAuth","currentUser","setOracleLink","usePrimer","_useIsOverflow2","useIsOverflow","overflowRef","isOverflow","showOverflow","setShowOverflow","users","find","user","username","ReactTitle","userList","autoFocus","logsCount","ratio","IoEllipsisHorizontalCircleOutline","ProfileAvatarGroup","CopyLink","bodyText","VscChevronDown"],"mappings":"4FAAA,kHAqFeA,IAvEM,SAAHC,GAUX,IATLC,EAAMD,EAANC,OAAMC,EAAAF,EACNG,gBAAQ,IAAAD,GAAQA,EAChBE,EAAOJ,EAAPI,QACAC,EAAWL,EAAXK,YAOIJ,GACFK,qBAAU,WACJC,GACFA,EAAOC,SAASC,WAAWR,EAAOS,KAEtC,GAAG,CAACT,IAGN,IAAMM,EAASI,YAAU,CACvBR,WAAYA,EACZS,WAAW,EACXC,QAASZ,EAASA,EAAOS,KAAO,CAAC,EACjCI,WAAY,CACVC,IAAYC,UAAU,CACpBC,YAAa,4BAEfC,IACAC,IACAC,IACAC,IAAKL,UAAU,CACbM,aAAa,IAEfC,IAAUC,OAAO,CACfC,SAAQ,WACmC,IAArCC,KAAKnB,OAAOoB,MAAMC,IAAIC,aACxBzB,EAAQ,CAAC,GACTC,EAAY,MAEZD,EAAQsB,KAAKnB,OAAOoB,MAAMC,IAAIE,UAG9BzB,EACEqB,KAAKnB,OAAOoB,MAAMC,IAAIG,YACpB,EACAL,KAAKnB,OAAOoB,MAAMC,IAAIf,QAAQmB,KAC9B,IACA,KAIR,IAEFC,IAAWjB,UAAU,CACnBkB,MAAO,UACPC,MAAO,OAKb,OAAI5B,EAEA6B,IAAAC,cAAAD,IAAAE,SAAA,KACGnC,GAAYiC,IAAAC,cAACE,IAAU,CAAChC,OAAQA,IACjC6B,IAAAC,cAACG,IAAa,CAACjC,OAAQA,KAItB6B,IAAAC,cAACI,IAAgB,CAACC,UAAU,oCACrC,C,mvCCtCA,IA8FMC,EAAoB,SAAHC,GAAiD,IAA3CC,EAAID,EAAJC,KAAIC,EAAAF,EAAEG,gBAAQ,IAAAD,GAAQA,EAAAE,EAAAJ,EAAEK,YAAI,IAAAD,EAAG,KAAIA,EAW9D,OAAIH,EACEE,EAEAX,IAAAC,cAAA,OAAKK,UAAU,qHACZG,EAAKK,KAAI,SAACC,EAAKC,GACd,OAAOhB,IAAAC,cAACgB,EAAW,CAACC,IAAKH,EAAII,GAAIJ,IAAKA,EAAKF,KAAMA,GACnD,KAKJb,IAAAC,cAACmB,IAAO,CACNC,eAAgB,CACdC,QAAS,EACT,KAAM,EACN,KAAM,EACN,IAAK,GAEPhB,UAAU,4BACViB,gBAAgB,mBAEfd,EAAKK,KAAI,SAACC,EAAKC,GACd,OACEhB,IAAAC,cAACuB,EAAO,CACNN,IAAKH,EAAII,GACTJ,IAAKA,EACLU,QAAS,SAAAC,GAAC,OApCH,SAACA,EAAGR,EAAKH,GAC1B,IAAQtC,EAAYsC,EAAZtC,QACRiD,EAAEC,iBACFC,IAAUC,KAAK,qBAAsB,CACnCpB,OACAqB,OAAQZ,EACRzC,WAEJ,CA4B0BsD,CAAWL,EAAGV,EAAOD,EAAI,GAG7C,KAIC,IACT,EAEME,EAAc,SAAHe,GAAuB,IAAjBjB,EAAGiB,EAAHjB,IAAKF,EAAImB,EAAJnB,KAC1BoB,EAOIC,YAAY,CAAEf,GAAIJ,EAAII,GAAIgB,UAAU,IANtCC,EAAUH,EAAVG,WACAC,EAAUJ,EAAVI,WACAC,EAASL,EAATK,UACAC,EAAUN,EAAVM,WACAC,EAASP,EAATO,UACAC,EAAUR,EAAVQ,WAIFC,EAA+CC,YAAmB9B,GAAlD+B,EAAeF,EAAvBG,OAAyBC,EAASJ,EAATI,UAE3BC,EAAQ,CACZP,UAAWQ,IAAIC,UAAUC,SAASV,GAClCC,aACAU,QAASd,EAAa,GAAM,GAG9B,OACErC,IAAAC,cAAA,MAAAmD,OAAAC,OAAA,CACEC,IAAKf,EACLQ,MAAOA,GACHX,EAAU,CACd9B,UAAU,mBAEVN,IAAAC,cAAA,MAAAmD,OAAAC,OAAA,GAASf,EAAS,CAAEhC,UAAU,gBAC5BN,IAAAC,cAACuB,EAAO,CAACb,UAAQ,EAACI,IAAKA,EAAKwC,YAAalB,KAG3CrC,IAAAC,cAAA,OACEK,UAAU,wKACVmB,QAAS,SAAAC,GAAC,OAAIA,EAAEC,gBAAgB,GAEhC3B,IAAAC,cAACuD,IAAU,CACTC,KAAK,0BACLC,UAAW,kBAAMd,EAAgB,CAAE/B,OAAM8C,MAAO5C,EAAII,IAAK,GAExD2B,EACC9C,IAAAC,cAACI,IAAgB,CAACC,UAAU,0BAE5BN,IAAAC,cAAC2D,IAAoB,QAMjC,EASMpC,EAAUxB,IAAM6D,MACpB,SAAAC,GAKO,IAADC,EAAAD,EAJJnD,gBAAQ,IAAAoD,GAAQA,EAChBhD,EAAG+C,EAAH/C,IAAGiD,EAAAF,EACHP,mBAAW,IAAAS,GAAQA,EAAAF,EACnBrC,QAEAvD,qBAAU,WACR,GAAKqF,EAIL,OADAU,SAAS3F,KAAKyE,MAAMmB,OAAS,WACtB,WACLD,SAAS3F,KAAKyE,MAAMmB,OAAS,EAC/B,CACF,GAAG,CAACX,IAEJ,IAAQ9E,EAAYsC,EAAZtC,QACR,OAAIsC,EAAIoD,WAAaxD,EAEjBX,IAAAC,cAACmE,IAAU,CACTrD,IAAKA,EACLT,UAAU,sDACV7B,QAASA,EACT4F,aAAW,IAKfrE,IAAAC,cAAA,OAAKK,UAAU,SACbN,IAAAC,cAACqE,IAAc,CAAC7F,QAASA,IAG/B,IAGa8F,EAzOI,SAAH3G,GAAiD,IAA3CuD,EAAEvD,EAAFuD,GAAIN,EAAIjD,EAAJiD,KAAMF,EAAQ/C,EAAR+C,SACtB6D,EAAaC,cAAbD,SAGRE,EACEC,YAAsB9D,GADhB+D,EAAIF,EAAJE,KAAM9B,EAAS4B,EAAT5B,UAAW+B,EAAaH,EAAbG,cAAeC,EAAWJ,EAAXI,YAGlCC,EAAUC,YACdC,YAAUC,KACVD,YAAUE,IAAgB,CACxBC,iBAAkBC,OAIsBC,EAAAC,EAAVC,qBAAU,GAArCC,EAASH,EAAA,GAAEI,EAAYJ,EAAA,GACWK,EAAAJ,EAAjBC,qBAAiB,GAAlC/E,EAAIkF,EAAA,GAAEC,EAAOD,EAAA,GAEpBzH,qBAAU,WACJ0G,GACFgB,EAAQ,GAAGC,OAAOC,MAAM,GAAQ,OAAJlB,QAAI,IAAJA,OAAI,EAAJA,EAAMmB,OAAOjF,KAAI,SAAAC,GAAG,OAAIA,CAAG,IAE3D,GAAG,CAAC6D,IAEJ,IAAMoB,EAAiB,SAAA7E,GAAE,OAAQ,OAAJV,QAAI,IAAJA,OAAI,EAAJA,EAAMwF,WAAU,SAAAlF,GAAG,OAAIA,EAAII,KAAOA,CAAE,GAAC,EAMlD+E,EAAmBC,YAAkBtF,GAA7CgC,OAkBR,OAAIC,EAEA9C,IAAAC,cAACI,IAAgB,CAACC,UAAU,oDAK9BN,IAAAC,cAACmG,IAAc,CACbC,SAAUxB,EACVyB,QAASxB,EACTyB,OACEvG,IAAAC,cAACI,IAAgB,CAACC,UAAU,sCAE9BA,UAAU,sBAETG,GACCT,IAAAC,cAAAD,IAAAE,SAAA,KACGS,EACCX,IAAAC,cAACuG,IAAU,CACTzB,QAASA,EACT0B,mBAAoBC,IACpBC,YA3CQ,SAAHC,GAAoB,IAAdC,EAAMD,EAANC,OACjBA,GAAQnB,EAAajF,EAAKuF,EAAea,EAAO1F,KACtD,EA0CY2F,UAvCM,SAAHC,GAA0B,IAApBF,EAAME,EAANF,OAAQG,EAAID,EAAJC,KAG3B,GAFAtB,EAAa,MAETmB,GAAUG,GAAQH,EAAO1F,KAAO6F,EAAK7F,GAAI,CAC3C,IAAM8F,EAAWjB,EAAegB,EAAK7F,IACrC+E,EAAe,CACbrF,OACA8C,MAAOkD,EAAO1F,GACd+F,SAAUD,EAAW,EACrBE,SAAU,WACRvB,EAAQwB,YAAU3G,EAAMuF,EAAea,EAAO1F,IAAK8F,GACrD,IAEFzC,EAAS6C,MAAM,oBAAqB,CAAExJ,OAAQsD,GAChD,CACF,EAyBYmG,UAAW,CAACC,MAEZvH,IAAAC,cAACuH,IAAe,CACdC,SAAUC,IACVC,MAAW,OAAJlH,QAAI,IAAJA,OAAI,EAAJA,EAAMK,KAAI,SAAAC,GAAG,OAAIA,EAAII,EAAE,KAE9BnB,IAAAC,cAACM,EAAiB,CAACE,KAAMA,EAAME,UAAQ,EAACE,KAAMA,KAE/C+G,uBACC5H,IAAAC,cAAC4H,IAAW,KACTpC,GAAazF,IAAAC,cAACuB,EAAO,CAACb,UAAQ,EAACI,IAAK0E,KAEvCxB,SAAS3F,OAIb0B,IAAAC,cAACM,EAAiB,CAACE,KAAMA,KAMrC,E,2BCtEeqH,EAvDO,SAAHlK,GAA2B,IAADmK,EAApBlH,EAAIjD,EAAJiD,KAAMmH,EAAOpK,EAAPoK,QAC7BtD,EACEC,YAAsB9D,GADhB+D,EAAIF,EAAJE,KAAM9B,EAAS4B,EAAT5B,UAAW+B,EAAaH,EAAbG,cAAeC,EAAWJ,EAAXI,YAGxC,OAAIhC,EACK9C,IAAAC,cAACI,IAAgB,CAACC,UAAU,sCAEN,KAAvB,OAAJsE,QAAI,IAAJA,GAAc,QAAVmD,EAAJnD,EAAMmB,MAAM,UAAE,IAAAgC,OAAV,EAAJA,EAAgBE,QAEhBjI,IAAAC,cAAA,OAAKK,UAAU,+DACbN,IAAAC,cAAA,OAAKK,UAAU,0BACbN,IAAAC,cAACiI,IAAe,OAElBlI,IAAAC,cAAA,MAAIK,UAAU,2DACX0H,EAAU,6BAA+B,iBAE3CA,GACChI,IAAAC,cAAChB,IAAI,CAACkJ,GAAE,eAAAtC,OAAiBhF,EAAI,cAC3Bb,IAAAC,cAACmI,IAAM,CACLC,KAAK,OACLzI,KAAK,QACLU,UAAU,wDACX,iBASTN,IAAAC,cAACmG,IAAc,CACbC,SAAUxB,EACVyB,QAASxB,EACTyB,OACEvG,IAAAC,cAAA,OAAKK,UAAU,iDACbN,IAAAC,cAACI,IAAgB,CAACC,UAAU,0BAGhCA,UAAU,QAETsE,GACCA,EAAKmB,MAAMjF,KAAI,SAAAwH,GAAI,OACjBA,EAAKxH,KAAI,SAAAC,GAAG,OACVf,IAAAC,cAACsI,IAAO,CACNrH,IAAKH,EAAII,GACTJ,IAAKA,EACLsD,aAAW,EACX/D,UAAU,cACV,GACF,IAIZ,E,QCfekI,G,QAlCe,SAAH5K,GAA8C,IAAxCiD,EAAIjD,EAAJiD,KACvB2D,EAAaC,cAAbD,SACAI,EAAS6D,cAAT7D,KACA8D,EAAgBC,YAAgB9H,GAAhC6H,YAER,OAAI9D,EAEA5E,IAAAC,cAAA,OAAKK,UAAU,sLACZsE,EAAK9D,KAAI,SAAArC,GAAO,OACfuB,IAAAC,cAACqE,IAAc,CACbpD,IAAKzC,EAAQ0C,GACb1C,QAASA,EACT6B,UAAU,uCACVmB,QAAS,SAAAC,GACPA,EAAEC,iBACF+G,EAAY,CACV7H,OACA+H,UAAWnK,EAAQ0C,GACnBgG,SAAU,KACV0B,MAAOpK,EAAQoK,QAEjBrE,EAAS6C,MAAM,gBAAiB,CAC9BlG,GAAI1C,EAAQ0C,GACZ2H,QAAS,YAEb,GACA,KAKH9I,IAAAC,cAACI,IAAgB,CAACC,UAAU,qCACrC,G,88CCYA,IAAMyI,GAAgB,CACpB,CACE5H,GAAI,QACJ6H,MAAO,CAAC,SACRH,MAAO,QACPI,KAAMjJ,IAAAC,cAACiJ,KAAM,OAEf,CAAE/H,GAAI,QAAS6H,MAAO,CAAC,SAAUH,MAAO,QAASI,KAAMjJ,IAAAC,cAACkJ,KAAM,OAC9D,CAAEhI,GAAI,SAAU6H,MAAO,CAAC,UAAWH,MAAO,UAAWI,KAAMjJ,IAAAC,cAACmJ,KAAS,OACrE,CACEjI,GAAI,QACJ6H,MAAO,CAAC,SAAU,UAClBH,MAAO,QACPI,KAAMjJ,IAAAC,cAACoJ,KAAY,OAErB,CACElI,GAAI,WACJ6H,MAAO,CAAC,QAAS,YACjBH,MAAO,WACPI,KAAMjJ,IAAAC,cAACqJ,KAAK,OAEd,CACEnI,GAAI,KACJ6H,MAAO,CAAC,MACRH,MAAO,KACPI,KAAMjJ,IAAAC,cAACsJ,KAAI,QAIFC,GAAe,SAACC,GAC3B,IAAQjF,EAAaC,cAAbD,SACAkF,EAAkBD,EAAlBC,QAAS7I,EAAS4I,EAAT5I,KACD8I,EAAWC,cAAnB/G,OACagH,EAAgBlB,YAAgB9H,GAA7C6H,YACaoB,EAAaC,cAA1BrB,YACasB,EAAiBC,cAA9BvB,YAYNpD,EAAAC,GAVgDC,mBAEhD,CACA0E,YAAa,GACbC,WAAY,KACZrB,QAAS,CAAC,EACVsB,QAAQ,EACRC,MAAO,GACPC,aAAc,KACdC,OAAQ,SACR,GAVKC,EAAiBlF,EAAA,GAAEmF,EAAoBnF,EAAA,GAYYK,EAAAJ,GAAdC,mBAAS,MAAK,GAAnDkF,EAAc/E,EAAA,GAAEgF,EAAiBhF,EAAA,GAItCiF,EAAArF,GAH0CC,mBAAS,CACnDqF,UAAW,EACX7J,OAAQ,IACR,GAHK8J,EAAcF,EAAA,GAAEG,EAAiBH,EAAA,GAIQI,EAAAzF,GAAdC,mBAAS,MAAK,GAAzCyF,EAASD,EAAA,GAAEE,EAAYF,EAAA,GAgBxBG,EAAenL,IAAMoL,SACzB,kBACEC,Y,kWAAkBC,CAAA,CAMhBC,cAAa,SAAA3N,GAAa,IAAV2B,EAAK3B,EAAL2B,MACdkL,EAAqBlL,EACvB,EACAiM,WAAU,WACR,MAAO,CACL,CACEC,SAAU,UACVC,SAAQ,SAAA9E,GAAa,IAAVyD,EAAKzD,EAALyD,MACT,OAAOsB,YAAkB,CACvBC,iBACAC,QAAS,CACP,CACEC,UAAU,WAADjG,OAAakG,cACtB1B,QACA2B,OAAQ,CACNC,YAAa,EACbC,gBAAiB,SACjBC,iBAAkB,UAClBC,QA5BN,2CAiCJ,EACAC,SAAQ,SAAAtF,GAAiC,IAA9BuF,EAAIvF,EAAJuF,KAAMC,EAASxF,EAATwF,UAAWC,EAAQzF,EAARyF,SACtB3L,EACFgJ,EAAY,CACVhJ,OACA+H,UAAW0D,EAAKG,SAChBtF,SAAU,KACV0B,MAAOyD,EAAKzD,QAGdc,EAAO,CAAExI,GAAImL,EAAKG,SAAU5D,MAAOyD,EAAKzD,QAE1C2D,EAAS,IACTD,GAAU,GACVG,EAAkBC,SAASL,EAAKG,UAClC,GAON,GACGhD,GACH,GACJ,CAACA,IAEGmD,EAAW5M,IAAM6M,OAAyB,MAC1CC,EAAU9M,IAAM6M,OAAwB,MACxCE,EAAW/M,IAAM6M,OAAuB,MACtCG,EAAwB7B,EAAxB6B,oBAER9O,qBAAU,WACR,GAAK4O,EAAQG,SAAYF,EAASE,SAAYL,EAASK,QAAvD,CAIA,IAAAC,EAAsCF,EAAoB,CACxDG,YAAaL,EAAQG,QACrBG,aAAcR,EAASK,QACvBI,aAAcN,EAASE,UAHjBK,EAAYJ,EAAZI,aAAcC,EAAWL,EAAXK,YAStB,OAHAC,OAAOC,iBAAiB,aAAcH,GACtCE,OAAOC,iBAAiB,YAAaF,GAE9B,WACLC,OAAOE,oBAAoB,aAAcJ,GACzCE,OAAOE,oBAAoB,YAAaH,EAC1C,CAdA,CAeF,GAAG,CAACP,EAAqBF,EAASF,EAAUG,IAE5C7O,qBAAU,WACJwM,GACFC,EAAkB,MAEpBO,EAAa,KACf,GAAG,CAACV,EAAkBH,QAEtBnM,qBAAU,WACJ+M,IAxGJN,EAAkB,MAClBI,EAAkB,CAAEF,UAAW,EAAG7J,OAAQ,IAE1C2M,IAAIC,SAASC,OACX5C,EAAU9J,GACVqJ,EAAkBH,MAAMyD,QAAQ,IAAK,KACrCC,MAAK,SAAAC,GACLrD,EAAkBqD,EACpB,IAmGF,GAAG,CAAC/C,IAEJ,IAqCMgD,EAAkB,WAAoC,IAAnCpD,EAAQqD,UAAAjG,OAAA,QAAAkG,IAAAD,UAAA,GAAAA,UAAA,GAAG,KAAMlN,EAAKkN,UAAAjG,OAAA,QAAAkG,IAAAD,UAAA,GAAAA,UAAA,GAAG,KAC1CE,EAAIvD,GAAYC,EAAeD,SAC/BwD,EAAIrN,GAAS8J,EAAe9J,MAC5BsN,EAAS5D,EAAeO,EAAUjC,MAAMoF,IAAIC,GAC9CC,GACFtE,EAAa,CACXuE,OAAQtD,EAAU9J,GAClBkH,KAAM4C,EAAUjC,MAAMoF,GACtBvF,MAAOyF,EAAOzF,MACd1H,GAAImN,EAAOnN,KACV4M,MAAK,SAAAC,GACDA,EAASQ,SACR3N,EACFgJ,EAAY,CACVhJ,OACA+H,UAAWoF,EAAS7M,GACpBgG,SAAU,KACV0B,MAAOyF,EAAOzF,QAGhBc,EAAO,CAAExI,GAAI6M,EAAS7M,GAAI0H,MAAOyF,EAAOzF,QAG9C,GAEJ,EAuEM6D,EAAoB,SAAAvL,GACxBqD,EAAS6C,MAAM,gBAAiB,CAC9BlG,KACA2H,QAASjI,EAAQ6I,EAAU,UAAY,SAAY,aAEvD,EAEM+E,GACHjE,EAAkBJ,QACnBI,EAAkBN,YAAYjC,OAAS,GACvCuC,EAAkBH,OAClBG,EAAkBH,MAAMpC,OAAS,EAEnC,OACEjI,IAAAC,cAAA,MAAAmD,OAAAC,OAAA,CACE/C,UAAU,+BACN6K,EAAauD,aAAa,CAAC,IAE/B1O,IAAAC,cAAA,OAAAmD,OAAAC,OAAA,CACEC,IAAKwJ,GACD3B,EAAawD,aAAa,CAAEvB,aAAcR,EAASK,WAEvDjN,IAAAC,cAAA2O,IAAAxL,OAAAC,OAAA,CACEwL,YAAU,EACVjP,KAAK,QACL0D,IAAKsJ,EACLkC,OAAQ9O,IAAAC,cAAA8O,IAAA,MACRC,aAAc,SAAAtN,GACZA,EAAEC,iBACFD,EAAEuN,kBACEvE,GAAkBI,EAAe9J,OAAS,GAC5CiN,GAEJ,GACI9C,EAAa+D,cAAc,CAAE9B,aAAcR,EAASK,UAAU,CAClEkC,UACEzE,GAAkB+D,EA3EV,SAAA/M,GAChB,GAAIgJ,IACY,cAAVhJ,EAAER,KAAiC,YAAVQ,EAAER,KAAmB,CAChDQ,EAAEC,iBACFD,EAAEuN,kBAEF,IAAMG,EAA8B,cAAV1N,EAAER,KAlGF,IAA1B4J,EAAe9J,MACV,CACL6J,SAAU,EACV3J,IAAK+J,EAAUjC,MAAM,GACrBhI,MAAO,GAKT8J,EAAe9J,QACf0J,EAAeO,EAAUjC,MAAM8B,EAAeD,WAAW5C,OAAS,EAG9D6C,EAAeD,WAAaI,EAAUjC,MAAMf,OAAS,EAChD,CACL4C,SAAU,EACV3J,IAAK+J,EAAUjC,MAAM,GACrBhI,MAAO,GAIJ,CACL6J,SAAUC,EAAeD,SAAW,EACpC3J,IAAK+J,EAAUjC,MAAM8B,EAAeD,SAAW,GAC/C7J,MAAO,GAIJ,CACL6J,SAAUC,EAAeD,SACzB3J,IAAK+J,EAAUjC,MAAM8B,EAAeD,UACpC7J,MAAO8J,EAAe9J,MAAQ,IAkCJ,IAA1B8J,EAAe9J,OACW,IAAzB8J,EAAe9J,OAA2C,IAA5B8J,EAAeD,SAEvC,CACLA,SAAUI,EAAUjC,MAAMf,OAAS,EACnC/G,IAAK+J,EAAUjC,MAAMqG,IAAI,GACzBrO,MAAO0J,EAAeO,EAAUjC,MAAMqG,IAAI,IAAIpH,OAAS,GAI9B,IAAzB6C,EAAe9J,MACV,CACL6J,SAAUC,EAAeD,SAAW,EACpC3J,IAAK+J,EAAUjC,MAAM8B,EAAeD,SAAW,GAC/C7J,MACE0J,EAAeO,EAAUjC,MAAM8B,EAAeD,SAAW,IAAI5C,OAC7D,GAIC,CACL4C,SAAUC,EAAeD,SACzB3J,IAAK+J,EAAUjC,MAAM8B,EAAeD,UACpC7J,MAAO8J,EAAe9J,MAAQ,GAW5B+J,EAAkBqE,EACpB,CAEJ,EAmEcjE,EAAa+D,cAAc,CAAE9B,aAAcR,EAASK,UACjDkC,UAETG,QApEQ,SAAA5N,GACd,IAAM+B,EAAO/B,EAAE6N,cAAcC,QAAQ,QACrC9N,EAAEC,iBAEFmI,EAAS,CAAE2F,IAAKhM,IAAQsK,MAAK,SAAAC,GACtBA,EAASQ,SACR3N,EACFgJ,EAAY,CACVhJ,OACA+H,UAAWoF,EAAS7M,GACpBgG,SAAU,KACV0B,MAAOmF,EAASnF,QAGlBc,EAAO,CAAExI,GAAI6M,EAAS7M,GAAI0H,MAAOmF,EAASnF,QAE5CrE,EAAS6C,MAAM,iBAAkB,CAC/BlG,GAAI6M,EAAS7M,GACb2H,QAASjI,EAAQ6I,EAAU,UAAY,SAAY,cAErDgD,EAAkBsB,EAAS7M,IAE/B,IACAgK,EAAaqB,SAAS,IACtBrB,EAAaoB,WAAU,EACzB,MA+CK/B,EAAkBJ,QACjBpK,IAAAC,cAAA,MAAAmD,OAAAC,OAAA,CACEC,IAAKyJ,EACLzM,UAAU,yDACN6K,EAAauE,cAAc,CAAC,IAEhC1P,IAAAC,cAAA,OAAKK,UAAU,YACZkK,EAAkBN,YAAYpJ,KAAI,SAAC6O,EAAY3O,GAC9C,IAAQ4O,EAAkBD,EAAlBC,OAAQjI,EAAUgI,EAAVhI,MAEhB,OACE3H,IAAAC,cAAA,WAASiB,IAAG,SAAA2E,OAAW7E,IACrBhB,IAAAC,cAAA,KAAAmD,OAAAC,OAAA,CACE/C,UAAU,mCACN6K,EAAa0E,gBAEhBlI,EAAMM,OAAS,GACdN,EAAM7G,KAAI,SAAAwL,GACR,OACEtM,IAAAC,cAAA,KAAAmD,OAAAC,OAAA,CACEnC,IAAKoL,EAAKG,SACVnM,UAAU,qDACN6K,EAAa2E,aAAa,CAAExD,OAAMsD,YAEtC5P,IAAAC,cAAA,OAAKK,UAAU,gCACbN,IAAAC,cAAC8P,IAAK,CACJC,IAAK1D,EAAK2D,UACVC,IAAK5D,EAAKzD,MACVvI,UAAU,kCAGdN,IAAAC,cAAA,OAAKK,UAAU,yBACbN,IAAAC,cAAA,OACEK,UAAU,2CACV6P,wBAAyB,CACvBC,OAAQ9D,EAAK+D,iBAAiBxH,MAC1ByD,EAAK+D,iBAAiBxH,MAAMyH,MAC5BhE,EAAKzD,SAGb7I,IAAAC,cAAA,OACEK,UAAU,oCACV6P,wBAAyB,CACvBC,OAAQ9D,EAAK+D,iBAAiBE,aAC1BjE,EAAK+D,iBAAiBE,aACnBzP,KAAI,SAAA0P,GAAC,OAAIA,EAAEF,KAAK,IAChBG,KAAK,MACRnE,EAAKiE,aAAaE,KAAK,UAMvC,KAIV,KAEFzQ,IAAAC,cAACyQ,GAAY,CACXC,WAAY,WACVxF,EAAaoB,WAAU,GACvBpB,EAAayF,eAAe,CAC1B,CACEjJ,MAAO,GACPiI,OAAQpF,EAAkBN,YAAY,GAAG0F,SAG/C,KAKLnB,GACCzO,IAAAC,cAAA,MAAAmD,OAAAC,OAAA,CACEC,IAAKyJ,EACLzM,UAAU,yDACN6K,EAAauE,cAAc,CAAC,IAEhC1P,IAAAC,cAAA,KAAAmD,OAAAC,OAAA,CACE/C,UAAU,8DACN6K,EAAa0E,iBAEfnF,GACA1K,IAAAC,cAAAD,IAAAE,SAAA,KACEF,IAAAC,cAAA,MAAIK,UAAU,OACZN,IAAAC,cAAC4Q,KAAO,CACN3J,SAAS,aACTzI,QACEuB,IAAAC,cAAA,OAAKK,UAAU,+BACbN,IAAAC,cAAA,OAAKK,UAAU,sCACbN,IAAAC,cAAA,MAAIK,UAAU,iCAAgC,yBAIhDN,IAAAC,cAAA,KAAGK,UAAU,gCAA+B,0FAK5CN,IAAAC,cAAA,KAAGK,UAAU,gCAA+B,yLAO5CN,IAAAC,cAAA,KAAGK,UAAU,gCAA+B,qJAQhDN,IAAAC,cAAA6Q,IAAA,CAAoBxQ,UAAU,gFAEhCN,IAAAC,cAAA,MAAIK,UAAU,iCAAgC,+BAG9CN,IAAAC,cAAA,KAAGK,UAAU,4CAA2C,4BAI1DN,IAAAC,cAAA,MAAIK,UAAU,aACZN,IAAAC,cAAA,OAAKK,UAAU,0BACZyI,GAAcjI,KAAI,SAAAiQ,GAAM,OACvB/Q,IAAAC,cAAA,OACEiB,IAAK6P,EAAO5P,GACZb,UAAW0Q,YACT,yGACA,CAAEC,SAAUhG,GAAaA,EAAU9J,KAAO4P,EAAO5P,KAEnDM,QAAS,kBAAMyJ,EAAa6F,EAAO,GAEnC/Q,IAAAC,cAAA,OACEK,UAAW0Q,YACT,WACA/F,GAAaA,EAAU9J,KAAO4P,EAAO5P,GACjC,gBACA,kBAGL4P,EAAO9H,MAEVjJ,IAAAC,cAAA,KACEK,UAAW0Q,YACT,eACA/F,GAAaA,EAAU9J,KAAO4P,EAAO5P,GACjC,gBACA,kBAGL4P,EAAOlI,OAEN,MAIXoC,EACCjL,IAAAC,cAAA,MAAIK,UAAU,qFACZN,IAAAC,cAACI,IAAgB,CAACC,UAAU,8CAC5BN,IAAAC,cAAA,OAAKK,UAAU,oBAAmB,kBAEhCN,IAAAC,cAAA,QAAMK,UAAU,kCACbkK,EAAkBH,OACd,MAKXrK,IAAAC,cAAA,MAAIK,UAAU,qFACZN,IAAAC,cAAA,OAAKK,UAAU,oBAAmB,kCAEhCN,IAAAC,cAAA,QAAMK,UAAU,kCACbkK,EAAkBH,OACd,OAQhBK,GACC1K,IAAAC,cAAAD,IAAAE,SAAA,KACGwK,EAAewG,YAAc,EAC5BjG,EAAUjC,MAAMlI,KACd,SAACI,EAAK2J,GAAQ,OACZH,EAAexJ,GAAK+G,OAAS,GAC3BjI,IAAAC,cAAA,WAASK,UAAU,iCACjBN,IAAAC,cAAA,OAAKK,UAAU,0EACZY,GAEFwJ,EAAexJ,GAAKJ,KAAI,SAACwL,EAAM6E,GAAS,OACvCnR,IAAAC,cAAA,MACEiB,IAAG,GAAA2E,OAAK3E,EAAG,KAAA2E,OAAIsL,GACf7Q,UAAW0Q,YACT,uCACA,CACE,cACElG,EAAeD,WAAaA,GAC5BC,EAAe9J,QAAUmQ,IAG/BC,aAAc,kBACZrG,EAAkB,CAChBF,WACA7J,MAAOmQ,GACP,EAEJE,aAAc,kBACZtG,EAAkB,CAChBF,UAAW,EACX7J,OAAQ,GACR,EAEJS,QAAS,kBACPwM,EAAgBpD,EAAUsG,EAAU,GAGtCnR,IAAAC,cAAA,OAAKK,UAAU,gCACbN,IAAAC,cAAC8P,IAAK,CACJC,IAAK1D,EAAKgF,MACVpB,IAAK5D,EAAKzD,MACVvI,UAAU,kCAGdN,IAAAC,cAAA,OAAKK,UAAU,yBACbN,IAAAC,cAAA,OAAKK,UAAU,4CACZgM,EAAKzD,OAEPyD,EAAKiF,UAAYjF,EAAKiF,SAAStJ,OAAS,EACvCjI,IAAAC,cAAA,OAAKK,UAAU,qCACZgM,EAAKiF,UAGRvR,IAAAC,cAAA,OAAKK,UAAU,qCACZgM,EAAKkF,eAIT,IAGV,IAGLxR,IAAAC,cAAA,MAAIK,UAAU,uCACZN,IAAAC,cAAA,OAAKK,UAAU,gCACbN,IAAAC,cAAAwR,IAAA,CAAOC,aAAa,KAEtB1R,IAAAC,cAAA,OAAKK,UAAU,yCAAwC,mBAErDN,IAAAC,cAAA,QAAMK,UAAU,kCACbkK,EAAkBH,OACd,QASlBK,GAAkBA,EAAewG,YAAc,GAAKlR,IAAAC,cAACyQ,GAAY,OAK5E,EAEMA,GAAe,SAAHlQ,GAAA,IAAMmQ,EAAUnQ,EAAVmQ,WAAU,OAChC3Q,IAAAC,cAAA,OAAKK,UAAU,mFACbN,IAAAC,cAAA,OAAKK,UAAU,kCACbN,IAAAC,cAAA,QAAMK,UAAU,gHAA+G,gBAExH,UAGTN,IAAAC,cAAA,OAAKK,UAAU,kCACbN,IAAAC,cAAA,QAAMK,UAAU,2GAA0G,SAEnH,OAGRqQ,GACC3Q,IAAAC,cAACmI,IAAM,CACLuJ,UAAQ,EACRrR,UAAU,oCACVmB,QAASkP,GACV,sBAIC,E,+/BC5eOiB,UApLA,SAAHhU,GAA4C,IAAtCiU,EAAQjU,EAARiU,SAAUnI,EAAO9L,EAAP8L,QAC1BoI,eACA,IAAQjR,EAASkR,cAATlR,KACRmR,EAAuCC,cAA/BC,EAAWF,EAAXE,YAAaC,EAAaH,EAAbG,cAEPtU,EAAWuU,YAAUvR,GAA3B+D,KACyCyN,EAAA9M,GAAf+M,cAAe,GAA1CC,EAAWF,EAAA,GAAEG,EAAUH,EAAA,GACyB/M,EAAAC,GAAfC,oBAAS,GAAM,GAAhDiN,EAAYnN,EAAA,GAAEoN,EAAepN,EAAA,GAEpCpH,qBAAU,WAER,OADAiU,EAAc,YAADtM,OAAmB,OAANhI,QAAM,IAANA,OAAM,EAANA,EAAQsD,KAC3B,kBAAMgR,EAAc,KAAK,CAClC,GAAG,CAACtU,EAAQsU,IAEZ,IAAMnK,EACJkK,GACArU,GACAA,EAAO8U,MAAMC,MAAK,SAAAC,GAAI,OAAIA,EAAKC,WAAaZ,EAAYY,QAAQ,IAElE,OAAIjV,EAEAmC,IAAAC,cAAA,OAAKK,UAAU,qBACbN,IAAAC,cAAC8S,aAAU,CACTlK,MAAK,GAAAhD,OAAKhI,EAAOgL,OAAKhD,OACpBhI,EAAOmV,SAAQ,OAAAnN,OAAUhI,EAAOmV,UAAa,GAAE,iBAGlDnB,EACC7R,IAAAC,cAAAD,IAAAE,SAAA,KACEF,IAAAC,cAAA,MAAIK,UAAU,sFACXoJ,EAAU,gBAAkB7L,EAAOgL,OAErCa,GACC1J,IAAAC,cAAA,MAAIK,UAAU,mFAAkF,2DAIlGN,IAAAC,cAAA,OAAKK,UAAU,oEACbN,IAAAC,cAACuJ,GAAY,CACXyJ,WAAS,EACTvJ,QAASA,EACT7I,KAAMA,EACNhC,YAAY,+BAIf6K,EAEC1J,IAAAC,cAAAD,IAAAE,SAAA,KACGrC,EAAOqV,UAAY,EAClBlT,IAAAC,cAAA,OAAKK,UAAU,2DACbN,IAAAC,cAAChB,IAAI,CAACkJ,GAAE,eAAAtC,OAAiBhF,EAAI,mBAC3Bb,IAAAC,cAACmI,IAAM,KAAC,cAIZpI,IAAAC,cAAAD,IAAAE,SAAA,KACEF,IAAAC,cAAA,MAAIK,UAAU,oEAAmE,sCAGjFN,IAAAC,cAACuI,EAAqB,CAAC3H,KAAMA,MAKnCb,IAAAC,cAAA,OAAKK,UAAU,2BACbN,IAAAC,cAAChB,IAAI,CAACqB,UAAU,UAAU6H,GAAE,eAAAtC,OAAiBhF,IAC3Cb,IAAAC,cAACmI,IAAM,KAAC,UAKdpI,IAAAC,cAAA,OAAKK,UAAU,iBACbN,IAAAC,cAACsE,EAAU,CACTpD,GAAItD,GAAUA,EAAOsD,GACrBN,KAAMA,EACNF,SAAUkR,MAKhB7R,IAAAC,cAAA,OAAKK,UAAU,qDACbN,IAAAC,cAAA,OAAKK,UAAU,kDACZzC,EAAOyT,OACNtR,IAAAC,cAAC8P,IAAK,CACJoD,MAAM,OACNjD,IAAKrS,EAAOgL,MACZvI,UAAU,sCACV0P,IAAKnS,EAAOyT,QAGhBtR,IAAAC,cAAChB,IAAI,CACHqB,UAAU,GACV6H,GACEH,EAAO,eAAAnC,OAAkBhF,EAAI,wBAAAgF,OAAyBhF,IAGxDb,IAAAC,cAAA,MAAIK,UAAU,wDACXzC,EAAOgL,MACPb,GACChI,IAAAC,cAACmT,IAAiC,CAAC9S,UAAU,sCAIlDzC,EAAO8U,OACN3S,IAAAC,cAAA,MAAIK,UAAU,uDAAsD,aAElEN,IAAAC,cAACoT,KAAkB,CAACV,MAAO9U,EAAO8U,MAAOrS,UAAU,UAGtD0H,EACChI,IAAAC,cAAAD,IAAAE,SAAA,KACEF,IAAAC,cAAA,OAAKK,UAAU,0BACbN,IAAAC,cAAChB,IAAI,CAACkJ,GAAE,eAAAtC,OAAiBhF,EAAI,cAC3Bb,IAAAC,cAACmI,IAAM,CAACxI,KAAK,SAAQ,aAEvBI,IAAAC,cAAChB,IAAI,CAACkJ,GAAE,eAAAtC,OAAiBhF,EAAI,UAAUP,UAAU,QAC/CN,IAAAC,cAACmI,IAAM,CAACxI,KAAK,SAAQ,WAGzBI,IAAAC,cAAA,OAAKK,UAAU,qBACbN,IAAAC,cAAChB,IAAI,CAACkJ,GAAE,eAAAtC,OAAiBhF,EAAI,UAC3Bb,IAAAC,cAACtC,KAAY,CAACE,OAAQA,OAK5BmC,IAAAC,cAAA,OAAKK,UAAU,QACbN,IAAAC,cAACqT,IAAQ,CAACnL,GAAE,eAAAtC,OAAiBhF,IAC3Bb,IAAAC,cAACmI,IAAM,CAACxI,KAAK,SAAQ,YAKzBoI,GAAWnK,EAAO0V,UAAgC,KAApB1V,EAAO0V,UACrCvT,IAAAC,cAAAD,IAAAE,SAAA,KACEF,IAAAC,cAAA,OACEqD,IAAKiP,EACLjS,UAAW0Q,YACT,cACAyB,EAAe,kBAAoB,iBAGrCzS,IAAAC,cAACtC,KAAY,CAACE,OAAQA,KAGvB2U,GACCxS,IAAAC,cAAA,UACEoI,KAAK,SACL5G,QAAS,kBAAMiR,GAAiBD,EAAa,EAC7CnS,UAAU,qIAEVN,IAAAC,cAAA,YAAM,aAAgB,IAACD,IAAAC,cAACuT,KAAc,SAM/C3B,EACC7R,IAAAC,cAAA,OAAKK,UAAU,iBACbN,IAAAC,cAACsE,EAAU,CACTpD,GAAItD,GAAUA,EAAOsD,GACrBN,KAAMA,EACNF,SAAUkR,KAId7R,IAAAC,cAAA,OAAKK,UAAU,iBACbN,IAAAC,cAAC6H,EAAa,CAACjH,KAAMA,EAAMmH,QAASA,OAS3C,IACT,C","file":"js/14-29e8e72a9cda09213245.chunk.js","sourcesContent":["import React, { useEffect } from 'react'\nimport { useEditor, EditorContent } from '@tiptap/react'\nimport StarterKit from '@tiptap/starter-kit'\nimport { Extension } from '@tiptap/core'\nimport Link from '@tiptap/extension-link'\nimport Placeholder from '@tiptap/extension-placeholder'\nimport Typography from '@tiptap/extension-typography'\nimport Highlight from '@tiptap/extension-highlight'\nimport Dropcursor from '@tiptap/extension-dropcursor'\nimport { AiOutlineLoading } from 'react-icons/ai'\nimport BubbleMenu from './plugins/BubbleMenu'\n\nimport './Editor.css'\n\nconst PrimerEditor = ({\n  primer,\n  editable = false,\n  setBody,\n  setBodyText\n}: {\n  primer?: any\n  editable?: boolean\n  setBody?: any\n  setBodyText?: any\n}) => {\n  if (primer) {\n    useEffect(() => {\n      if (editor) {\n        editor.commands.setContent(primer.body)\n      }\n    }, [primer])\n  }\n\n  const editor = useEditor({\n    editable: !!editable,\n    autofocus: false,\n    content: primer ? primer.body : {},\n    extensions: [\n      Placeholder.configure({\n        placeholder: 'Add a description…'\n      }),\n      StarterKit,\n      Typography,\n      Highlight,\n      Link.configure({\n        openOnClick: false\n      }),\n      Extension.create({\n        onUpdate() {\n          if (this.editor.state.doc.textContent == '') {\n            setBody({})\n            setBodyText('')\n          } else {\n            setBody(this.editor.state.doc.toJSON())\n            // https://prosemirror.net/docs/ref/#model.Node.textBetween\n            // Last argument is the placeholder for a leaf node like image ('\\nIMAGE\\n')\n            setBodyText(\n              this.editor.state.doc.textBetween(\n                0,\n                this.editor.state.doc.content.size,\n                ' ',\n                ''\n              )\n            )\n          }\n        }\n      }),\n      Dropcursor.configure({\n        color: '#c7ac75',\n        width: 1\n      })\n    ]\n  })\n\n  if (editor) {\n    return (\n      <>\n        {editable && <BubbleMenu editor={editor} />}\n        <EditorContent editor={editor} />\n      </>\n    )\n  }\n  return <AiOutlineLoading className='my-6 w-full animate-spin text-xl' />\n}\n\nexport default PrimerEditor\n","import React, { useState, useEffect } from 'react'\nimport { createPortal } from 'react-dom'\nimport NiceModal from '@ebay/nice-modal-react'\n\nimport {\n  useInfinitePrimerLogs,\n  useSortPrimerLogs,\n  useRemovePrimerLog\n} from 'app/mainframe/queries/primer'\nimport InfiniteScroll from 'react-infinite-scroller'\nimport {\n  DndContext,\n  closestCenter,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n  DragOverlay\n} from '@dnd-kit/core'\nimport {\n  arrayMove,\n  SortableContext,\n  useSortable,\n  sortableKeyboardCoordinates,\n  rectSortingStrategy\n} from '@dnd-kit/sortable'\nimport { restrictToWindowEdges } from '@dnd-kit/modifiers'\nimport { CSS } from '@dnd-kit/utilities'\n\nimport ContentPreview from 'app/mainframe/components/Content/ContentPreview/ContentPreview'\nimport LogPreview from 'app/mainframe/components/Log/LogPreview/LogPreview'\nimport PopConfirm from 'app/mainframe/components/Modals/PopConfirm'\n\nimport { AiOutlineLoading } from 'react-icons/ai'\nimport { IoCloseCircleOutline } from 'react-icons/io5'\n\nimport { useMixpanel } from 'app/mainframe/context/mixpanel'\nimport Masonry from 'react-masonry-css'\n\ninterface PrimerLogsProps {\n  id: number\n  slug: string\n  sortable?: boolean\n}\n\nconst PrimerLogs = ({ id, slug, sortable }: PrimerLogsProps) => {\n  const { mixpanel } = useMixpanel()\n\n  // TODO loading and background loading ux/design\n  const { data, isLoading, fetchNextPage, hasNextPage } =\n    useInfinitePrimerLogs(slug)\n\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates\n    })\n  )\n\n  const [activeLog, setActiveLog] = useState()\n  const [logs, setLogs] = useState<any[]>()\n\n  useEffect(() => {\n    if (data) {\n      setLogs([].concat.apply([], data?.pages).map(log => log))\n    }\n  }, [data])\n\n  const getIndexFromId = id => logs?.findIndex(log => log.id === id)\n\n  const onDragStart = ({ active }) => {\n    if (active) setActiveLog(logs[getIndexFromId(active.id)])\n  }\n\n  const { mutate: sortPrimerLogs } = useSortPrimerLogs(slug)\n  const onDragEnd = ({ active, over }) => {\n    setActiveLog(null)\n\n    if (active && over && active.id !== over.id) {\n      const newIndex = getIndexFromId(over.id)\n      sortPrimerLogs({\n        slug,\n        logId: active.id,\n        position: newIndex + 1,\n        onMutate: () => {\n          setLogs(arrayMove(logs, getIndexFromId(active.id), newIndex))\n        }\n      })\n      mixpanel.track('Content Reordered', { primer: id })\n    }\n  }\n\n  if (isLoading) {\n    return (\n      <AiOutlineLoading className='my-12 w-full animate-spin text-xl text-gray-300' />\n    )\n  }\n\n  return (\n    <InfiniteScroll\n      loadMore={fetchNextPage}\n      hasMore={hasNextPage}\n      loader={\n        <AiOutlineLoading className='my-12 w-full animate-spin text-xl' />\n      }\n      className='overflow-clip pb-6'\n    >\n      {logs && (\n        <>\n          {sortable ? (\n            <DndContext\n              sensors={sensors}\n              collisionDetection={closestCenter}\n              onDragStart={onDragStart}\n              onDragEnd={onDragEnd}\n              modifiers={[restrictToWindowEdges]}\n            >\n              <SortableContext\n                strategy={rectSortingStrategy}\n                items={logs?.map(log => log.id)}\n              >\n                <PrimerLogsMasonry logs={logs} sortable slug={slug} />\n              </SortableContext>\n              {createPortal(\n                <DragOverlay>\n                  {activeLog && <LogItem sortable log={activeLog} />}\n                </DragOverlay>,\n                document.body\n              )}\n            </DndContext>\n          ) : (\n            <PrimerLogsMasonry logs={logs} />\n          )}\n        </>\n      )}\n    </InfiniteScroll>\n  )\n}\n\nconst PrimerLogsMasonry = ({ logs, sortable = false, slug = null }) => {\n  const onLogClick = (e, key, log) => {\n    const { content } = log\n    e.preventDefault()\n    NiceModal.show('log-carousel-modal', {\n      logs,\n      center: key,\n      content\n    })\n  }\n\n  if (logs) {\n    if (sortable) {\n      return (\n        <div className='grid grid-cols-2 items-baseline justify-items-center md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6'>\n          {logs.map((log, index) => {\n            return <SortableLog key={log.id} log={log} slug={slug} />\n          })}\n        </div>\n      )\n    }\n    return (\n      <Masonry\n        breakpointCols={{\n          default: 4,\n          1400: 3,\n          1100: 2,\n          650: 1\n        }}\n        className='mt-10 ml-auto flex w-auto'\n        columnClassName='bg-clip-padding'\n      >\n        {logs.map((log, index) => {\n          return (\n            <LogItem\n              key={log.id}\n              log={log}\n              onClick={e => onLogClick(e, index, log)}\n            />\n          )\n        })}\n      </Masonry>\n    )\n  }\n  return null\n}\n\nconst SortableLog = ({ log, slug }) => {\n  const {\n    attributes,\n    isDragging,\n    listeners,\n    setNodeRef,\n    transform,\n    transition\n  } = useSortable({ id: log.id, disabled: false })\n\n  // TODO use primer log context to oprtimistically update the state and not need loading state for remove\n  const { mutate: removePrimerLog, isLoading } = useRemovePrimerLog(slug)\n\n  const style = {\n    transform: CSS.Transform.toString(transform),\n    transition,\n    opacity: isDragging ? 0.5 : 1\n  }\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={style}\n      {...attributes}\n      className='group relative'\n    >\n      <div {...listeners} className='cursor-grab'>\n        <LogItem sortable log={log} dragOverlay={isDragging} />\n      </div>\n\n      <div\n        className='absolute right-0.5 top-0.5 z-10 cursor-pointer rounded-full bg-gray-800 text-3xl text-gray-300 opacity-0 shadow transition hover:text-red-700 group-hover:opacity-100'\n        onClick={e => e.preventDefault()}\n      >\n        <PopConfirm\n          text='Remove from collection?'\n          onConfirm={() => removePrimerLog({ slug, logId: log.id })}\n        >\n          {isLoading ? (\n            <AiOutlineLoading className='animate-spin text-2xl' />\n          ) : (\n            <IoCloseCircleOutline />\n          )}\n        </PopConfirm>\n      </div>\n    </div>\n  )\n}\n\ninterface LogItemProps {\n  sortable: boolean\n  log: any\n  dragOverlay?: boolean\n  onClick?: any\n}\n\nconst LogItem = React.memo(\n  <HTMLLIElement, LogItemProps>({\n    sortable = false,\n    log,\n    dragOverlay = false,\n    onClick = null\n  }) => {\n    useEffect(() => {\n      if (!dragOverlay) {\n        return\n      }\n      document.body.style.cursor = 'grabbing'\n      return () => {\n        document.body.style.cursor = ''\n      }\n    }, [dragOverlay])\n\n    const { content } = log\n    if (log.noteText && !sortable) {\n      return (\n        <LogPreview\n          log={log}\n          className='mb-16 max-w-[308px] duration-200 hover:scale-[1.02]'\n          content={content}\n          showContent\n        />\n      )\n    }\n    return (\n      <div className='pb-16'>\n        <ContentPreview content={content} />\n      </div>\n    )\n  }\n)\n\nexport default PrimerLogs\n","import React from 'react'\nimport { Link } from 'react-router-dom'\nimport InfiniteScroll from 'react-infinite-scroller'\nimport { useInfinitePrimerLogs } from 'app/mainframe/queries/primer'\n\nimport { AiOutlineLoading } from 'react-icons/ai'\n\nimport LogCard from 'app/mainframe/components/Log/LogCard'\nimport Button from 'app/mainframe/components/Button/Button'\n\nimport { MdOutlineLayers } from 'react-icons/md'\n\nconst PrimerLogList = ({ slug, isOwner }) => {\n  const { data, isLoading, fetchNextPage, hasNextPage } =\n    useInfinitePrimerLogs(slug)\n\n  if (isLoading) {\n    return <AiOutlineLoading className='my-12 w-full animate-spin text-xl' />\n  }\n  if (data?.pages[0]?.length === 0) {\n    return (\n      <div className='my-10 flex flex-col items-center justify-center text-center'>\n        <div className='text-4xl text-gold-500'>\n          <MdOutlineLayers />\n        </div>\n        <h3 className='my-4 text-lg font-light text-gray-600 dark:text-gray-50'>\n          {isOwner ? \"You haven't added anything\" : 'No logs added'}\n        </h3>\n        {isOwner && (\n          <Link to={`/collection/${slug}/organize`}>\n            <Button\n              type='text'\n              size='small'\n              className='mt-2 bg-gray-666 hover:bg-gray-650 focus:bg-gray-650'\n            >\n              Add content\n            </Button>\n          </Link>\n        )}\n      </div>\n    )\n  }\n  return (\n    <InfiniteScroll\n      loadMore={fetchNextPage}\n      hasMore={hasNextPage}\n      loader={\n        <div className='my-12 flex w-full items-center justify-center'>\n          <AiOutlineLoading className='animate-spin text-xl' />\n        </div>\n      }\n      className='pb-6'\n    >\n      {data &&\n        data.pages.map(page =>\n          page.map(log => (\n            <LogCard\n              key={log.id}\n              log={log}\n              showContent\n              className='first:pt-1'\n            />\n          ))\n        )}\n    </InfiniteScroll>\n  )\n}\nexport default PrimerLogList\n","import React from 'react'\n\nimport { useFeaturedContent } from 'app/mainframe/queries/content'\nimport { useAddPrimerLog } from 'app/mainframe/queries/primer'\n\nimport ContentPreview from 'app/mainframe/components/Content/ContentPreview/ContentPreview'\n\nimport { AiOutlineLoading } from 'react-icons/ai'\n\nimport { useMixpanel } from 'app/mainframe/context/mixpanel'\n\nimport './PrimerFeaturedContent.css'\n\ninterface PrimerFeaturedContentProps {\n  slug: string\n}\n\nconst PrimerFeaturedContent = ({ slug }: PrimerFeaturedContentProps) => {\n  const { mixpanel } = useMixpanel()\n  const { data } = useFeaturedContent()\n  const { mutateAsync } = useAddPrimerLog(slug)\n\n  if (data) {\n    return (\n      <div className='scroll-animation nowrap flex max-h-[666px] flex-nowrap items-baseline justify-items-center sm:grid sm:grid-cols-2 sm:overflow-hidden md:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6'>\n        {data.map(content => (\n          <ContentPreview\n            key={content.id}\n            content={content}\n            className='cursor-pointer px-6 sm:px-0 sm:pb-12'\n            onClick={e => {\n              e.preventDefault()\n              mutateAsync({\n                slug,\n                contentId: content.id,\n                onMutate: null,\n                title: content.title\n              })\n              mixpanel.track('Content Added', {\n                id: content.id,\n                context: 'featured'\n              })\n            }}\n          />\n        ))}\n      </div>\n    )\n  }\n  return <AiOutlineLoading className='my-12 w-full animate-spin text-xl' />\n}\n\nexport default PrimerFeaturedContent\n","import React, { useState, useEffect } from 'react'\nimport {\n  AutocompleteOptions,\n  AutocompleteState,\n  createAutocomplete\n} from '@algolia/autocomplete-core'\nimport { getAlgoliaResults } from '@algolia/autocomplete-preset-algolia'\nimport { Hit } from '@algolia/client-search'\nimport { searchClient } from 'app/mainframe/clients/algoliaClient'\nimport clsx from 'clsx'\n\nimport { useAddLog } from 'app/mainframe/queries/log'\nimport { useAddPrimerLog } from 'app/mainframe/queries/primer'\nimport {\n  useEnrichContent,\n  useParseContentFromUrl\n} from 'app/mainframe/queries/content'\nimport api from 'app/mainframe/api'\n\nimport Image from 'app/mainframe/components/Image'\nimport Button from 'app/mainframe/components/Button/Button'\nimport Popover from 'app/mainframe/components/Popover'\n\nimport { Input, Empty } from 'antd'\n\nimport { SearchOutlined, InfoCircleOutlined } from '@ant-design/icons'\nimport { AiOutlineLoading } from 'react-icons/ai'\nimport {\n  FiBook,\n  FiFilm,\n  FiHeadphones,\n  FiTv,\n  FiMic,\n  FiYoutube\n} from 'react-icons/fi'\n\nimport { useMixpanel } from 'app/mainframe/context/mixpanel'\n\nimport './Autocomplete.css'\n\ntype AutocompleteItem = Hit<{\n  objectID: string\n  title: string\n  creator_list: any[]\n  description: string\n  medium: string\n  form: string\n  slug: string\n  form_display: string\n  form_slug: string\n  origin: string\n  image_url: string\n  placeholder_image_url: string\n  origin_url: string\n}>\n\ninterface Props extends Partial<AutocompleteOptions<AutocompleteItem>> {\n  slug?: string\n  onboard?: boolean\n}\n\nconst enrichOptions = [\n  {\n    id: 'books',\n    media: ['books'],\n    title: 'Books',\n    icon: <FiBook />\n  },\n  { id: 'films', media: ['films'], title: 'Films', icon: <FiFilm /> },\n  { id: 'videos', media: ['videos'], title: 'YouTube', icon: <FiYoutube /> },\n  {\n    id: 'music',\n    media: ['albums', 'tracks'],\n    title: 'Music',\n    icon: <FiHeadphones />\n  },\n  {\n    id: 'podcasts',\n    media: ['shows', 'episodes'],\n    title: 'Podcasts',\n    icon: <FiMic />\n  },\n  {\n    id: 'tv',\n    media: ['tv'],\n    title: 'TV',\n    icon: <FiTv />\n  }\n]\n\nexport const Autocomplete = (props: Props) => {\n  const { mixpanel } = useMixpanel()\n  const { onboard, slug } = props\n  const { mutate: addLog } = useAddLog()\n  const { mutateAsync: addToPrimer } = useAddPrimerLog(slug)\n  const { mutateAsync: parseUrl } = useParseContentFromUrl()\n  const { mutateAsync: enrichResult } = useEnrichContent()\n\n  const [autocompleteState, setAutocompleteState] = useState<\n    AutocompleteState<AutocompleteItem>\n  >({\n    collections: [],\n    completion: null,\n    context: {},\n    isOpen: false,\n    query: '',\n    activeItemId: null,\n    status: 'idle'\n  })\n\n  const [searchResponse, setSearchResponse] = useState(null)\n  const [selectedResult, setSelectedResult] = useState({\n    keyIndex: -1,\n    index: -1\n  })\n  const [mediaType, setMediaType] = useState(null)\n\n  const onSearchSubmit = () => {\n    setSearchResponse(null)\n    setSelectedResult({ keyIndex: -1, index: -1 })\n\n    api.External.search(\n      mediaType.id,\n      autocompleteState.query.replace('&', '')\n    ).then(response => {\n      setSearchResponse(response)\n    })\n  }\n\n  const filters = 'has_creators?:true AND medium:\"book\"'\n\n  const autocomplete = React.useMemo(\n    () =>\n      createAutocomplete<\n        AutocompleteItem,\n        React.BaseSyntheticEvent,\n        React.MouseEvent,\n        React.KeyboardEvent\n      >({\n        onStateChange({ state }) {\n          setAutocompleteState(state)\n        },\n        getSources() {\n          return [\n            {\n              sourceId: 'content',\n              getItems({ query }) {\n                return getAlgoliaResults({\n                  searchClient,\n                  queries: [\n                    {\n                      indexName: `Content_${process.env.ALGOLIASEARCH_INDEX}`,\n                      query,\n                      params: {\n                        hitsPerPage: 5,\n                        highlightPreTag: '<mark>',\n                        highlightPostTag: '</mark>',\n                        filters\n                      }\n                    }\n                  ]\n                })\n              },\n              onSelect({ item, setIsOpen, setQuery }) {\n                if (slug) {\n                  addToPrimer({\n                    slug,\n                    contentId: item.objectID,\n                    onMutate: null,\n                    title: item.title\n                  })\n                } else {\n                  addLog({ id: item.objectID, title: item.title })\n                }\n                setQuery('')\n                setIsOpen(false)\n                trackContentAdded(parseInt(item.objectID))\n              }\n              // TODO add content url here: https://autocomplete.algolia.com/docs/sources#getitemurl\n              // getItemUrl({ item }) {\n              //   return item.origin_url\n              // }\n            }\n          ]\n        },\n        ...props\n      }),\n    [props]\n  )\n  const inputRef = React.useRef<HTMLInputElement>(null)\n  const formRef = React.useRef<HTMLFormElement>(null)\n  const panelRef = React.useRef<HTMLDivElement>(null)\n  const { getEnvironmentProps } = autocomplete\n\n  useEffect(() => {\n    if (!formRef.current || !panelRef.current || !inputRef.current) {\n      return undefined\n    }\n\n    const { onTouchStart, onTouchMove } = getEnvironmentProps({\n      formElement: formRef.current,\n      inputElement: inputRef.current,\n      panelElement: panelRef.current\n    })\n\n    window.addEventListener('touchstart', onTouchStart)\n    window.addEventListener('touchmove', onTouchMove)\n\n    return () => {\n      window.removeEventListener('touchstart', onTouchStart)\n      window.removeEventListener('touchmove', onTouchMove)\n    }\n  }, [getEnvironmentProps, formRef, inputRef, panelRef])\n\n  useEffect(() => {\n    if (searchResponse) {\n      setSearchResponse(null)\n    }\n    setMediaType(null)\n  }, [autocompleteState.query])\n\n  useEffect(() => {\n    if (mediaType) {\n      onSearchSubmit()\n    }\n  }, [mediaType])\n\n  const moveDown = () => {\n    // if nothing is highlighted, select the first result\n    if (selectedResult.index === -1) {\n      return {\n        keyIndex: 0,\n        key: mediaType.media[0],\n        index: 0\n      }\n    }\n    // if the last result in the section is highlighted...\n    if (\n      selectedResult.index ===\n      searchResponse[mediaType.media[selectedResult.keyIndex]].length - 1\n    ) {\n      // if the highlighted section is the last section, select the very first result\n      if (selectedResult.keyIndex === mediaType.media.length - 1) {\n        return {\n          keyIndex: 0,\n          key: mediaType.media[0],\n          index: 0\n        }\n      }\n      // otherwise, select the first result in the next section\n      return {\n        keyIndex: selectedResult.keyIndex + 1,\n        key: mediaType.media[selectedResult.keyIndex + 1],\n        index: 0\n      }\n    }\n    // otherwise, select the next result in the section\n    return {\n      keyIndex: selectedResult.keyIndex,\n      key: mediaType.media[selectedResult.keyIndex],\n      index: selectedResult.index + 1\n    }\n  }\n\n  const onAddFromSearch = (keyIndex = null, index = null) => {\n    const k = keyIndex || selectedResult.keyIndex\n    const i = index || selectedResult.index\n    const result = searchResponse[mediaType.media[k]][i]\n    if (result) {\n      enrichResult({\n        medium: mediaType.id,\n        type: mediaType.media[k],\n        title: result.title,\n        id: result.id\n      }).then(response => {\n        if (!response.errors) {\n          if (slug) {\n            addToPrimer({\n              slug,\n              contentId: response.id,\n              onMutate: null,\n              title: result.title\n            })\n          } else {\n            addLog({ id: response.id, title: result.title })\n          }\n        }\n      })\n    }\n  }\n\n  const moveUp = () => {\n    // if nothing is highlighted or the first result in the first section is highlighted, select the last result in the last section\n    if (\n      selectedResult.index === -1 ||\n      (selectedResult.index === 0 && selectedResult.keyIndex === 0)\n    ) {\n      return {\n        keyIndex: mediaType.media.length - 1,\n        key: mediaType.media.at(-1),\n        index: searchResponse[mediaType.media.at(-1)].length - 1\n      }\n    }\n    // if the first result in the section is highlighted, select the last result in the previous section\n    if (selectedResult.index === 0) {\n      return {\n        keyIndex: selectedResult.keyIndex - 1,\n        key: mediaType.media[selectedResult.keyIndex - 1],\n        index:\n          searchResponse[mediaType.media[selectedResult.keyIndex - 1]].length -\n          1\n      }\n    }\n    // otherwise, select the previous result in the section\n    return {\n      keyIndex: selectedResult.keyIndex,\n      key: mediaType.media[selectedResult.keyIndex],\n      index: selectedResult.index - 1\n    }\n  }\n\n  const onKeyDown = e => {\n    if (searchResponse) {\n      if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n        e.preventDefault()\n        e.stopPropagation()\n\n        const newSelectedResult = e.key === 'ArrowDown' ? moveDown() : moveUp()\n        setSelectedResult(newSelectedResult)\n      }\n    }\n  }\n\n  const onPaste = e => {\n    const text = e.clipboardData.getData('text')\n    e.preventDefault()\n\n    parseUrl({ url: text }).then(response => {\n      if (!response.errors) {\n        if (slug) {\n          addToPrimer({\n            slug,\n            contentId: response.id,\n            onMutate: null,\n            title: response.title\n          })\n        } else {\n          addLog({ id: response.id, title: response.title })\n        }\n        mixpanel.track('External Added', {\n          id: response.id,\n          context: slug ? (onboard ? 'onboard' : 'primer') : 'dashboard'\n        })\n        trackContentAdded(response.id)\n      }\n    })\n    autocomplete.setQuery('')\n    autocomplete.setIsOpen(false)\n  }\n\n  const trackContentAdded = id => {\n    mixpanel.track('Content Added', {\n      id,\n      context: slug ? (onboard ? 'onboard' : 'primer') : 'dashboard'\n    })\n  }\n\n  const noResults =\n    !autocompleteState.isOpen &&\n    autocompleteState.collections.length > 0 &&\n    autocompleteState.query &&\n    autocompleteState.query.length > 0\n\n  return (\n    <div\n      className='searchAutocomplete relative'\n      {...autocomplete.getRootProps({})}\n    >\n      <form\n        ref={formRef}\n        {...autocomplete.getFormProps({ inputElement: inputRef.current })}\n      >\n        <Input\n          allowClear\n          size='large'\n          ref={inputRef as any}\n          prefix={<SearchOutlined />}\n          onPressEnter={e => {\n            e.preventDefault()\n            e.stopPropagation()\n            if (searchResponse && selectedResult.index > -1) {\n              onAddFromSearch()\n            }\n          }}\n          {...autocomplete.getInputProps({ inputElement: inputRef.current })}\n          onKeyDown={\n            searchResponse || noResults\n              ? onKeyDown\n              : autocomplete.getInputProps({ inputElement: inputRef.current })\n                  .onKeyDown\n          }\n          onPaste={onPaste}\n        />\n      </form>\n\n      {autocompleteState.isOpen && (\n        <div\n          ref={panelRef}\n          className='absolute z-20 w-full rounded-lg bg-gray-700 shadow-xl'\n          {...autocomplete.getPanelProps({})}\n        >\n          <div className='relative'>\n            {autocompleteState.collections.map((collection, index) => {\n              const { source, items } = collection\n\n              return (\n                <section key={`index-${index}`}>\n                  <ul\n                    className='mb-0 overflow-hidden rounded-lg'\n                    {...autocomplete.getListProps()}\n                  >\n                    {items.length > 0 &&\n                      items.map(item => {\n                        return (\n                          <li\n                            key={item.objectID}\n                            className='searchResult flex cursor-pointer items-center p-4'\n                            {...autocomplete.getItemProps({ item, source })}\n                          >\n                            <div className='mr-2 h-12 w-12 flex-shrink-0'>\n                              <Image\n                                src={item.image_url}\n                                alt={item.title}\n                                className='h-full w-full object-contain'\n                              />\n                            </div>\n                            <div className='flex min-w-0 flex-col'>\n                              <div\n                                className='single-line mb-1 text-base text-gray-200'\n                                dangerouslySetInnerHTML={{\n                                  __html: item._highlightResult.title\n                                    ? item._highlightResult.title.value\n                                    : item.title\n                                }}\n                              />\n                              <div\n                                className='single-line text-sm text-gray-400'\n                                dangerouslySetInnerHTML={{\n                                  __html: item._highlightResult.creator_list\n                                    ? item._highlightResult.creator_list\n                                        .map(c => c.value)\n                                        .join(', ')\n                                    : item.creator_list.join(', ')\n                                }}\n                              />\n                            </div>\n                          </li>\n                        )\n                      })}\n                  </ul>\n                </section>\n              )\n            })}\n          </div>\n          <SearchFooter\n            onClickAdd={() => {\n              autocomplete.setIsOpen(false)\n              autocomplete.setCollections([\n                {\n                  items: [],\n                  source: autocompleteState.collections[0].source\n                }\n              ])\n            }}\n          />\n        </div>\n      )}\n\n      {noResults && (\n        <div\n          ref={panelRef}\n          className='absolute z-20 w-full rounded-lg bg-gray-700 shadow-xl'\n          {...autocomplete.getPanelProps({})}\n        >\n          <ul\n            className='no-scrollbar mb-0 max-h-[888px] overflow-y-auto rounded-lg'\n            {...autocomplete.getListProps()}\n          >\n            {!searchResponse && (\n              <>\n                <li className='p-4'>\n                  <Popover\n                    position='left-start'\n                    content={\n                      <div className='w-60 px-3 py-4 md:w-[300px]'>\n                        <div className='mb-2 border-b border-gray-650 pb-2'>\n                          <h2 className='text-center text-lg uppercase'>\n                            In Search of Quality\n                          </h2>\n                        </div>\n                        <p className='mb-4 text-base text-gray-200'>\n                          In order to maintain a level of quality, Analogue\n                          relies on the curation of our users.\n                        </p>\n\n                        <p className='mb-4 text-base text-gray-200'>\n                          Therefore, we&apos;ve decided not to add all existing\n                          content from other databases. Every piece of content\n                          in the database has been referred by a public figure\n                          or a user of the platform.\n                        </p>\n\n                        <p className='mb-2 text-base text-gray-200'>\n                          Thank you for understanding that there may be some\n                          pieces missing. We hope you will help us add\n                          meaningful content to our ever-growing catalog.\n                        </p>\n                      </div>\n                    }\n                  >\n                    <InfoCircleOutlined className='right-4 top-3 float-right cursor-pointer text-gray-300 hover:text-gold-500' />\n                  </Popover>\n                  <h3 className='mt-2 mb-1 text-center text-xl'>\n                    You have exceptional taste.\n                  </h3>\n                  <p className='mb-2 text-center text-base text-gray-300'>\n                    Help build our catalog.\n                  </p>\n                </li>\n                <li className='px-4 pb-6'>\n                  <div className='grid grid-cols-3 gap-4'>\n                    {enrichOptions.map(option => (\n                      <div\n                        key={option.id}\n                        className={clsx(\n                          'mediaButton flex flex-col items-center justify-center rounded-md border border-gray-550 py-4 shadow-md',\n                          { selected: mediaType && mediaType.id === option.id }\n                        )}\n                        onClick={() => setMediaType(option)}\n                      >\n                        <div\n                          className={clsx(\n                            'text-2xl',\n                            mediaType && mediaType.id === option.id\n                              ? 'text-gray-800'\n                              : 'text-gray-200'\n                          )}\n                        >\n                          {option.icon}\n                        </div>\n                        <p\n                          className={clsx(\n                            'mt-1 text-sm',\n                            mediaType && mediaType.id === option.id\n                              ? 'text-gray-600'\n                              : 'text-gray-300'\n                          )}\n                        >\n                          {option.title}\n                        </p>\n                      </div>\n                    ))}\n                  </div>\n                </li>\n                {mediaType ? (\n                  <li className='flex cursor-pointer items-center border-t border-gray-600 bg-gray-650 p-4 text-sm'>\n                    <AiOutlineLoading className='mr-2 animate-spin text-base text-gray-300' />\n                    <div className='single-line mr-2'>\n                      Searching for &quot;\n                      <span className='text-base italic text-gold-500'>\n                        {autocompleteState.query}\n                      </span>\n                      &quot;\n                    </div>\n                  </li>\n                ) : (\n                  <li className='flex cursor-pointer items-center border-t border-gray-600 bg-gray-650 p-4 text-sm'>\n                    <div className='single-line mr-2'>\n                      Select a medium to search for &quot;\n                      <span className='text-base italic text-gold-500'>\n                        {autocompleteState.query}\n                      </span>\n                      &quot;\n                    </div>\n                  </li>\n                )}\n              </>\n            )}\n\n            {searchResponse && (\n              <>\n                {searchResponse.num_results > 0 ? (\n                  mediaType.media.map(\n                    (key, keyIndex) =>\n                      searchResponse[key].length > 0 && (\n                        <section className='searchResults pt-4 first:pt-3'>\n                          <div className='resultsTitle px-3 pb-1 text-sm uppercase tracking-widest text-gray-400'>\n                            {key}\n                          </div>\n                          {searchResponse[key].map((item, itemIndex) => (\n                            <li\n                              key={`${key}.${itemIndex}`}\n                              className={clsx(\n                                'flex cursor-pointer items-center p-4',\n                                {\n                                  'bg-gray-650':\n                                    selectedResult.keyIndex === keyIndex &&\n                                    selectedResult.index === itemIndex\n                                }\n                              )}\n                              onMouseEnter={() =>\n                                setSelectedResult({\n                                  keyIndex,\n                                  index: itemIndex\n                                })\n                              }\n                              onMouseLeave={() =>\n                                setSelectedResult({\n                                  keyIndex: -1,\n                                  index: -1\n                                })\n                              }\n                              onClick={() =>\n                                onAddFromSearch(keyIndex, itemIndex)\n                              }\n                            >\n                              <div className='mr-2 h-12 w-12 flex-shrink-0'>\n                                <Image\n                                  src={item.image}\n                                  alt={item.title}\n                                  className='h-full w-full object-contain'\n                                />\n                              </div>\n                              <div className='flex min-w-0 flex-col'>\n                                <div className='single-line mb-1 text-base text-gray-200'>\n                                  {item.title}\n                                </div>\n                                {item.creators && item.creators.length > 0 ? (\n                                  <div className='single-line text-sm text-gray-400'>\n                                    {item.creators}\n                                  </div>\n                                ) : (\n                                  <div className='single-line text-sm text-gray-400'>\n                                    {item.published_at}\n                                  </div>\n                                )}\n                              </div>\n                            </li>\n                          ))}\n                        </section>\n                      )\n                  )\n                ) : (\n                  <li className='flex items-center px-4 py-2 text-sm'>\n                    <div className='mr-4 h-12 w-12 flex-shrink-0'>\n                      <Empty description={false} />\n                    </div>\n                    <div className='single-line flex min-w-0 items-center'>\n                      No results for &quot;\n                      <span className='text-base italic text-gold-500'>\n                        {autocompleteState.query}\n                      </span>\n                      &quot;\n                    </div>\n                  </li>\n                )}\n              </>\n            )}\n          </ul>\n\n          {searchResponse && searchResponse.num_results > 0 && <SearchFooter />}\n        </div>\n      )}\n    </div>\n  )\n}\n\nconst SearchFooter = ({ onClickAdd }: { onClickAdd?: any }) => (\n  <div className='flex items-center border-t border-gray-600 px-3 py-3 leading-none text-gray-200'>\n    <div className='font-xs mr-4 flex items-center'>\n      <span className='mr-1.5 flex items-center rounded-md bg-gray-900 px-1 pb-1 pt-0.5 font-mono text-sm leading-none text-gray-50'>\n        ↑↓\n      </span>\n      Select\n    </div>\n    <div className='font-xs mr-4 flex items-center'>\n      <span className='mr-1.5 flex items-center rounded-md bg-gray-900 px-1.5 py-1 font-mono text-xs leading-none text-gray-50'>\n        enter\n      </span>\n      Add\n    </div>\n    {onClickAdd && (\n      <Button\n        unstyled\n        className='ml-auto px-3 py-1.5 text-[0.7rem]'\n        onClick={onClickAdd}\n      >\n        Add Something else\n      </Button>\n    )}\n  </div>\n)\n","import React, { useEffect, useState } from 'react'\nimport { Link, useParams } from 'react-router-dom'\nimport { ReactTitle } from 'react-meta-tags'\nimport clsx from 'clsx'\n\nimport { useIsOverflow } from 'app/mainframe/hooks/useIsOverflow'\nimport { useAuth } from 'app/mainframe/context/auth'\nimport { usePrimer } from 'app/mainframe/queries/primer'\n\nimport Image from 'app/mainframe/components/Image'\nimport CopyLink from 'app/mainframe/components/CopyLink'\nimport PrimerLogs from 'app/mainframe/components/Primer/PrimerLogs'\nimport PrimerLogList from 'app/mainframe/components/Primer/PrimerLogList'\nimport PrimerFeaturedContent from 'app/mainframe/components/Primer/PrimerFeaturedContent/PrimerFeaturedContent'\nimport { Autocomplete } from 'app/mainframe/components/Autocomplete/Autocomplete'\nimport PrimerEditor from 'app/mainframe/components/Editor/PrimerEditor'\nimport ProfileAvatarGroup from 'app/mainframe/components/Profile/ProfileAvatarGroup'\n\nimport Button from 'app/mainframe/components/Button/Button'\nimport useScrollTop from 'app/mainframe/hooks/useScrollTop'\nimport { IoEllipsisHorizontalCircleOutline } from 'react-icons/io5'\nimport { VscChevronDown } from 'react-icons/vsc'\n\ninterface PrimerProps {\n  organize?: boolean\n  onboard?: boolean\n}\n\nconst Primer = ({ organize, onboard }: PrimerProps) => {\n  useScrollTop()\n  const { slug } = useParams()\n  const { currentUser, setOracleLink } = useAuth()\n\n  const { data: primer } = usePrimer(slug)\n  const [overflowRef, isOverflow] = useIsOverflow()\n  const [showOverflow, setShowOverflow] = useState(false)\n\n  useEffect(() => {\n    setOracleLink(`/primers/${primer?.id}`)\n    return () => setOracleLink(null)\n  }, [primer, setOracleLink])\n\n  const isOwner =\n    currentUser &&\n    primer &&\n    primer.users.find(user => user.username === currentUser.username)\n\n  if (primer) {\n    return (\n      <div className='mx-auto max-w-6xl'>\n        <ReactTitle\n          title={`${primer.title}${\n            primer.userList ? ` by ${primer.userList}` : ''\n          } / Analogue`}\n        />\n        {organize ? (\n          <>\n            <h1 className='mx-auto mb-3 w-full pt-2 text-center text-3xl sm:px-4 sm:pt-10 sm:text-4xl lg:mb-6'>\n              {onboard ? 'My Essentials' : primer.title}\n            </h1>\n            {onboard && (\n              <h2 className='px-0 pb-4 text-center text-base leading-tight text-gray-300 sm:px-24 sm:text-xl'>\n                What content has fundamentally shifted your world view?\n              </h2>\n            )}\n            <div className='mx-auto mt-8 w-full px-4 sm:mb-6 sm:mt-6 sm:w-96 sm:px-1 lg:mt-4'>\n              <Autocomplete\n                autoFocus\n                onboard={onboard}\n                slug={slug}\n                placeholder='Search to add content ...'\n              />\n            </div>\n\n            {onboard ? (\n              // eslint-disable-next-line react/jsx-no-useless-fragment\n              <>\n                {primer.logsCount > 0 ? (\n                  <div className='my-12 flex items-center justify-center sm:my-10 lg:mt-0'>\n                    <Link to={`/collection/${slug}/onboard/share`}>\n                      <Button>Continue</Button>\n                    </Link>\n                  </div>\n                ) : (\n                  <>\n                    <h3 className='text-md pb-10 pt-10 text-center text-gray-300 sm:pt-6 sm:text-lg'>\n                      — or select from below —\n                    </h3>\n                    <PrimerFeaturedContent slug={slug} />\n                  </>\n                )}\n              </>\n            ) : (\n              <div className='mb-16 flex items-center'>\n                <Link className='mx-auto' to={`/collection/${slug}`}>\n                  <Button>Done</Button>\n                </Link>\n              </div>\n            )}\n\n            <div className='lg:col-span-2'>\n              <PrimerLogs\n                id={primer && primer.id}\n                slug={slug}\n                sortable={organize}\n              />\n            </div>\n          </>\n        ) : (\n          <div className='mt-0 grid gap-x-16 gap-y-4 lg:mt-4 lg:grid-cols-3'>\n            <div className='border-b border-gray-700 lg:border-transparent'>\n              {primer.image && (\n                <Image\n                  ratio='16x9'\n                  alt={primer.title}\n                  className='mb-4 w-full rounded-md object-cover'\n                  src={primer.image}\n                />\n              )}\n              <Link\n                className=''\n                to={\n                  isOwner ? `/collection/${slug}/edit` : `/collection/${slug}`\n                }\n              >\n                <h1 className='my-1.5 flex text-2xl text-gray-900 dark:text-gray-50'>\n                  {primer.title}\n                  {isOwner && (\n                    <IoEllipsisHorizontalCircleOutline className='ml-2 mt-1 h-6 w-6 flex-shrink-0' />\n                  )}\n                </h1>\n              </Link>\n              {primer.users && (\n                <h3 className='mb-5 mt-2 flex items-center text-base text-gray-200'>\n                  Curated by\n                  <ProfileAvatarGroup users={primer.users} className='ml-2' />\n                </h3>\n              )}\n              {isOwner ? (\n                <>\n                  <div className='mb-6 flex items-center'>\n                    <Link to={`/collection/${slug}/organize`}>\n                      <Button size='small'>Organize</Button>\n                    </Link>\n                    <Link to={`/collection/${slug}/share`} className='ml-2'>\n                      <Button size='small'>Share</Button>\n                    </Link>\n                  </div>\n                  <div className='mb-8 line-clamp-3'>\n                    <Link to={`/collection/${slug}/edit`}>\n                      <PrimerEditor primer={primer} />\n                    </Link>\n                  </div>\n                </>\n              ) : (\n                <div className='mb-6'>\n                  <CopyLink to={`/collection/${slug}`}>\n                    <Button size='small'>Share</Button>\n                  </CopyLink>\n                </div>\n              )}\n\n              {!isOwner && primer.bodyText && primer.bodyText !== '' && (\n                <>\n                  <div\n                    ref={overflowRef}\n                    className={clsx(\n                      'mb-8 w-full',\n                      showOverflow ? 'line-clamp-none' : 'line-clamp-3'\n                    )}\n                  >\n                    <PrimerEditor primer={primer} />\n                  </div>\n\n                  {isOverflow && (\n                    <button\n                      type='button'\n                      onClick={() => setShowOverflow(!showOverflow)}\n                      className='-mt-3 mb-6 flex items-center space-x-1 text-xs uppercase tracking-wider text-gray-300 transition duration-200 hover:text-gray-100'\n                    >\n                      <span>Show more</span> <VscChevronDown />\n                    </button>\n                  )}\n                </>\n              )}\n            </div>\n            {organize ? (\n              <div className='lg:col-span-2'>\n                <PrimerLogs\n                  id={primer && primer.id}\n                  slug={slug}\n                  sortable={organize}\n                />\n              </div>\n            ) : (\n              <div className='lg:col-span-2'>\n                <PrimerLogList slug={slug} isOwner={isOwner} />\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    )\n  }\n\n  return null\n}\n\nexport default Primer\n"],"sourceRoot":""}