rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat-dev(wip): files table view (#2100)

Browse Source
This commit is contained in:
Aman Harwara
2022-12-20 19:01:24 +05:30
committed by GitHub
parent 343c39e873
commit c94035c1d6
23 changed files with 800 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/web/src/javascripts/Components/LinkedItems/LinkedFileMenuOptions.tsx
View File

@@ -2,7 +2,7 @@ import { FOCUSABLE_BUT_NOT_TABBABLE } from '@/Constants/Constants'
import { FilesController } from '@/Controllers/FilesController'
import { FileItem } from '@standardnotes/snjs'
import { useState } from 'react'
import { PopoverFileItemActionType } from '../AttachedFilesPopover/PopoverFileItemAction'
import { FileItemActionType } from '../AttachedFilesPopover/PopoverFileItemAction'
import { FileContextMenuBackupOption } from '../FileContextMenu/FileContextMenuBackupOption'
import Icon from '../Icon/Icon'
import HorizontalSeparator from '../Shared/HorizontalSeparator'
@@ -24,7 +24,7 @@ const LinkedFileMenuOptions = ({ file, closeMenu, handleFileAction, setIsRenamin
className="flex w-full cursor-pointer items-center border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={() => {
void handleFileAction({
type: PopoverFileItemActionType.PreviewFile,
type: FileItemActionType.PreviewFile,
payload: {
file,
otherFiles: [],
@@ -41,7 +41,7 @@ const LinkedFileMenuOptions = ({ file, closeMenu, handleFileAction, setIsRenamin
className="flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={() => {
handleFileAction({
type: PopoverFileItemActionType.ToggleFileProtection,
type: FileItemActionType.ToggleFileProtection,
payload: { file },
callback: (isProtected: boolean) => {
setIsFileProtected(isProtected)
@@ -60,7 +60,7 @@ const LinkedFileMenuOptions = ({ file, closeMenu, handleFileAction, setIsRenamin
className="flex w-full cursor-pointer items-center border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={() => {
handleFileAction({
type: PopoverFileItemActionType.DownloadFile,
type: FileItemActionType.DownloadFile,
payload: { file },
}).catch(console.error)
closeMenu()
@@ -83,7 +83,7 @@ const LinkedFileMenuOptions = ({ file, closeMenu, handleFileAction, setIsRenamin
className="flex w-full cursor-pointer items-center border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={() => {
handleFileAction({
type: PopoverFileItemActionType.DeleteFile,
type: FileItemActionType.DeleteFile,
payload: { file },
}).catch(console.error)
closeMenu()

6
packages/web/src/javascripts/Components/LinkedItems/LinkedItemBubblesContainer.tsx
View File

@@ -11,7 +11,6 @@ import { LinkableItem } from '@/Utils/Items/Search/LinkableItem'
import { ItemLink } from '@/Utils/Items/Search/ItemLink'
import { FOCUS_TAGS_INPUT_COMMAND, keyboardStringForShortcut } from '@standardnotes/ui-services'
import { useCommandService } from '../CommandProvider'
import { useApplication } from '../ApplicationProvider'
import { useItemLinks } from '@/Hooks/useItemLinks'
type Props = {
@@ -19,14 +18,11 @@ type Props = {
}
const LinkedItemBubblesContainer = ({ linkingController }: Props) => {
const application = useApplication()
const activeItem = application.itemControllerGroup.activeItemViewController?.item
const { toggleAppPane } = useResponsiveAppPane()
const commandService = useCommandService()
const { unlinkItemFromSelectedItem: unlinkItem, activateItem } = linkingController
const { activeItem, unlinkItemFromSelectedItem: unlinkItem, activateItem } = linkingController
const { notesLinkedToItem, filesLinkedToItem, tagsLinkedToItem, notesLinkingToItem, filesLinkingToItem } =
useItemLinks(activeItem)

6
packages/web/src/javascripts/Components/LinkedItems/LinkedItemsButton.tsx
View File

@@ -3,7 +3,6 @@ import { FilesController } from '@/Controllers/FilesController'
import { LinkingController } from '@/Controllers/LinkingController'
import { observer } from 'mobx-react-lite'
import { useRef, useCallback } from 'react'
import { useApplication } from '../ApplicationProvider'
import RoundIconButton from '../Button/RoundIconButton'
import Popover from '../Popover/Popover'
import StyledTooltip from '../StyledTooltip/StyledTooltip'
@@ -17,10 +16,7 @@ type Props = {
}
const LinkedItemsButton = ({ linkingController, filesController, onClickPreprocessing, featuresController }: Props) => {
const application = useApplication()
const activeItem = application.itemControllerGroup.activeItemViewController?.item
const { isLinkingPanelOpen, setIsLinkingPanelOpen } = linkingController
const { activeItem, isLinkingPanelOpen, setIsLinkingPanelOpen } = linkingController
const buttonRef = useRef<HTMLButtonElement>(null)
const toggleMenu = useCallback(async () => {

31
packages/web/src/javascripts/Components/LinkedItems/LinkedItemsPanel.tsx
View File

@@ -13,6 +13,7 @@ import DecoratedInput from '../Input/DecoratedInput'
import LinkedItemSearchResults from './LinkedItemSearchResults'
import { LinkedItemsSectionItem } from './LinkedItemsSectionItem'
import { DecryptedItem } from '@standardnotes/snjs'
import { useItemLinks } from '@/Hooks/useItemLinks'
const LinkedItemsPanel = ({
linkingController,
@@ -27,22 +28,10 @@ const LinkedItemsPanel = ({
isOpen: boolean
item: DecryptedItem
}) => {
const {
getLinkedTagsForItem,
getFilesLinksForItem,
getLinkedNotesForItem,
getNotesLinkingToItem,
linkItems,
unlinkItemFromSelectedItem,
activateItem,
createAndAddNewTag,
isEntitledToNoteLinking,
} = linkingController
const { linkItems, unlinkItems, activateItem, createAndAddNewTag, isEntitledToNoteLinking } = linkingController
const tagsLinkedToItem = getLinkedTagsForItem(item) || []
const { filesLinkedToItem, filesLinkingToItem } = getFilesLinksForItem(item)
const notesLinkedToItem = getLinkedNotesForItem(item) || []
const notesLinkingToItem = getNotesLinkingToItem(item) || []
const { notesLinkedToItem, notesLinkingToItem, filesLinkedToItem, filesLinkingToItem, tagsLinkedToItem } =
useItemLinks(item)
const { entitledToFiles } = featuresController
const application = useApplication()
@@ -128,7 +117,7 @@ const LinkedItemsPanel = ({
key={link.id}
item={link.item}
searchQuery={searchQuery}
unlinkItem={() => unlinkItemFromSelectedItem(link.item)}
unlinkItem={() => unlinkItems(item, link.item)}
activateItem={activateItem}
handleFileAction={filesController.handleFileAction}
/>
@@ -148,7 +137,7 @@ const LinkedItemsPanel = ({
key={link.id}
item={link.item}
searchQuery={searchQuery}
unlinkItem={() => unlinkItemFromSelectedItem(link.item)}
unlinkItem={() => unlinkItems(item, link.item)}
activateItem={activateItem}
handleFileAction={filesController.handleFileAction}
/>
@@ -172,7 +161,7 @@ const LinkedItemsPanel = ({
key={link.id}
item={link.item}
searchQuery={searchQuery}
unlinkItem={() => unlinkItemFromSelectedItem(link.item)}
unlinkItem={() => unlinkItems(item, link.item)}
activateItem={activateItem}
handleFileAction={filesController.handleFileAction}
/>
@@ -191,7 +180,7 @@ const LinkedItemsPanel = ({
key={link.id}
item={link.item}
searchQuery={searchQuery}
unlinkItem={() => unlinkItemFromSelectedItem(link.item)}
unlinkItem={() => unlinkItems(item, link.item)}
activateItem={activateItem}
handleFileAction={filesController.handleFileAction}
/>
@@ -208,7 +197,7 @@ const LinkedItemsPanel = ({
key={link.id}
item={link.item}
searchQuery={searchQuery}
unlinkItem={() => unlinkItemFromSelectedItem(link.item)}
unlinkItem={() => unlinkItems(item, link.item)}
activateItem={activateItem}
handleFileAction={filesController.handleFileAction}
/>
@@ -227,7 +216,7 @@ const LinkedItemsPanel = ({
key={link.id}
item={link.item}
searchQuery={searchQuery}
unlinkItem={() => unlinkItemFromSelectedItem(link.item)}
unlinkItem={() => unlinkItems(item, link.item)}
activateItem={activateItem}
handleFileAction={filesController.handleFileAction}
/>

4
packages/web/src/javascripts/Components/LinkedItems/LinkedItemsSectionItem.tsx
View File

@@ -9,7 +9,7 @@ import { FileItem } from '@standardnotes/snjs'
import { KeyboardKey } from '@standardnotes/ui-services'
import { useRef, useState } from 'react'
import { useApplication } from '../ApplicationProvider'
import { PopoverFileItemActionType } from '../AttachedFilesPopover/PopoverFileItemAction'
import { FileItemActionType } from '../AttachedFilesPopover/PopoverFileItemAction'
import Icon from '../Icon/Icon'
import MenuItem from '../Menu/MenuItem'
import Popover from '../Popover/Popover'
@@ -46,7 +46,7 @@ export const LinkedItemsSectionItem = ({
return
}
await handleFileAction({
type: PopoverFileItemActionType.RenameFile,
type: FileItemActionType.RenameFile,
payload: {
file: item,
name: name,