Language select final tweaks (#8914)
* [APP-1303] Redesign/refactor post language select (#8884) * Nightly source-language update * Nightly source-language update * [APP-1303] Redesign/refactor post language select * update: stylesheets.create to use the latest structure * update styles to modern structure * update: dialog breakpoints on web and delete depricated language modals * remove unused post languages settings dialog * restructure Post languages dialog * place the Dialog.Close inside the Dialog.ScrollableInner * add: language search * update search and language variables for clarity * fix: memoize language state lists * chore: add comments * update proper colors to the background * add back older error boundary * add: tweaks to the mobile and web responsiveness * add tweaks to center the container * update labels * update button and border * added translation updates * Update: text input to reuse search input * remove unused file * update: web breakpoints * run eslint and prettier --------- Co-authored-by: Elijah Seed-Arita <elijaharita@gmail.com> Co-authored-by: Anastasiya Uraleva <anastasiya@Anastasiyas-MacBook-Pro.local> Co-authored-by: Anastasiya Uraleva <anastasiya@Mac.localdomain> * rm old file * sort out styles, add FlatListFooter component * rm cancel button in favor of search input X * get dialog height working on iOS * delete `DropdownButton` * hide scroll indicators on android * ios scroll indicator insets * get footer sorta working on android * change button color on press * rm empty file --------- Co-authored-by: Anastasiya Uraleva <anastasiyauraleva@gmail.com> Co-authored-by: Elijah Seed-Arita <elijaharita@gmail.com> Co-authored-by: Anastasiya Uraleva <anastasiya@Anastasiyas-MacBook-Pro.local> Co-authored-by: Anastasiya Uraleva <anastasiya@Mac.localdomain>
This commit is contained in:
@@ -4,17 +4,16 @@ import {msg} from '@lingui/macro'
|
||||
import {useLingui} from '@lingui/react'
|
||||
|
||||
import {usePalette} from '#/lib/hooks/usePalette'
|
||||
import {CommonNavigatorParams, NativeStackScreenProps} from '#/lib/routes/types'
|
||||
import {
|
||||
type CommonNavigatorParams,
|
||||
type NativeStackScreenProps,
|
||||
} from '#/lib/routes/types'
|
||||
import {s} from '#/lib/styles'
|
||||
import {PaletteColorName, ThemeProvider} from '#/lib/ThemeContext'
|
||||
import {type PaletteColorName, ThemeProvider} from '#/lib/ThemeContext'
|
||||
import {EmptyState} from '#/view/com/util/EmptyState'
|
||||
import {ErrorMessage} from '#/view/com/util/error/ErrorMessage'
|
||||
import {ErrorScreen} from '#/view/com/util/error/ErrorScreen'
|
||||
import {Button} from '#/view/com/util/forms/Button'
|
||||
import {
|
||||
DropdownButton,
|
||||
DropdownItem,
|
||||
} from '#/view/com/util/forms/DropdownButton'
|
||||
import {ToggleButton} from '#/view/com/util/forms/ToggleButton'
|
||||
import * as LoadingPlaceholder from '#/view/com/util/LoadingPlaceholder'
|
||||
import {Text} from '#/view/com/util/text/Text'
|
||||
@@ -134,8 +133,6 @@ function ControlsView() {
|
||||
<ScrollView style={[s.pl10, s.pr10]}>
|
||||
<Heading label="Buttons" />
|
||||
<ButtonsView />
|
||||
<Heading label="Dropdown Buttons" />
|
||||
<DropdownButtonsView />
|
||||
<Heading label="Toggle Buttons" />
|
||||
<ToggleButtonsView />
|
||||
<View style={s.footerSpacer} />
|
||||
@@ -396,44 +393,6 @@ function ButtonsView() {
|
||||
)
|
||||
}
|
||||
|
||||
const DROPDOWN_ITEMS: DropdownItem[] = [
|
||||
{
|
||||
icon: ['far', 'paste'],
|
||||
label: 'Copy post text',
|
||||
onPress() {},
|
||||
},
|
||||
{
|
||||
icon: 'share',
|
||||
label: 'Share...',
|
||||
onPress() {},
|
||||
},
|
||||
{
|
||||
icon: 'circle-exclamation',
|
||||
label: 'Report post',
|
||||
onPress() {},
|
||||
},
|
||||
]
|
||||
function DropdownButtonsView() {
|
||||
const defaultPal = usePalette('default')
|
||||
return (
|
||||
<View style={[defaultPal.view]}>
|
||||
<View style={s.mb5}>
|
||||
<DropdownButton
|
||||
type="primary"
|
||||
items={DROPDOWN_ITEMS}
|
||||
menuWidth={200}
|
||||
label="Primary button"
|
||||
/>
|
||||
</View>
|
||||
<View style={s.mb5}>
|
||||
<DropdownButton type="bare" items={DROPDOWN_ITEMS} menuWidth={200}>
|
||||
<Text>Bare</Text>
|
||||
</DropdownButton>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
function ToggleButtonsView() {
|
||||
const defaultPal = usePalette('default')
|
||||
const buttonStyles = s.mb5
|
||||
|
||||
Reference in New Issue
Block a user