import React, { useCallback, useMemo, useState } from 'react' import { mdiStar, mdiStarOutline, mdiLock, mdiDotsHorizontal, mdiWeb, mdiDomain } from '@mdi/js' import classNames from 'classnames' import type { Observable } from 'rxjs' import { catchError, switchMap, tap } from 'rxjs/operators' import { TelemetryV2Props } from '@sourcegraph/shared/src/telemetry' import type { TelemetryProps } from '@sourcegraph/shared/src/telemetry/telemetryService' import { Menu, MenuButton, MenuDivider, MenuItem, Button, useEventObservable, MenuList, MenuHeader, Position, Icon, } from '@sourcegraph/wildcard' import type { AuthenticatedUser } from '../../auth' import type { NotebookFields } from '../../graphql-operations' import { OrgAvatar } from '../../org/OrgAvatar' import type { deleteNotebook as _deleteNotebook, createNotebookStar as _createNotebookStar, deleteNotebookStar as _deleteNotebookStar, } from '../backend' import { DeleteNotebookModal } from './DeleteNotebookModal' import type { ShareOption } from './NotebookShareOptionsDropdown' import { ShareNotebookModal } from './ShareNotebookModal' import styles from './NotebookPageHeaderActions.module.scss' export interface NotebookPageHeaderActionsProps extends TelemetryProps, TelemetryV2Props { isSourcegraphDotCom: boolean authenticatedUser: AuthenticatedUser | null namespace: NotebookFields['namespace'] notebookId: string viewerCanManage: boolean isPublic: boolean onUpdateVisibility: (isPublic: boolean, namespace: string) => void deleteNotebook: typeof _deleteNotebook starsCount: number viewerHasStarred: boolean createNotebookStar: typeof _createNotebookStar deleteNotebookStar: typeof _deleteNotebookStar } export const NotebookPageHeaderActions: React.FunctionComponent< React.PropsWithChildren > = ({ isSourcegraphDotCom, authenticatedUser, notebookId, viewerCanManage, isPublic, namespace, onUpdateVisibility, deleteNotebook, starsCount, viewerHasStarred, createNotebookStar, deleteNotebookStar, telemetryService, telemetryRecorder, }) => { const [showShareModal, setShowShareModal] = useState(false) const toggleShareModal = useCallback(() => setShowShareModal(show => !show), [setShowShareModal]) const [selectedShareOption, setSelectedShareOption] = useState( namespace ? { namespaceType: namespace.__typename, namespaceId: namespace.id, namespaceName: namespace.namespaceName, isPublic, } : null ) const shareIcon = useMemo(() => { if (!selectedShareOption) { return <> } if (selectedShareOption.namespaceType === 'User') { return selectedShareOption.isPublic ? ( ) : ( ) } return ( ) }, [selectedShareOption, isSourcegraphDotCom]) return (

{authenticatedUser && viewerCanManage && namespace && selectedShareOption && ( <> )} {viewerCanManage && ( )}

) } interface NotebookSettingsDropdownProps extends TelemetryProps, TelemetryV2Props { notebookId: string deleteNotebook: typeof _deleteNotebook } const NotebookSettingsDropdown: React.FunctionComponent> = ({ notebookId, deleteNotebook, telemetryService, telemetryRecorder, }) => { const [showDeleteModal, setShowDeleteModal] = useState(false) const toggleDeleteModal = useCallback(() => setShowDeleteModal(show => !show), [setShowDeleteModal]) return ( <> Settings setShowDeleteModal(true)} > Delete notebook ) } interface NotebookStarsButtonProps extends TelemetryProps, TelemetryV2Props { notebookId: string disabled: boolean starsCount: number viewerHasStarred: boolean createNotebookStar: typeof _createNotebookStar deleteNotebookStar: typeof _deleteNotebookStar } const NotebookStarsButton: React.FunctionComponent> = ({ notebookId, disabled, starsCount: initialStarsCount, viewerHasStarred: initialViewerHasStarred, createNotebookStar, deleteNotebookStar, telemetryService, telemetryRecorder, }) => { const [starsCount, setStarsCount] = useState(initialStarsCount) const [viewerHasStarred, setViewerHasStarred] = useState(initialViewerHasStarred) const [onStarToggle] = useEventObservable( useCallback( (viewerHasStarred: Observable) => viewerHasStarred.pipe( // Immediately update the UI. tap(viewerHasStarred => { telemetryService.log(`SearchNotebook${viewerHasStarred ? 'Remove' : 'Add'}Star`) telemetryRecorder.recordEvent('notebook.stars', viewerHasStarred ? 'remove' : 'add') if (viewerHasStarred) { setStarsCount(starsCount => starsCount - 1) setViewerHasStarred(() => false) } else { setStarsCount(starsCount => starsCount + 1) setViewerHasStarred(() => true) } }), switchMap(viewerHasStarred => viewerHasStarred ? deleteNotebookStar(notebookId) : createNotebookStar(notebookId) ), catchError(() => { setStarsCount(initialStarsCount) setViewerHasStarred(initialViewerHasStarred) return [] }) ), [ deleteNotebookStar, notebookId, createNotebookStar, initialStarsCount, initialViewerHasStarred, telemetryService, telemetryRecorder, ] ) ) return ( ) }