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

9
front/API.ts
View File

@@ -384,7 +384,6 @@ export default class API {
};
}
public static getGenres(): Query<Genre[]> {
return {
key: ['genres'],
@@ -395,7 +394,7 @@ export default class API {
},
{ handler: PlageHandler(GenreHandler) }
).then(({ data }) => data),
}
};
}
/**
@@ -434,14 +433,14 @@ export default class API {
public static getArtists(): Query<Artist[]> {
return {
key: ['artists'],
exec: () =>
exec: () =>
API.fetch(
{
route: `/artist`,
},
{ handler: PlageHandler(ArtistHandler) }
).then(({ data }) => data)
}
).then(({ data }) => data),
};
}
/**

150
front/components/V2/SearchBar.tsx
View File

@@ -1,58 +1,48 @@
import React from "react";
import { Button, Text, Select} from 'native-base'
import { ScrollView, TextInput, View } from "react-native";
import ButtonBase from "../UI/ButtonBase";
import { AddSquare, CloseCircle, SearchNormal1 } from "iconsax-react-native";
import Artist from "../../models/Artist";
import Song from "../../models/Song";
import { useQuery } from "../../Queries";
import API from "../../API";
import { useNavigation } from "../../Navigation";
import { LoadingView } from "../Loading";
import Genre from "../../models/Genre";
import React from 'react';
import { Button, Text, Select } from 'native-base';
import { ScrollView, TextInput, View } from 'react-native';
import ButtonBase from '../UI/ButtonBase';
import { AddSquare, CloseCircle, SearchNormal1 } from 'iconsax-react-native';
import { useQuery } from '../../Queries';
import API from '../../API';
import { LoadingView } from '../Loading';
import Genre from '../../models/Genre';
type ArtistChipProps = {
name: string,
selected?: boolean,
name: string;
selected?: boolean;
onPress: () => void;
}
};
const ArtistChipComponent = (props: ArtistChipProps) => {
return (
<View>
<Button marginX={ props.selected ? 0 :26 } variant={"ghost"} onPress={props.onPress}>
<Button marginX={props.selected ? 0 : 26} variant={'ghost'} onPress={props.onPress}>
<View
style={{
display: "flex",
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
gap: 10,
}}>
{props.selected
? <CloseCircle size="32" color={"#ED4A51"} />
: <AddSquare size="32" color={"#6075F9"} /> }
}}
>
{props.selected ? (
<CloseCircle size="32" color={'#ED4A51'} />
) : (
<AddSquare size="32" color={'#6075F9'} />
)}
<Text>{props.name}</Text>
</View>
</Button>
</View>
)
}
type SearchBarComponentProps = {
query: string;
);
};
const SearchBarComponent = (props: SearchBarComponentProps) => {
const navigation = useNavigation();
const [isTriggered, setIsTriggered] = React.useState(false);
const SearchBarComponent = () => {
const [query, setQuery] = React.useState('');
const [genre, setGenre] = React.useState({} as Genre | undefined);
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 genresQuery = useQuery(API.getGenres());
@@ -62,51 +52,73 @@ const SearchBarComponent = (props: SearchBarComponentProps) => {
return (
<View>
<View style={{
borderBottomWidth: 1,
borderBottomColor: '#9E9E9E',
display: "flex",
flexDirection: "row",
alignItems: "center",
margin: 5,
padding: 16 }}>
{artist ?
<ArtistChipComponent onPress={() => setArtist('')} name={artist} selected={true} /> : null}
<TextInput value={query}
<View
style={{
borderBottomWidth: 1,
borderBottomColor: '#9E9E9E',
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
margin: 5,
padding: 16,
}}
>
{artist ? (
<ArtistChipComponent
onPress={() => setArtist('')}
name={artist}
selected={true}
/>
) : null}
<TextInput
value={query}
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} />
</View>
<View style={{ display: 'flex', flexDirection: "row", justifyContent: "space-between" }}>
<ScrollView horizontal={true} style={{ display: 'flex', flexDirection: "row", paddingVertical: 10}}>
{!artist ? artistsQuery.data?.map((artist, index) => (
<ArtistChipComponent key={index}
name={artist.name}
onPress={() => {
setArtist(artist.name)
}}
/>
)) : null}
<View
style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}
>
<ScrollView
horizontal={true}
style={{ display: 'flex', flexDirection: 'row', paddingVertical: 10 }}
>
{!artist
? artistsQuery.data?.map((artist, index) => (
<ArtistChipComponent
key={index}
name={artist.name}
onPress={() => {
setArtist(artist.name);
}}
/>
))
: null}
</ScrollView>
<View>
<Select selectedValue={genre?.name}
<Select
selectedValue={genre?.name}
placeholder="Genre"
accessibilityLabel="Genre"
onValueChange={itemValue => {
setGenre(genresQuery.data?.find((genre) => { genre.name == itemValue }))
}}
onValueChange={(itemValue) => {
setGenre(
genresQuery.data?.find((genre) => {
genre.name == itemValue;
})
);
}}
>
{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>
</View>
</View>
</View>
)
}
);
};
export default SearchBarComponent;
export default SearchBarComponent;

6
front/views/HomeView.tsx
View File

@@ -110,7 +110,7 @@ const HomeView = (props: RouteProps<{}>) => {
translate={{ translationKey: 'searchBtn' }}
colorScheme="secondary"
size="sm"
onPress={() => navigation.navigate('Search', {})}
onPress={() => navigation.navigate('Search')}
/>
<TextButton
translate={{ translationKey: 'settingsBtn' }}
@@ -161,9 +161,7 @@ const HomeView = (props: RouteProps<{}>) => {
size="xs"
colorScheme="primary"
label={query}
onPress={() =>
navigation.navigate('Search', { query: query })
}
onPress={() => navigation.navigate('Search')}
/>
))}
</Flex>

3
front/views/SearchView.tsx
View File

@@ -1,13 +1,12 @@
import React, { useState } from 'react';
import SearchBar from '../components/SearchBar';
import SearchBarComponent from '../components/V2/SearchBar'
import Artist from '../models/Artist';
import Song from '../models/Song';
import Genre from '../models/Genre';
import API from '../API';
import { useQuery } from '../Queries';
import { SearchResultComponent } from '../components/SearchResult';
import { SafeAreaView, View } from 'react-native';
import { SafeAreaView } from 'react-native';
import { Filter } from '../components/SearchBar';
import { ScrollView } from 'native-base';
import { RouteProps } from '../Navigation';

20
front/views/V2/SearchView.tsx
View File

@@ -1,21 +1,17 @@
import React from "react";
import { View } from "react-native";
import SearchBarComponent from "../../components/V2/SearchBar";
import React from 'react';
import { View } from 'react-native';
import SearchBarComponent from '../../components/V2/SearchBar';
// search with all parameters from search bar function
// return to search bar auto completion thing
export class SearchQueryObject {
}
const SearchView = () => {
return (
<View style={{ display: 'flex', flexDirection: 'column', padding: 3 }} >
<SearchBarComponent query={"undefined"} />
<View style={{ display: 'flex', flexDirection: 'column', padding: 3 }}>
<SearchBarComponent />
</View>
)
}
);
};
export default SearchView;
export default SearchView;