mirror of
https://github.com/movie-web/native-app.git
synced 2025-09-13 05:43:24 +00:00
chore: run prettier
This commit is contained in:
@@ -19,7 +19,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@expo/metro-config": "^0.17.3",
|
||||
"@movie-web/tmdb": "*",
|
||||
"@movie-web/tmdb": "*",
|
||||
"class-variance-authority": "^0.7.0",
|
||||
"clsx": "^2.1.0",
|
||||
"expo": "~50.0.5",
|
||||
|
@@ -5,7 +5,11 @@ import { FontAwesome5 } from "@expo/vector-icons";
|
||||
|
||||
import Colors from "@movie-web/tailwind-config/colors";
|
||||
|
||||
export default function Searchbar({ onSearchChange }: { onSearchChange: (text: string) => void }) {
|
||||
export default function Searchbar({
|
||||
onSearchChange,
|
||||
}: {
|
||||
onSearchChange: (text: string) => void;
|
||||
}) {
|
||||
const [keyword, setKeyword] = useState("");
|
||||
const inputRef = useRef<TextInput>(null);
|
||||
|
||||
@@ -34,7 +38,7 @@ export default function Searchbar({ onSearchChange }: { onSearchChange: (text: s
|
||||
</View>
|
||||
<TextInput
|
||||
value={keyword}
|
||||
onChangeText={handleChange}
|
||||
onChangeText={handleChange}
|
||||
ref={inputRef}
|
||||
placeholder="What are you looking for?"
|
||||
placeholderTextColor={Colors.secondary[200]}
|
||||
|
@@ -1,23 +1,26 @@
|
||||
import React, { useState } from 'react';
|
||||
import { ScrollView, View } from 'react-native';
|
||||
import React, { useState } from "react";
|
||||
import { ScrollView, View } from "react-native";
|
||||
|
||||
import Item from '~/components/item/item';
|
||||
import { getMediaPoster, searchTitle } from "@movie-web/tmdb";
|
||||
|
||||
import Item from "~/components/item/item";
|
||||
import ScreenLayout from "~/components/layout/ScreenLayout";
|
||||
import { Text } from "~/components/ui/Text";
|
||||
import ScreenLayout from '~/components/layout/ScreenLayout';
|
||||
import Searchbar from './Searchbar';
|
||||
import { searchTitle, getMediaPoster } from '@movie-web/tmdb';
|
||||
import Searchbar from "./Searchbar";
|
||||
|
||||
export default function SearchScreen() {
|
||||
const [searchResults, setSearchResults] = useState<{ title: string; posterUrl: string; year: number; type: "movie" | "tv"; }[]>([]);
|
||||
const [searchResults, setSearchResults] = useState<
|
||||
{ title: string; posterUrl: string; year: number; type: "movie" | "tv" }[]
|
||||
>([]);
|
||||
|
||||
const handleSearchChange = async (query: string) => {
|
||||
if (query.length > 0) {
|
||||
const results = await fetchSearchResults(query);
|
||||
setSearchResults(results);
|
||||
} else {
|
||||
setSearchResults([]);
|
||||
}
|
||||
};
|
||||
const handleSearchChange = async (query: string) => {
|
||||
if (query.length > 0) {
|
||||
const results = await fetchSearchResults(query);
|
||||
setSearchResults(results);
|
||||
} else {
|
||||
setSearchResults([]);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ScrollView>
|
||||
@@ -42,30 +45,43 @@ const handleSearchChange = async (query: string) => {
|
||||
);
|
||||
}
|
||||
|
||||
async function fetchSearchResults(query: string): Promise<{ title: string; posterUrl: string; year: number; type: "movie" | "tv"; }[]> {
|
||||
console.log('Fetching results for:', query);
|
||||
const results = await searchTitle(query);
|
||||
|
||||
return results.map((result) => {
|
||||
switch (result.media_type) {
|
||||
case 'movie':
|
||||
return {
|
||||
title: result.title,
|
||||
posterUrl: getMediaPoster(result.poster_path),
|
||||
year: new Date(result.release_date).getFullYear(),
|
||||
type: result.media_type as "movie",
|
||||
};
|
||||
case 'tv':
|
||||
return {
|
||||
title: result.name,
|
||||
posterUrl: getMediaPoster(result.poster_path),
|
||||
year: new Date(result.first_air_date).getFullYear(),
|
||||
type: result.media_type as "tv",
|
||||
};
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}).filter((item): item is { title: string; posterUrl: string; year: number; type: "movie" | "tv"; } => item !== undefined);
|
||||
}
|
||||
|
||||
|
||||
async function fetchSearchResults(
|
||||
query: string,
|
||||
): Promise<
|
||||
{ title: string; posterUrl: string; year: number; type: "movie" | "tv" }[]
|
||||
> {
|
||||
console.log("Fetching results for:", query);
|
||||
const results = await searchTitle(query);
|
||||
|
||||
return results
|
||||
.map((result) => {
|
||||
switch (result.media_type) {
|
||||
case "movie":
|
||||
return {
|
||||
title: result.title,
|
||||
posterUrl: getMediaPoster(result.poster_path),
|
||||
year: new Date(result.release_date).getFullYear(),
|
||||
type: result.media_type as "movie",
|
||||
};
|
||||
case "tv":
|
||||
return {
|
||||
title: result.name,
|
||||
posterUrl: getMediaPoster(result.poster_path),
|
||||
year: new Date(result.first_air_date).getFullYear(),
|
||||
type: result.media_type as "tv",
|
||||
};
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
})
|
||||
.filter(
|
||||
(
|
||||
item,
|
||||
): item is {
|
||||
title: string;
|
||||
posterUrl: string;
|
||||
year: number;
|
||||
type: "movie" | "tv";
|
||||
} => item !== undefined,
|
||||
);
|
||||
}
|
||||
|
@@ -1,7 +1,12 @@
|
||||
import { Image, View } from "react-native";
|
||||
|
||||
import { Text } from "~/components/ui/Text";
|
||||
|
||||
export default function Item({ data }: { data: { title: string, type: string, year: number, posterUrl: string } }) {
|
||||
export default function Item({
|
||||
data,
|
||||
}: {
|
||||
data: { title: string; type: string; year: number; posterUrl: string };
|
||||
}) {
|
||||
const { title, type, year, posterUrl } = data;
|
||||
|
||||
return (
|
||||
|
Reference in New Issue
Block a user