feat(idpe-15219): remove pinned items from flows (#5783)

Author: wiedld

src/flows/components/FlowCard.tsx

@@ -1,6 +1,5 @@
 import React, {FC, useContext} from 'react'
 import {useParams, useHistory} from 'react-router-dom'
-import {useDispatch} from 'react-redux'
 
 // Components
 import {ResourceCard} from '@influxdata/clockface'
@@ -9,29 +8,19 @@ import {DEFAULT_PROJECT_NAME, PROJECT_NAME_PLURAL} from 'src/flows'
 import {FlowListContext} from 'src/flows/context/flow.list'
 
 // Utils
-import {updatePinnedItemByParam} from 'src/shared/contexts/pinneditems'
-import {isFlagEnabled} from 'src/shared/utils/featureFlag'
-import {CLOUD} from 'src/shared/constants'
-import {
-  pinnedItemFailure,
-  pinnedItemSuccess,
-} from 'src/shared/copy/notifications'
-import {notify} from 'src/shared/actions/notifications'
 import {shouldOpenLinkInNewTab} from 'src/utils/crossPlatform'
 import {safeBlankLinkOpen} from 'src/utils/safeBlankLinkOpen'
 
 interface Props {
   id: string
-  isPinned: boolean
 }
 
-const FlowCard: FC<Props> = ({id, isPinned}) => {
+const FlowCard: FC<Props> = ({id}) => {
   const {update, flows} = useContext(FlowListContext)
   const flow = flows[id]
   const {orgID} = useParams<{orgID: string}>()
 
   const history = useHistory()
-  const dispatch = useDispatch()
 
   const flowUrl = `/orgs/${orgID}/${PROJECT_NAME_PLURAL.toLowerCase()}/${id}`
 
@@ -43,21 +32,11 @@ const FlowCard: FC<Props> = ({id, isPinned}) => {
     }
   }
 
-  const contextMenu = (
-    <FlowContextMenu id={id} name={flow.name} isPinned={isPinned} />
-  )
+  const contextMenu = <FlowContextMenu id={id} name={flow.name} />
 
   const handleRenameNotebook = async (name: string) => {
     flow.name = name
     await update(id, flow)
-    if (isFlagEnabled('pinnedItems') && CLOUD && isPinned) {
-      try {
-        updatePinnedItemByParam(id, {name})
-        dispatch(notify(pinnedItemSuccess('notebook', 'updated')))
-      } catch (err) {
-        dispatch(notify(pinnedItemFailure(err.message, 'update')))
-      }
-    }
   }
 
   const meta = []

src/flows/components/FlowCards.tsx

@@ -1,4 +1,4 @@
-import React, {FC, useEffect, useState} from 'react'
+import React, {FC} from 'react'
 
 import {
   ResourceList,
@@ -12,12 +12,6 @@ import FlowCard from 'src/flows/components/FlowCard'
 import {PROJECT_NAME_PLURAL} from 'src/flows'
 import {FlowList} from 'src/types/flows'
 import {isFlagEnabled} from 'src/shared/utils/featureFlag'
-import {CLOUD} from 'src/shared/constants'
-
-let getPinnedItems
-if (CLOUD) {
-  getPinnedItems = require('src/shared/contexts/pinneditems').getPinnedItems
-}
 
 interface Props {
   flows: FlowList
@@ -33,29 +27,13 @@ const NoMatches = () => {
 }
 
 const FlowCards: FC<Props> = ({flows, search}) => {
-  const [pinnedItems, setPinnedItems] = useState([])
-
-  useEffect(() => {
-    if (isFlagEnabled('pinnedItems') && CLOUD) {
-      getPinnedItems()
-        .then(res => setPinnedItems(res))
-        .catch(err => {
-          console.error(err.message)
-        })
-    }
-  }, [flows])
-
   const body = (
     <ResourceList>
       <ResourceList.Body
         emptyState={!!search ? <NoMatches /> : <FlowsIndexEmpty />}
       >
         {Object.keys(flows.flows).map(id => (
-          <FlowCard
-            key={id}
-            id={id}
-            isPinned={!!pinnedItems.find(item => item?.metadata.flowID === id)}
-          />
+          <FlowCard key={id} id={id} />
         ))}
       </ResourceList.Body>
     </ResourceList>

src/flows/components/FlowContextMenu.tsx

@@ -3,10 +3,6 @@ import React, {createRef, FC, RefObject, useContext} from 'react'
 import {useParams, useHistory} from 'react-router-dom'
 import 'src/flows/components/FlowContextMenu.scss'
 
-// Selector
-import {getMe} from 'src/me/selectors'
-import {useSelector, useDispatch} from 'react-redux'
-
 // Components
 import {
   Appearance,
@@ -25,75 +21,22 @@ import {PROJECT_NAME, PROJECT_NAME_PLURAL} from 'src/flows'
 
 // Utils
 import {event} from 'src/cloud/utils/reporting'
-
-import {
-  addPinnedItem,
-  deletePinnedItemByParam,
-  PinnedItemTypes,
-} from 'src/shared/contexts/pinneditems'
-import {isFlagEnabled} from 'src/shared/utils/featureFlag'
 import {CLOUD} from 'src/shared/constants'
 
-import {
-  pinnedItemFailure,
-  pinnedItemSuccess,
-} from 'src/shared/copy/notifications'
-import {notify} from 'src/shared/actions/notifications'
-
 interface Props {
   id: string
   name: string
-  isPinned: boolean
 }
 
-const FlowContextMenu: FC<Props> = ({id, name, isPinned}) => {
+const FlowContextMenu: FC<Props> = ({id}) => {
   const {remove, clone} = useContext(FlowListContext)
   const {orgID} = useParams<{orgID: string}>()
-  const me = useSelector(getMe)
   const history = useHistory()
-  const dispatch = useDispatch()
-
-  const handleDeletePinnedItem = async () => {
-    try {
-      await deletePinnedItemByParam(id)
-      dispatch(notify(pinnedItemSuccess('notebook', 'deleted')))
-    } catch (err) {
-      dispatch(notify(pinnedItemFailure(err.message, 'delete')))
-    }
-  }
-
-  const handleAddPinnedItem = async () => {
-    try {
-      await addPinnedItem({
-        orgID: orgID,
-        userID: me.id,
-        metadata: {
-          flowID: id,
-          name,
-        },
-        type: PinnedItemTypes.Notebook,
-      })
-      dispatch(notify(pinnedItemSuccess('notebook', 'added')))
-    } catch (err) {
-      dispatch(notify(pinnedItemFailure(err.message, 'create')))
-    }
-  }
-
-  const handlePinFlow = () => {
-    if (isPinned) {
-      // delete from pinned item list
-      handleDeletePinnedItem()
-    } else {
-      // add to pinned item list
-      handleAddPinnedItem()
-    }
-  }
 
   const handleDelete = () => {
     event('delete_notebook', {
       context: 'list',
     })
-    deletePinnedItemByParam(id)
     remove(id)
   }
 
@@ -134,7 +77,7 @@ const FlowContextMenu: FC<Props> = ({id, name, isPinned}) => {
             enableDefaultStyles={false}
             style={{minWidth: '112px'}}
             triggerRef={settingsRef}
-            contents={onHide => (
+            contents={_ => (
               <List>
                 <List.Item
                   onClick={handleClone}
@@ -144,19 +87,6 @@ const FlowContextMenu: FC<Props> = ({id, name, isPinned}) => {
                 >
                   Clone
                 </List.Item>
-                {isFlagEnabled('pinnedItems') && CLOUD && (
-                  <List.Item
-                    onClick={() => {
-                      handlePinFlow()
-                      onHide()
-                    }}
-                    size={ComponentSize.Small}
-                    style={{fontWeight: 500}}
-                    testID="context-pin-flow"
-                  >
-                    {isPinned ? 'Unpin' : 'Pin'}
-                  </List.Item>
-                )}
               </List>
             )}
           />

src/flows/components/header/MenuButton.tsx

@@ -21,7 +21,6 @@ import {useHistory} from 'react-router-dom'
 // Utils
 import {event} from 'src/cloud/utils/reporting'
 import {getOrg} from 'src/organizations/selectors'
-import {deletePinnedItemByParam} from 'src/shared/contexts/pinneditems'
 import {downloadImage} from 'src/shared/utils/download'
 
 // Constants
@@ -66,7 +65,6 @@ const MenuButton: FC<Props> = ({handleResetShare}) => {
       event('delete_notebook', {
         context: 'notebook',
       })
-      await deletePinnedItemByParam(flow.id)
       await deleteNotebook()
       setLoading(RemoteDataState.Done)
       history.push(`/orgs/${orgID}/${PROJECT_NAME_PLURAL.toLowerCase()}`)

src/flows/components/header/index.tsx

@@ -32,7 +32,6 @@ import MenuButton from 'src/flows/components/header/MenuButton'
 import {getNotebooksShare, postNotebooksShare} from 'src/client/notebooksRoutes'
 import {event} from 'src/cloud/utils/reporting'
 import {serialize} from 'src/flows/context/flow.list'
-import {updatePinnedItemByParam} from 'src/shared/contexts/pinneditems'
 import {getOrg} from 'src/organizations/selectors'
 import {showOverlay} from 'src/overlays/actions/overlays'
 
@@ -86,11 +85,6 @@ const FlowHeader: FC = () => {
 
   const handleRename = (name: string) => {
     updateOther({name})
-    try {
-      updatePinnedItemByParam(flow.id, {name})
-    } catch (err) {
-      console.error(err)
-    }
   }
 
   const generateLink = async () => {