Skip to content

Sycing RN fetching and rendering #908

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Apr 11, 2025
Merged

Sycing RN fetching and rendering #908

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
cb28c3d
Sycing RN fetching and rendering
DanDaManTran Apr 8, 2025
345d143
prettier fix
DanDaManTran Apr 8, 2025
d515e80
updating react-vite to use undefined for fetching
DanDaManTran Apr 10, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion exercise-src/react-native/13-http-requests/03-problem/src/services/pmo/api/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export async function apiRequest<
params?: Params
path: string
body?: Body
}): Promise<{ data: Data | undefined; error: Error | undefined }> {}
}): Promise<{ data?: Data; error?: Error }> {}

export function stringifyQuery(
input: Record<string, string | undefined | undefined>,
Expand Down
12 changes: 5 additions & 7 deletions exercise-src/react-native/13-http-requests/03-solution/src/services/pmo/api/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export async function apiRequest<
params?: Params
path: string
body?: Body
}): Promise<{ data: Data | undefined; error: Error | undefined }> {
}): Promise<{ data?: Data; error?: Error }> {
try {
const query = params ? stringifyQuery(params) : ""
const requestUrl = `${baseUrl}${path}?${query}`
Expand All @@ -28,15 +28,13 @@ export async function apiRequest<
})

const data = await response.json()

if (!response.ok) {
const error = new Error(`${response.status} (${response.statusText})`)
return { data: data, error: error }
}
const error = response.ok
? undefined
: new Error(`${response.status} (${response.statusText})`)

return {
data: "data" in data ? data.data : data,
error: undefined,
error: error,
}
} catch (error) {
return {
Expand Down
10 changes: 4 additions & 6 deletions exercise-src/react-native/15-async-storage/01-problem/src/services/pmo/api/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,15 +37,13 @@ export async function apiRequest<
})

const data = await response.json()

if (!response.ok) {
const error = new Error(`${response.status} (${response.statusText})`)
return { data: data, error: error }
}
const error = response.ok
? undefined
: new Error(`${response.status} (${response.statusText})`)

return {
data: "data" in data ? data.data : data,
error: undefined,
error: error,
}
} catch (error) {
return {
Expand Down
10 changes: 4 additions & 6 deletions exercise-src/react-native/15-async-storage/01-solution/src/services/pmo/api/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,9 @@ export async function apiRequest<
})

const data = await response.json()
const error = response.ok
? undefined
: new Error(`${response.status} (${response.statusText})`)

if (method === "GET" && response.ok) {
await storeData<CachedResponse<Data>>(keyPrefix + requestUrl, {
Expand All @@ -67,14 +70,9 @@ export async function apiRequest<
})
}

if (!response.ok) {
const error = new Error(`${response.status} (${response.statusText})`)
return { data: data, error: error }
}

return {
data: "data" in data ? data.data : data,
error: undefined,
error: error,
}
} catch (error) {
return {
Expand Down
12 changes: 5 additions & 7 deletions exercise-src/react-native/15-async-storage/02-problem/src/services/pmo/api/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export async function apiRequest<
params?: Params
path: string
body?: Body
}): Promise<{ data: Data | undefined; error: Error | undefined }> {
}): Promise<{ data?: Data; error?: Error }> {
try {
const query = params ? stringifyQuery(params) : ""
const requestUrl = `${baseUrl}${path}?${query}`
Expand Down Expand Up @@ -58,6 +58,9 @@ export async function apiRequest<
})

const data = await response.json()
const error = response.ok
? undefined
: new Error(`${response.status} (${response.statusText})`)

if (method === "GET" && response.ok) {
await storeData<CachedResponse<Data>>(keyPrefix + requestUrl, {
Expand All @@ -66,14 +69,9 @@ export async function apiRequest<
})
}

if (!response.ok) {
const error = new Error(`${response.status} (${response.statusText})`)
return { data: data, error: error }
}

return {
data: "data" in data ? data.data : data,
error: undefined,
error: error,
}
} catch (error) {
return {
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/05-props/01-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/06-routing/01-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/06-routing/01-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/06-routing/02-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/06-routing/02-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/07-styling-in-react/01-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/07-styling-in-react/01-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/08-stateful-hooks/01-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/08-stateful-hooks/01-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/08-stateful-hooks/02-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/08-stateful-hooks/02-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/08-stateful-hooks/03-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion exercises/react-vite/08-stateful-hooks/03-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion ...cises/react-vite/09-making-http-requests/01-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
2 changes: 1 addition & 1 deletion ...s/react-vite/09-making-http-requests/01-problem/src/services/pmo/restaurant/hooks.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ describe("useStates Hook", () => {
await waitFor(() => {
expect(result.current.isPending).toBe(false)
expect(result.current.data).toEqual(mockStates)
expect(result.current.error).toBeNull()
expect(result.current.error).toBeUndefined()
})
})
})
4 changes: 2 additions & 2 deletions exercises/react-vite/09-making-http-requests/01-problem/src/services/pmo/restaurant/hooks.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@ import type { City, State } from "./interfaces"
import { useEffect, useState } from "react"

interface StatesResponse {
data: State[] | null
error: Error | null
data: State[] | undefined
error: Error | undefined
isPending: boolean
}

Expand Down
2 changes: 1 addition & 1 deletion ...ises/react-vite/09-making-http-requests/01-solution/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
8 changes: 4 additions & 4 deletions ...vite/09-making-http-requests/01-solution/src/pages/RestaurantList/RestaurantList.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,15 @@ import RestaurantList from "./RestaurantList"
vi.mock("../../services/pmo/restaurant", () => ({
useCities: vi.fn(() => {
return {
data: null,
error: null,
data: undefined,
error: undefined,
isPending: false,
}
}),
useStates: vi.fn(() => {
return {
data: null,
error: null,
data: undefined,
error: undefined,
isPending: false,
}
}),
Expand Down
2 changes: 1 addition & 1 deletion .../react-vite/09-making-http-requests/01-solution/src/services/pmo/restaurant/hooks.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ describe("useStates Hook", () => {
await waitFor(() => {
expect(result.current.isPending).toBe(false)
expect(result.current.data).toEqual(mockStates)
expect(result.current.error).toBeNull()
expect(result.current.error).toBeUndefined()
})
})
})
12 changes: 6 additions & 6 deletions ...cises/react-vite/09-making-http-requests/01-solution/src/services/pmo/restaurant/hooks.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@ import type { City, State } from "./interfaces"
import { useEffect, useState } from "react"

interface StatesResponse {
data: State[] | null
error: Error | null
data: State[] | undefined
error: Error | undefined
isPending: boolean
}

Expand All @@ -19,8 +19,8 @@ export function useCities(state: string): City[] {

export function useStates(): StatesResponse {
const [response, setResponse] = useState<StatesResponse>({
data: null,
error: null,
data: undefined,
error: undefined,
isPending: true,
})

Expand All @@ -33,8 +33,8 @@ export function useStates(): StatesResponse {
const data = await response.json()

setResponse({
data: data?.data || null,
error: null,
data: data?.data || undefined,
error: undefined,
isPending: false,
})
}
Expand Down
2 changes: 1 addition & 1 deletion ...cises/react-vite/09-making-http-requests/02-problem/src/pages/RestaurantList/ListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const ListItem: React.FC<ListItemProps> = ({
return (
<>
<div className="restaurant">
<img src={thumbnail} alt={`A thumbnail for ${name}`} width="100" height="100" />
<img src={`/${thumbnail}`} alt={`A thumbnail for ${name}`} width="100" height="100" />
<h3>{name}</h3>

{address && (
Expand Down
Loading
Loading