prehistoric-systems/omnivore
1
0
Fork 0
mirror of https://github.com/omnivore-app/omnivore.git synced 2026-03-11 08:54:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #2822 from Podginator/bug-fix/fix-editing-mobile

Browse source 
[Bug-Fix] Fix Editing Saved-Searches on Mobile View
This commit is contained in:
Jackson Harper 2023-10-04 12:47:17 +08:00 committed by GitHub
commit 102fffc239
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 35 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

79
packages/web/pages/settings/saved-searches.tsx
View file

@ -156,11 +156,14 @@ export default function SavedSearchesPage(): JSX.Element {
const [editingId, setEditingId] = useState<string | null>(null)
const [isCreateMode, setIsCreateMode] = useState<boolean>(false)
const [windowWidth, setWindowWidth] = useState<number>(0)
const [confirmRemoveSavedSearchId, setConfirmRemoveSavedSearchId] =
useState<string | null>(null)
const [confirmRemoveSavedSearchId, setConfirmRemoveSavedSearchId] = useState<
string | null
>(null)
const [draggedElementId, setDraggedElementId] = useState<string | null>(null)
const [draggedElementPosition, setDraggedElementPosition] =
useState<{ x: number; y: number } | null>(null)
const [draggedElementPosition, setDraggedElementPosition] = useState<{
x: number
y: number
} | null>(null)
const [sortedSavedSearch, setSortedSavedSearch] = useState<SavedSearch[]>([])
// Some theming stuff here.
@ -584,14 +587,14 @@ function GenericTableCard(
<ActionsWrapper>
<Dropdown
disabled={isCreateMode}
triggerElement={<DotsThree size={24} color={iconColor} />}
triggerElement={<DotsThree size={'100%'} color={iconColor} />}
>
<DropdownOption onSelect={() => null}>
<Button
style="plainIcon"
css={{
mr: '0px',
display: 'flex',
display: isCreateMode ? 'none' : 'flex',
alignItems: 'center',
backgroundColor: 'transparent',
border: 0,
@ -714,7 +717,7 @@ function GenericTableCard(
display: 'grid',
width: '100%',
gridGap: '$1',
gridTemplateColumns: '4% 3% 80% 1fr 1fr 1fr 1fr',
gridTemplateColumns: '1fr 1fr 17fr 2fr',
height: editingId == savedSearch?.id ? '120px' : '56px',
'.showHidden': {
display: 'none',
@ -833,48 +836,35 @@ function GenericTableCard(
)}
</HStack>
<HStack
distribution="start"
css={{
padding: '4px 8px',
paddingLeft: '10px',
alignItems: 'center',
}}
>
{!showInput && (
<Box css={{ marginLeft: 'auto', '@md': { display: 'none' } }}>
{moreActionsButton()}
</Box>
)}
</HStack>
<HStack
distribution="start"
alignment="center"
css={{
ml: '8px',
display: 'flex',
'@md': {
display: 'none',
},
}}
>
{showInput && (
<Input
type="text"
placeholder="The search query to execute (e.g. in:inbox)"
value={queryInputText}
onChange={(event) => setQueryInputText(event.target.value)}
autoFocus={!!savedSearch}
/>
)}
</HStack>
{!savedSearch?.defaultFilter && (
<HStack
distribution="start"
css={{
padding: '4px 8px',
paddingLeft: '10px',
alignItems: 'center',
}}
>
{!showInput && (
<Box css={{ marginLeft: 'auto', '@md': { display: 'none' } }}>
{moreActionsButton()}
</Box>
)}
</HStack>
)}
<HStack
distribution="end"
alignment="center"
css={{
padding: '0px 8px',
display: 'flex',
'@sm': {
display: 'none',
},
'@md': {
display: 'flex',
},
}}
>
{editingId === savedSearch?.id || !savedSearch ? (
@ -952,13 +942,14 @@ function MobileEditCard(props: EditCardProps) {
queryInputText,
setQueryInputText,
createSavedSearch,
updateSavedSearch,
resetState,
isFirstChild,
isLastChild,
} = props
const handleEdit = () => {
editingId && setEditingId(editingId)
editingId && updateSavedSearch(editingId)
setEditingId(null)
}