diff --git a/packages/web/components/templates/homeFeed/EditTitleModal.tsx b/packages/web/components/templates/homeFeed/EditTitleModal.tsx deleted file mode 100644 index 6cab4a025..000000000 --- a/packages/web/components/templates/homeFeed/EditTitleModal.tsx +++ /dev/null @@ -1,173 +0,0 @@ -import { - ModalRoot, - ModalContent, - ModalOverlay, -} from '../../elements/ModalPrimitives' -import { VStack, HStack, Box } from '../../elements/LayoutPrimitives' -import { Button } from '../../elements/Button' -import { StyledText } from '../../elements/StyledText' -import { CrossIcon } from '../../elements/images/CrossIcon' -import { theme } from '../../tokens/stitches.config' -import { FormInput } from '../../elements/FormElements' -import { useState } from 'react' -import { LibraryItem } from '../../../lib/networking/queries/useGetLibraryItemsQuery' -import { StyledTextArea } from '../../elements/StyledTextArea' -import { updatePageMutation } from '../../../lib/networking/mutations/updatePageMutation' -import { showErrorToast, showSuccessToast } from '../../../lib/toastHelpers' - -type EditTitleModalProps = { - onOpenChange: (open: boolean) => void - item: LibraryItem - updateItem: (item: LibraryItem) => Promise -} - -export function EditTitleModal(props: EditTitleModalProps): JSX.Element { - const [title, setTitle] = useState(props.item.node.title) - const [author, setAuthor] = useState(props.item.node.author) - const [description, setDescription] = useState(props.item.node.description) - - const handleUpdateTitle = async () => { - if (title !== '') { - const res = await updatePageMutation({ - pageId: props.item.node.id, - title, - description, - byline: author, - }) - - if (res) { - await props.updateItem({ - cursor: props.item.cursor, - node: { - ...props.item.node, - title: title, - author: author, - description: description, - }, - }) - showSuccessToast('Link updated succesfully', { - position: 'bottom-right', - }) - props.onOpenChange(false) - } else { - showErrorToast('There was an error updating your link', { - position: 'bottom-right', - }) - } - } else { - showErrorToast('Title must be a non-empty value', { - position: 'bottom-right', - }) - } - } - - return ( - - - { - // remove focus from modal - ;(document.activeElement as HTMLElement).blur() - }} - > - - - - Edit Title and Description - - - - Title - -
{ - event.preventDefault() - }} - > - setTitle(event.target.value)} - css={{ - borderRadius: '8px', - border: '1px solid $grayTextContrast', - width: '100%', - p: '$2', - }} - /> - Author - setAuthor(event.target.value)} - css={{ - borderRadius: '8px', - border: '1px solid $grayTextContrast', - width: '100%', - p: '$2', - }} - /> - - Description - - - setDescription(event.target.value)} - maxLength={4000} - /> - - - - - - -
-
-
-
- ) -} diff --git a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx index 1c2753cd2..908c3143d 100644 --- a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx +++ b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx @@ -39,7 +39,7 @@ import { State, } from '../../../lib/networking/fragments/articleFragment' import { Action, createAction, useKBar, useRegisterActions } from 'kbar' -import { EditTitleModal } from './EditTitleModal' +import { EditLibraryItemModal } from './EditItemModals' import { useGetUserPreferences } from '../../../lib/networking/queries/useGetUserPreferences' import debounce from 'lodash/debounce' import { @@ -992,7 +992,7 @@ function HomeFeedGrid(props: HomeFeedContentProps): JSX.Element { props.setShowAddLinkModal(false)} /> )} {props.showEditTitleModal && ( - props.actionHandler('update-item', item) } diff --git a/packages/web/pages/[username]/[slug]/index.tsx b/packages/web/pages/[username]/[slug]/index.tsx index ea7a6010e..43b5cdc68 100644 --- a/packages/web/pages/[username]/[slug]/index.tsx +++ b/packages/web/pages/[username]/[slug]/index.tsx @@ -39,6 +39,7 @@ import { deleteLinkMutation } from '../../../lib/networking/mutations/deleteLink import { ConfirmationModal } from '../../../components/patterns/ConfirmationModal' import { setLabelsMutation } from '../../../lib/networking/mutations/setLabelsMutation' import { ReaderHeader } from '../../../components/templates/reader/ReaderHeader' +import { EditLibraryItemModal } from '../../../components/templates/homeFeed/EditItemModals' const PdfArticleContainerNoSSR = dynamic( () => import('./../../../components/templates/article/PdfArticleContainer'), @@ -402,6 +403,13 @@ export default function Home(): JSX.Element { onOpenChange={() => readerSettings.setShowDeleteConfirmation(false)} /> )} + {/* {article && readerSettings.showDeleteConfirmation && ( + {}} + onOpenChange={() => readerSettings.setShowDeleteConfirmation(false)} + /> + )} */} ) } diff --git a/packages/web/stories/EditTitleModal.stories.tsx b/packages/web/stories/EditTitleModal.stories.tsx index 53a7b41f9..eb76d8b9d 100644 --- a/packages/web/stories/EditTitleModal.stories.tsx +++ b/packages/web/stories/EditTitleModal.stories.tsx @@ -1,10 +1,10 @@ import { ComponentStory, ComponentMeta } from '@storybook/react' -import { EditTitleModal } from '../components/templates/homeFeed/EditTitleModal' +import { EditLibraryItemModal } from '../components/templates/homeFeed/EditItemModals' import { LibraryItem } from '../lib/networking/queries/useGetLibraryItemsQuery' export default { title: 'Components/EditTitleModal', - component: EditTitleModal, + component: EditLibraryItemModal, argTypes: { onOpenChange: { description: @@ -23,18 +23,16 @@ export default { }, viewMode: 'canvas', }, -} as ComponentMeta +} as ComponentMeta -export const EditTitleModalStory: ComponentStory = ( - args -) => ( - {}} - item={{ - cursor: '', - node: { title: '', description: '' } as LibraryItem['node'], - }} - updateItem={async () => console.log('update item')} - - /> -) +export const EditTitleModalStory: ComponentStory = + (args) => ( + {}} + item={{ + cursor: '', + node: { title: '', description: '' } as LibraryItem['node'], + }} + updateItem={async () => console.log('update item')} + /> + )