Skip to content

Commit 21e6d00

Browse files
committed
Fix viewAs function + Update Splash Screen
1 parent 62bbda1 commit 21e6d00

File tree

12 files changed

+363
-361
lines changed

12 files changed

+363
-361
lines changed
7.71 KB
Loading
7.71 KB
Loading
7.71 KB
Loading
7.71 KB
Loading
7.71 KB
Loading

app/index.tsx

Lines changed: 95 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -56,13 +56,20 @@ export default function HomePage() {
5656

5757
const getListData = async () => {
5858
const item = await AsyncStorage.getItem('listData')
59-
return item != null ? setCardData(JSON.parse(item)) : null;
59+
return item != null ? setCardData(JSON.parse(item)) : setCardData(fileList);
6060
}
6161

6262
useEffect(() => {
6363
getListData()
6464
}, [])
6565

66+
const handleSearchInputChange = (text) => {
67+
setSearchInput(text)
68+
}
69+
const filteredCards = cardData?.filter((card) =>
70+
card.title.toLowerCase().includes(searchInput.toLowerCase())
71+
)
72+
6673
const storeLayout = async (value: string) => {
6774
try {
6875
await AsyncStorage.setItem('viewAs', value)
@@ -75,12 +82,22 @@ export default function HomePage() {
7582
const storeOrder = async (value: string) => {
7683
try {
7784
await AsyncStorage.setItem('order', value)
78-
setCardData(currentData => ({ ...currentData, order: value }))
85+
// setCardData(currentData => ({ ...currentData, order: value }))
7986
} catch (e) {
8087
console.error(e)
8188
}
8289
}
8390

91+
const handleValueChange = (value: string) => {
92+
// storeLayout(value)
93+
setViewState(value)
94+
}
95+
96+
const handleOrderChange = (value: string) => {
97+
storeOrder(value)
98+
setOrder(value)
99+
}
100+
84101
const removeData = async () => {
85102
try {
86103
const deleteList = await FileSystem.readDirectoryAsync(`${FileSystem.documentDirectory}`)
@@ -104,23 +121,6 @@ export default function HomePage() {
104121
}
105122
}
106123

107-
const handleSearchInputChange = (text) => {
108-
setSearchInput(text)
109-
}
110-
const filteredCards = cardData.filter((card) =>
111-
card.title.toLowerCase().includes(searchInput.toLowerCase())
112-
)
113-
114-
const handleValueChange = (value: string) => {
115-
storeLayout(value)
116-
setViewState(value)
117-
}
118-
119-
const handleOrderChange = (value: string) => {
120-
storeOrder(value)
121-
setOrder(value)
122-
}
123-
124124
const onRefresh = React.useCallback(() => {
125125
setRefreshing(true)
126126
getListData()
@@ -186,80 +186,82 @@ export default function HomePage() {
186186
exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}
187187
gap="$4"
188188
>
189-
<Dialog.Title>Settings</Dialog.Title>
190-
<Dialog.Description>
191-
Adjust your preferences. Click anywhere outside when you're done.
192-
</Dialog.Description>
193-
194-
<YGroup alignSelf="center" bordered width="100%" size="$4">
195-
<YGroup.Item>
196-
<ListItem onPress={() => { removeData() }} hoverTheme pressTheme icon={Delete} iconAfter={ChevronRight} title="Clear Data" subTitle={`This will clear all the documents from the 'app data'.`} />
197-
</YGroup.Item>
198-
</YGroup>
199-
<H6>View Options</H6>
200-
<YGroup alignSelf="center" bordered width="100%" size="$4">
201-
<YGroup.Item>
202-
<ListItem
203-
hoverTheme
204-
pressTheme
205-
title="View As"
206-
iconAfter={
207-
<ToggleGroup
208-
orientation="horizontal"
209-
size="$2"
210-
type="single"
211-
// disableDeactivation={true}
212-
onValueChange={filteredCards.length !== 0 ? (value) => handleValueChange(value) : undefined}
213-
value={viewState}
214-
// disabled={filteredCards.length === 0}
215-
>
216-
<ToggleGroup.Item value="grid" aria-label="View as grid">
217-
<LayoutGrid />
218-
</ToggleGroup.Item>
219-
<ToggleGroup.Item value="list" aria-label="View as list">
220-
<IconList />
221-
</ToggleGroup.Item>
222-
</ToggleGroup>
223-
}
224-
/>
225-
</YGroup.Item>
226-
<YGroup.Item>
227-
<ListItem
228-
hoverTheme
229-
pressTheme
230-
title="Order As"
231-
subTitle="Ascending (Old First) / Descending (New First)"
232-
iconAfter={
233-
<ToggleGroup
234-
orientation="horizontal"
235-
size="$2"
236-
type="single"
237-
// disableDeactivation={true}
238-
onValueChange={() => handleOrderChange}
239-
value={order}
240-
// disabled={filteredCards.length === 0}
241-
>
242-
<ToggleGroup.Item value="ascending" aria-label="Ascending">
243-
<AArrowUp />
244-
</ToggleGroup.Item>
245-
<ToggleGroup.Item value="descending" aria-label="Descending">
246-
<AArrowDown />
247-
</ToggleGroup.Item>
248-
</ToggleGroup>
249-
}
250-
/>
251-
</YGroup.Item>
252-
{/* <ListItem onPress={() => { removeData() }} hoverTheme pressTheme iconAfter={<Switch size="$3" defaultChecked onCheckedChange={handleCheck(isChecked)} value={isChecked}><Switch.Thumb animation="quicker" /></Switch>} title="Show All Filename Extensions" /> */}
253-
</YGroup>
254-
<Separator />
255-
<XStack alignSelf='center' paddingTop="$5">
256-
<Image style={{ borderRadius: 15 }} source={require('../assets/images/adaptive-icon.png')} width={128} height={128} scale />
257-
<YStack alignSelf='center'>
258-
<H6 paddingLeft="$4">Tech Fiddle</H6>
259-
<H1 paddingLeft="$4">DocExt</H1>
260-
<H6 paddingLeft="$4">{AppVersion()}</H6>
261-
</YStack>
262-
</XStack>
189+
<ScrollView>
190+
<Dialog.Title>Settings</Dialog.Title>
191+
<Dialog.Description>
192+
Adjust your preferences. Click anywhere outside when you're done.
193+
</Dialog.Description>
194+
195+
<YGroup alignSelf="center" bordered width="100%" size="$4">
196+
<YGroup.Item>
197+
<ListItem onPress={() => { removeData() }} hoverTheme pressTheme icon={Delete} iconAfter={ChevronRight} title="Clear Data" subTitle={`This will clear all the documents from the 'app data'.`} />
198+
</YGroup.Item>
199+
</YGroup>
200+
<H6>View Options</H6>
201+
<YGroup alignSelf="center" bordered width="100%" size="$4">
202+
<YGroup.Item>
203+
<ListItem
204+
hoverTheme
205+
pressTheme
206+
title="View As"
207+
iconAfter={
208+
<ToggleGroup
209+
orientation="horizontal"
210+
size="$2"
211+
type="single"
212+
// disableDeactivation={true}
213+
onValueChange={handleValueChange}
214+
value={viewState}
215+
// disabled={filteredCards.length === 0}
216+
>
217+
<ToggleGroup.Item value="grid" aria-label="View as grid">
218+
<LayoutGrid />
219+
</ToggleGroup.Item>
220+
<ToggleGroup.Item value="list" aria-label="View as list">
221+
<IconList />
222+
</ToggleGroup.Item>
223+
</ToggleGroup>
224+
}
225+
/>
226+
</YGroup.Item>
227+
<YGroup.Item>
228+
<ListItem
229+
hoverTheme
230+
pressTheme
231+
title="Order As"
232+
subTitle="Ascending (Old First) / Descending (New First)"
233+
iconAfter={
234+
<ToggleGroup
235+
orientation="horizontal"
236+
size="$2"
237+
type="single"
238+
// disableDeactivation={true}
239+
onValueChange={() => handleOrderChange}
240+
value={order}
241+
// disabled={filteredCards.length === 0}
242+
>
243+
<ToggleGroup.Item value="ascending" aria-label="Ascending">
244+
<AArrowUp />
245+
</ToggleGroup.Item>
246+
<ToggleGroup.Item value="descending" aria-label="Descending">
247+
<AArrowDown />
248+
</ToggleGroup.Item>
249+
</ToggleGroup>
250+
}
251+
/>
252+
</YGroup.Item>
253+
{/* <ListItem onPress={() => { removeData() }} hoverTheme pressTheme iconAfter={<Switch size="$3" defaultChecked onCheckedChange={handleCheck(isChecked)} value={isChecked}><Switch.Thumb animation="quicker" /></Switch>} title="Show All Filename Extensions" /> */}
254+
</YGroup>
255+
<Separator />
256+
<XStack alignSelf='center' paddingTop="$5">
257+
<Image style={{ borderRadius: 15 }} source={require('../assets/images/adaptive-icon.png')} width={128} height={128} scale />
258+
<YStack alignSelf='center'>
259+
<H6 paddingLeft="$4">Tech Fiddle</H6>
260+
<H1 paddingLeft="$4">DocExt</H1>
261+
<H6 paddingLeft="$4">{AppVersion()}</H6>
262+
</YStack>
263+
</XStack>
264+
</ScrollView>
263265

264266
{/* <XStack alignSelf="flex-end" gap="$4">
265267
<Dialog.Close displayWhenAdapted asChild>

assets/images/splash.png

4.29 KB
Loading

assets/images/splash1.png

-180 KB
Binary file not shown.

assets/images/splash2.png

176 KB
Loading

0 commit comments

Comments
 (0)