Benature/omnivore
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Some improvements to the additem

Browse Source
This commit is contained in:
Jackson Harper
2024-08-12 20:40:28 +08:00
parent 74320d5917
commit 6529b87e9d
5 changed files with 67 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/web/components/templates/homeFeed/EditItemModals.tsx
View File

@ -31,7 +31,7 @@ export function EditLibraryItemModal(
(
title: string,
author: string | undefined,
description: string,
description: string | undefined,
savedAt: Dayjs,
publishedAt: Dayjs | undefined
) => {
@ -102,7 +102,7 @@ type EditArticleModalProps = {
updateArticle: (
title: string,
author: string | undefined,
description: string,
description: string | undefined,
savedAt: string,
publishedAt: string | undefined
) => void
@ -114,7 +114,7 @@ export function EditArticleModal(props: EditArticleModalProps): JSX.Element {
(
title: string,
author: string | undefined,
description: string,
description: string | undefined,
savedAt: Dayjs,
publishedAt: Dayjs | undefined
) => {
@ -177,7 +177,7 @@ export function EditArticleModal(props: EditArticleModalProps): JSX.Element {
type EditItemModalProps = {
title: string
author: string | undefined
description: string
description: string | undefined
savedAt: Dayjs
publishedAt: Dayjs | undefined
@ -186,7 +186,7 @@ type EditItemModalProps = {
onSave: (
title: string,
author: string | undefined,
description: string,
description: string | undefined,
savedAt: Dayjs,
publishedAt: Dayjs | undefined
) => void

98
packages/web/components/templates/library/LibraryContainer.tsx
View File

@ -41,15 +41,9 @@ import { EmptyLibrary } from '../homeFeed/EmptyLibrary'
import { MultiSelectMode } from '../homeFeed/LibraryHeader'
import { UploadModal } from '../UploadModal'
import { BulkAction } from '../../../lib/networking/library_items/useLibraryItems'
import {
showErrorToast,
showSuccessToast,
showSuccessToastWithAction,
} from '../../../lib/toastHelpers'
import { showErrorToast, showSuccessToast } from '../../../lib/toastHelpers'
import { SetPageLabelsModalPresenter } from '../article/SetLabelsModalPresenter'
import { NotebookPresenter } from '../article/NotebookPresenter'
import { saveUrlMutation } from '../../../lib/networking/mutations/saveUrlMutation'
import { articleQuery } from '../../../lib/networking/queries/useGetArticleQuery'
import { PinnedButtons } from '../homeFeed/PinnedButtons'
import { PinnedSearch } from '../../../pages/settings/pinned-searches'
import { FetchItemsError } from '../homeFeed/FetchItemsError'
@ -59,6 +53,7 @@ import { theme } from '../../tokens/stitches.config'
import { emptyTrashMutation } from '../../../lib/networking/mutations/emptyTrashMutation'
import { State } from '../../../lib/networking/fragments/articleFragment'
import { useHandleAddUrl } from '../../../lib/hooks/useHandleAddUrl'
import { QueryClient, useQueryClient } from '@tanstack/react-query'
export type LayoutType = 'LIST_LAYOUT' | 'GRID_LAYOUT'
@ -75,11 +70,6 @@ const debouncedFetchSearchResults = debounce((query, cb) => {
fetchSearchResults(query, cb)
}, 300)
// We set a relatively high delay for the refresh at the end, as it's likely there's an issue
// in processing. We give it the best attempt to be able to resolve, but if it doesn't we set
// the state as Failed. On refresh it will try again if the backend sends "PROCESSING"
const TIMEOUT_DELAYS = [2000, 3500, 5000]
type LibraryContainerProps = {
folder: string | undefined
filterFunc: (item: LibraryItemNode) => boolean
@ -88,8 +78,8 @@ type LibraryContainerProps = {
}
export function LibraryContainer(props: LibraryContainerProps): JSX.Element {
const { viewerData } = useGetViewerQuery()
const router = useRouter()
const { viewerData } = useGetViewerQuery()
const { queryValue } = useKBar((state) => ({ queryValue: state.searchQuery }))
const [searchResults, setSearchResults] = useState<SearchItem[]>([])
@ -185,78 +175,13 @@ export function LibraryContainer(props: LibraryContainerProps): JSX.Element {
}
}, [libraryItems])
// useEffect(() => {
// const timeout: NodeJS.Timeout[] = []
const processingItems = useMemo(() => {
return libraryItems
.filter((li) => li.node.state === State.PROCESSING)
.map((li) => li.node.id)
}, [libraryItems])
// const items = (
// itemsPages?.flatMap((ad) => {
// return ad.search.edges.map((it) => ({
// ...it,
// isLoading: it.node.state === 'PROCESSING',
// }))
// }) || []
// ).filter((it) => it.isLoading)
// items.map(async (item) => {
// let startIdx = 0
// const seeIfUpdated = async () => {
// if (startIdx >= TIMEOUT_DELAYS.length) {
// item.node.state = State.FAILED
// const updatedArticle = { ...item }
// updatedArticle.node = { ...item.node }
// updatedArticle.isLoading = false
// // performActionOnItem('update-item', updatedArticle)
// return
// }
// const username = viewerData?.me?.profile.username
// const itemsToUpdate = libraryItems.filter((it) => it.isLoading)
// if (itemsToUpdate.length > 0) {
// const link = await articleQuery({
// username,
// slug: item.node.id,
// includeFriendsHighlights: false,
// })
// if (link && link.state != 'PROCESSING') {
// const updatedArticle = { ...item }
// updatedArticle.node = { ...item.node, ...link }
// updatedArticle.isLoading = false
// console.log(`Updating Metadata of ${item.node.slug}.`)
// // performActionOnItem('update-item', updatedArticle)
// return
// }
// console.log(
// `Trying to get the metadata of item ${item.node.slug}... Retry ${startIdx} of 5`
// )
// timeout.push(setTimeout(seeIfUpdated, TIMEOUT_DELAYS[startIdx++]))
// }
// }
// await seeIfUpdated()
// })
// return () => {
// timeout.forEach(clearTimeout)
// }
// }, [itemsPages])
// const handleFetchMore = useCallback(() => {
// if (isLoading || !hasNextPage) {
// return
// }
// setSize(size + 1)
// }, [size, isValidating])
// useEffect(() => {
// if (isValidating || !hasNextPage || size !== 1) {
// return
// }
// setSize(size + 1)
// }, [size, isValidating])
console.log('processingItems: ', processingItems)
const focusFirstItem = useCallback(() => {
if (libraryItems.length < 1) {
@ -361,10 +286,6 @@ export function LibraryContainer(props: LibraryContainerProps): JSX.Element {
if (activeCardId && !alreadyScrolled.current) {
scrollToActiveCard(activeCardId)
alreadyScrolled.current = true
// if (activeItem) {
// performActionOnItem('refresh', activeItem)
// }
}
}, [activeCardId, scrollToActiveCard])
@ -880,7 +801,6 @@ export function LibraryContainer(props: LibraryContainerProps): JSX.Element {
const href = `${window.location.pathname}?${qp.toString()}`
router.push(href, href, { shallow: true })
window.sessionStorage.setItem('q', qp.toString())
// performActionOnItem('refresh', undefined as unknown as any)
}}
loadMore={fetchNextPage}
hasMore={hasNextPage ?? false}

32
packages/web/lib/networking/library_items/gql.tsx
View File

@ -203,6 +203,38 @@ export const GQL_UPDATE_LIBRARY_ITEM = gql`
}
`
export const GQL_GET_LIBRARY_ITEM = gql`
query GetArticle(
$username: String!
$slug: String!
$includeFriendsHighlights: Boolean
) {
article(username: $username, slug: $slug) {
... on ArticleSuccess {
article {
...ArticleFields
highlights(input: { includeFriends: $includeFriendsHighlights }) {
...HighlightFields
}
labels {
...LabelFields
}
recommendations {
...RecommendationFields
}
}
}
... on ArticleError {
errorCodes
}
}
}
${articleFragment}
${highlightFragment}
${labelFragment}
${recommendationFragment}
`
export const GQL_GET_LIBRARY_ITEM_CONTENT = gql`
query GetArticle(
$username: String!

19
packages/web/lib/networking/library_items/useLibraryItems.tsx
View File

@ -13,6 +13,7 @@ import { Label } from '../fragments/labelFragment'
import {
GQL_BULK_ACTION,
GQL_DELETE_LIBRARY_ITEM,
GQL_GET_LIBRARY_ITEM,
GQL_GET_LIBRARY_ITEM_CONTENT,
GQL_MOVE_ITEM_TO_FOLDER,
GQL_SAVE_ARTICLE_READING_PROGRESS,
@ -517,6 +518,24 @@ export const useUpdateItemReadStatus = () => {
})
}
export function useRefreshProcessingItems(itemIds: string[]) {
const fullQuery = `in:all includes:${itemIds.join(',')}`
return useQuery({
queryKey: ['libraryItems', fullQuery],
queryFn: async () => {
const response = (await gqlFetcher(GQL_SEARCH_QUERY, {
after: 0,
first: 10,
query: fullQuery,
includeContent: false,
})) as LibraryItemsData
return response.search
},
enabled: itemIds.length > 0,
})
}
export const useGetLibraryItemContent = (username: string, slug: string) => {
const queryClient = useQueryClient()
return useQuery({

4
packages/web/pages/_app.tsx
View File

@ -38,10 +38,10 @@ if (typeof window !== 'undefined') {
persistQueryClient({
queryClient,
persister: localStoragePersister,
maxAge: 60 * 60 * 1000,
// one week cache time
maxAge: 7 * 24 * 60 * 60 * 1000,
dehydrateOptions: {
shouldDehydrateQuery: ({ queryKey }) => {
console.log('queryKey: ', queryKey)
// Don't cache the library items in local storage
const [firstKey] = queryKey
return firstKey !== 'library-items'