zoriya/Chromacase
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pretty, lint, type check

Browse Source
This commit is contained in:
danis
2023-12-01 15:22:45 +01:00
parent 7167b49edc
commit 183dee193c
5 changed files with 96 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front/API.ts
+4 -5
View File
@@ -384,7 +384,6 @@ export default class API {
}; };
} }
public static getGenres(): Query<Genre[]> { public static getGenres(): Query<Genre[]> {
return { return {
key: ['genres'], key: ['genres'],
@@ -395,7 +394,7 @@ export default class API {
}, },
{ handler: PlageHandler(GenreHandler) } { handler: PlageHandler(GenreHandler) }
).then(({ data }) => data), ).then(({ data }) => data),
} };
} }
/** /**
@@ -434,14 +433,14 @@ export default class API {
public static getArtists(): Query<Artist[]> { public static getArtists(): Query<Artist[]> {
return { return {
key: ['artists'], key: ['artists'],
exec: () => exec: () =>
API.fetch( API.fetch(
{ {
route: `/artist`, route: `/artist`,
}, },
{ handler: PlageHandler(ArtistHandler) } { handler: PlageHandler(ArtistHandler) }
).then(({ data }) => data) ).then(({ data }) => data),
} };
} }
/** /**
front/components/V2/SearchBar.tsx
+81 -69
View File
@@ -1,58 +1,48 @@
import React from "react"; import React from 'react';
import { Button, Text, Select} from 'native-base' import { Button, Text, Select } from 'native-base';
import { ScrollView, TextInput, View } from "react-native"; import { ScrollView, TextInput, View } from 'react-native';
import ButtonBase from "../UI/ButtonBase"; import ButtonBase from '../UI/ButtonBase';
import { AddSquare, CloseCircle, SearchNormal1 } from "iconsax-react-native"; import { AddSquare, CloseCircle, SearchNormal1 } from 'iconsax-react-native';
import Artist from "../../models/Artist"; import { useQuery } from '../../Queries';
import Song from "../../models/Song"; import API from '../../API';
import { useQuery } from "../../Queries"; import { LoadingView } from '../Loading';
import API from "../../API"; import Genre from '../../models/Genre';
import { useNavigation } from "../../Navigation";
import { LoadingView } from "../Loading";
import Genre from "../../models/Genre";
type ArtistChipProps = { type ArtistChipProps = {
name: string, name: string;
selected?: boolean, selected?: boolean;
onPress: () => void; onPress: () => void;
} };
const ArtistChipComponent = (props: ArtistChipProps) => { const ArtistChipComponent = (props: ArtistChipProps) => {
return ( return (
<View> <View>
<Button marginX={ props.selected ? 0 :26 } variant={"ghost"} onPress={props.onPress}> <Button marginX={props.selected ? 0 : 26} variant={'ghost'} onPress={props.onPress}>
<View <View
style={{ style={{
display: "flex", display: 'flex',
flexDirection: "row", flexDirection: 'row',
alignItems: "center", alignItems: 'center',
justifyContent: "center", justifyContent: 'center',
gap: 10, gap: 10,
}}> }}
>
{props.selected {props.selected ? (
? <CloseCircle size="32" color={"#ED4A51"} /> <CloseCircle size="32" color={'#ED4A51'} />
: <AddSquare size="32" color={"#6075F9"} /> } ) : (
<AddSquare size="32" color={'#6075F9'} />
)}
<Text>{props.name}</Text> <Text>{props.name}</Text>
</View> </View>
</Button> </Button>
</View> </View>
) );
}
type SearchBarComponentProps = {
query: string;
}; };
const SearchBarComponent = (props: SearchBarComponentProps) => { const SearchBarComponent = () => {
const navigation = useNavigation();
const [isTriggered, setIsTriggered] = React.useState(false);
const [query, setQuery] = React.useState(''); const [query, setQuery] = React.useState('');
const [genre, setGenre] = React.useState({} as Genre | undefined); const [genre, setGenre] = React.useState({} as Genre | undefined);
const [artist, setArtist] = React.useState(''); const [artist, setArtist] = React.useState('');
const [artistSearch, setArtistSearch] = React.useState([] as Artist[]);
const [songSearch, setSongSearch] = React.useState([] as Song[]);
const artistsQuery = useQuery(API.getArtists()); const artistsQuery = useQuery(API.getArtists());
const genresQuery = useQuery(API.getGenres()); const genresQuery = useQuery(API.getGenres());
@@ -62,51 +52,73 @@ const SearchBarComponent = (props: SearchBarComponentProps) => {
return ( return (
<View> <View>
<View style={{ <View
borderBottomWidth: 1, style={{
borderBottomColor: '#9E9E9E', borderBottomWidth: 1,
display: "flex", borderBottomColor: '#9E9E9E',
flexDirection: "row", display: 'flex',
alignItems: "center", flexDirection: 'row',
margin: 5, alignItems: 'center',
padding: 16 }}> margin: 5,
{artist ? padding: 16,
<ArtistChipComponent onPress={() => setArtist('')} name={artist} selected={true} /> : null} }}
<TextInput value={query} >
{artist ? (
<ArtistChipComponent
onPress={() => setArtist('')}
name={artist}
selected={true}
/>
) : null}
<TextInput
value={query}
placeholder="What are you looking for ?" placeholder="What are you looking for ?"
style={{ width: '100%', height: 30}} /> style={{ width: '100%', height: 30 }}
onChangeText={(value) => setQuery(value)}
/>
<ButtonBase type="menu" icon={SearchNormal1} /> <ButtonBase type="menu" icon={SearchNormal1} />
</View> </View>
<View style={{ display: 'flex', flexDirection: "row", justifyContent: "space-between" }}> <View
<ScrollView horizontal={true} style={{ display: 'flex', flexDirection: "row", paddingVertical: 10}}> style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}
{!artist ? artistsQuery.data?.map((artist, index) => ( >
<ScrollView
<ArtistChipComponent key={index} horizontal={true}
name={artist.name} style={{ display: 'flex', flexDirection: 'row', paddingVertical: 10 }}
onPress={() => { >
setArtist(artist.name) {!artist
}} ? artistsQuery.data?.map((artist, index) => (
/> <ArtistChipComponent
key={index}
)) : null} name={artist.name}
onPress={() => {
setArtist(artist.name);
}}
/>
))
: null}
</ScrollView> </ScrollView>
<View> <View>
<Select selectedValue={genre?.name} <Select
selectedValue={genre?.name}
placeholder="Genre" placeholder="Genre"
accessibilityLabel="Genre" accessibilityLabel="Genre"
onValueChange={itemValue => { onValueChange={(itemValue) => {
setGenre(genresQuery.data?.find((genre) => { genre.name == itemValue })) setGenre(
}} genresQuery.data?.find((genre) => {
genre.name == itemValue;
})
);
}}
> >
{genresQuery.data?.map((data, index) => ( {genresQuery.data?.map((data, index) => (
<Select.Item key={index} label={data.name} value={data.name}/> <Select.Item key={index} label={data.name} value={data.name} />
))} ))}
</Select> </Select>
</View> </View>
</View> </View>
</View> </View>
) );
} };
export default SearchBarComponent; export default SearchBarComponent;
front/views/HomeView.tsx
+2 -4
View File
@@ -110,7 +110,7 @@ const HomeView = (props: RouteProps<{}>) => {
translate={{ translationKey: 'searchBtn' }} translate={{ translationKey: 'searchBtn' }}
colorScheme="secondary" colorScheme="secondary"
size="sm" size="sm"
onPress={() => navigation.navigate('Search', {})} onPress={() => navigation.navigate('Search')}
/> />
<TextButton <TextButton
translate={{ translationKey: 'settingsBtn' }} translate={{ translationKey: 'settingsBtn' }}
@@ -161,9 +161,7 @@ const HomeView = (props: RouteProps<{}>) => {
size="xs" size="xs"
colorScheme="primary" colorScheme="primary"
label={query} label={query}
onPress={() => onPress={() => navigation.navigate('Search')}
navigation.navigate('Search', { query: query })
}
/> />
))} ))}
</Flex> </Flex>
front/views/SearchView.tsx
+1 -2
View File
@@ -1,13 +1,12 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import SearchBar from '../components/SearchBar'; import SearchBar from '../components/SearchBar';
import SearchBarComponent from '../components/V2/SearchBar'
import Artist from '../models/Artist'; import Artist from '../models/Artist';
import Song from '../models/Song'; import Song from '../models/Song';
import Genre from '../models/Genre'; import Genre from '../models/Genre';
import API from '../API'; import API from '../API';
import { useQuery } from '../Queries'; import { useQuery } from '../Queries';
import { SearchResultComponent } from '../components/SearchResult'; import { SearchResultComponent } from '../components/SearchResult';
import { SafeAreaView, View } from 'react-native'; import { SafeAreaView } from 'react-native';
import { Filter } from '../components/SearchBar'; import { Filter } from '../components/SearchBar';
import { ScrollView } from 'native-base'; import { ScrollView } from 'native-base';
import { RouteProps } from '../Navigation'; import { RouteProps } from '../Navigation';
front/views/V2/SearchView.tsx
+8 -12
View File
@@ -1,21 +1,17 @@
import React from "react"; import React from 'react';
import { View } from "react-native"; import { View } from 'react-native';
import SearchBarComponent from "../../components/V2/SearchBar"; import SearchBarComponent from '../../components/V2/SearchBar';
// search with all parameters from search bar function // search with all parameters from search bar function
// return to search bar auto completion thing // return to search bar auto completion thing
export class SearchQueryObject {
}
const SearchView = () => { const SearchView = () => {
return ( return (
<View style={{ display: 'flex', flexDirection: 'column', padding: 3 }} > <View style={{ display: 'flex', flexDirection: 'column', padding: 3 }}>
<SearchBarComponent query={"undefined"} /> <SearchBarComponent />
</View> </View>
) );
} };
export default SearchView; export default SearchView;