Skip to content

Commit b19f061

Browse files
the-duckchildthe-duckchild
committed
line ending errors and prettier
1 parent 0a4f99c commit b19f061

File tree

7 files changed

+130
-107
lines changed

7 files changed

+130
-107
lines changed

‎eslint.config.mjs‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,15 @@ import globals from "globals";
22
import eslint from "@eslint/js";
33
import tseslint from "typescript-eslint";
44
import pluginReact from "eslint-plugin-react";
5-
5+
import eslintPluginPrettierRecommended from "eslint-plugin-prettier/recommended";
66

77
export default tseslint.config(
88
{ files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"] },
99
{ languageOptions: { globals: globals.browser } },
1010
eslint.configs.recommended,
1111
tseslint.configs.recommended,
1212
pluginReact.configs.flat.recommended,
13+
eslintPluginPrettierRecommended,
1314
{
1415
settings: {
1516
react: {

‎jest.config.ts‎

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,14 @@
55
// export default config;
66

77
export default {
8-
"transform": {
9-
".(ts|tsx)": "ts-jest"
8+
transform: {
9+
".(ts|tsx)": "ts-jest",
1010
},
11-
"moduleNameMapper": {
12-
".+\\.(css|styl|less|sass|scss|png|jpg|svg|ttf|woff|woff2)$": "identity-obj-proxy"
11+
moduleNameMapper: {
12+
".+\\.(css|styl|less|sass|scss|png|jpg|svg|ttf|woff|woff2)$":
13+
"identity-obj-proxy",
1314
},
14-
"moduleFileExtensions": ["ts", "tsx", "js", "json"],
15-
"testEnvironment": "jsdom",
16-
"setupFilesAfterEnv": [
17-
"@testing-library/jest-dom"
18-
]
19-
}
15+
moduleFileExtensions: ["ts", "tsx", "js", "json"],
16+
testEnvironment: "jsdom",
17+
setupFilesAfterEnv: ["@testing-library/jest-dom"],
18+
};

‎src/App.test.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React from "react";
2-
import { render} from "@testing-library/react";
2+
import { render } from "@testing-library/react";
33
import PhotoOfTheDay from "./Components/photoOfTheDay";
44

55
test("renders photo of the day", () => {
6-
render(<PhotoOfTheDay/>);
7-
const imageElement = document.querySelector("img") as HTMLImageElement;
6+
render(<PhotoOfTheDay />);
7+
const imageElement = document.querySelector("img") as HTMLImageElement;
88
expect(imageElement).toBeInTheDocument();
99
});

‎src/App.tsx‎

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,16 @@
11
import React from "react";
22
import "./App.scss";
3-
import {BrowserRouter as Router, Routes, Route} from 'react-router-dom';
4-
import PhotoOfTheDay from './Components/photoOfTheDay'
5-
3+
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
4+
import PhotoOfTheDay from "./Components/photoOfTheDay";
65

76
function App() {
87
return (
9-
<Router>
10-
<Routes>
11-
<Route path = "/" element = {<PhotoOfTheDay/>}/>
12-
</Routes>
13-
</Router>
14-
)
8+
<Router>
9+
<Routes>
10+
<Route path="/" element={<PhotoOfTheDay />} />
11+
</Routes>
12+
</Router>
13+
);
1514
}
1615

1716
export default App;

‎src/Components/photoOfTheDay.spec.tsx‎

Lines changed: 47 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,50 @@
1-
import '@testing-library/jest-dom';
2-
import PhotoOfTheDay from './photoOfTheDay'
3-
import { render, waitFor } from '@testing-library/react';
4-
import React from 'react';
1+
import "@testing-library/jest-dom";
2+
import PhotoOfTheDay from "./photoOfTheDay";
3+
import { render, waitFor } from "@testing-library/react";
4+
import React from "react";
55

6-
describe (PhotoOfTheDay, ()=>{
7-
8-
it ("Should render today's image", async ()=>{
9-
global.fetch = jest.fn(() =>
10-
Promise.resolve(
11-
new Response(
12-
JSON.stringify({
13-
hdurl: "https://apod.nasa.gov/apod/image/2505/IssTransit_Sanz_2569.jpg",
14-
title: "Astronomy Picture of the Day",
15-
explanation: "An amazing view of the International Space Station transiting the Sun.",
16-
})
17-
)))
18-
render(<PhotoOfTheDay/>)
19-
const testImage = document.querySelector("img") as HTMLImageElement;
20-
//expect(component).toContain(testImage);
21-
await waitFor(() => {
22-
expect(testImage).toHaveAttribute("src", "https://apod.nasa.gov/apod/image/2505/IssTransit_Sanz_2569.jpg");
23-
24-
})})
25-
26-
it ("Should render fallback image", async ()=>{
27-
global.fetch = jest.fn(() =>
28-
Promise.resolve(
6+
describe(PhotoOfTheDay, () => {
7+
it("Should render today's image", async () => {
8+
global.fetch = jest.fn(() =>
9+
Promise.resolve(
2910
new Response(
30-
JSON.stringify({
31-
title: "Astronomy Picture of the Day",
32-
explanation: "An amazing view of the International Space Station transiting the Sun.",
33-
})
34-
)))
35-
render(<PhotoOfTheDay/>)
36-
const testImage = document.querySelector("img") as HTMLImageElement;
37-
await waitFor(() => {
38-
expect(testImage).toBeInTheDocument();}
39-
)})
11+
JSON.stringify({
12+
hdurl:
13+
"https://apod.nasa.gov/apod/image/2505/IssTransit_Sanz_2569.jpg",
14+
title: "Astronomy Picture of the Day",
15+
explanation:
16+
"An amazing view of the International Space Station transiting the Sun.",
17+
}),
18+
),
19+
),
20+
);
21+
render(<PhotoOfTheDay />);
22+
const testImage = document.querySelector("img") as HTMLImageElement;
23+
//expect(component).toContain(testImage);
24+
await waitFor(() => {
25+
expect(testImage).toHaveAttribute(
26+
"src",
27+
"https://apod.nasa.gov/apod/image/2505/IssTransit_Sanz_2569.jpg",
28+
);
29+
});
30+
});
4031

41-
})
32+
it("Should render fallback image", async () => {
33+
global.fetch = jest.fn(() =>
34+
Promise.resolve(
35+
new Response(
36+
JSON.stringify({
37+
title: "Astronomy Picture of the Day",
38+
explanation:
39+
"An amazing view of the International Space Station transiting the Sun.",
40+
}),
41+
),
42+
),
43+
);
44+
render(<PhotoOfTheDay />);
45+
const testImage = document.querySelector("img") as HTMLImageElement;
46+
await waitFor(() => {
47+
expect(testImage).toBeInTheDocument();
48+
});
49+
});
50+
});

‎src/Components/photoOfTheDay.tsx‎

Lines changed: 60 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,68 @@
11
import React, { useEffect, useState } from "react";
22
import "./photoOfTheDay.scss";
33

4+
export default function PhotoOfTheDay() {
5+
const [photo, setPhoto] = useState<string>();
6+
const [title, setTitle] = useState<string>();
7+
const [explanation, setExplanation] = useState<string>();
48

5-
export default function PhotoOfTheDay () {
9+
useEffect(() => {
10+
const photoAddress =
11+
"https://api.nasa.gov/planetary/apod?api_key=5s0C1UhCZLh3WVVN2kGzF1kEw76CImpsBBf3AvEy";
12+
const fallBackImageDates = [
13+
"2025-05-08",
14+
"2025-05-13",
15+
"2025-04-24",
16+
"2025-03-26",
17+
"2025-04-13",
18+
"2025-03-23",
19+
"2025-01-15",
20+
"2024-11-10",
21+
"2024-03-22",
22+
"2023-08-10",
23+
];
624

7-
const [photo, setPhoto] = useState<string>()
8-
const [title, setTitle] = useState<string>()
9-
const [explanation,setExplanation] = useState<string>()
10-
11-
useEffect (() => {
12-
const photoAddress = "https://api.nasa.gov/planetary/apod?api_key=5s0C1UhCZLh3WVVN2kGzF1kEw76CImpsBBf3AvEy"
13-
const fallBackImageDates = ["2025-05-08" , "2025-05-13", "2025-04-24" , "2025-03-26" , "2025-04-13" , "2025-03-23" , "2025-01-15" , "2024-11-10" , "2024-03-22" , "2023-08-10"]
14-
15-
fetch(photoAddress)
16-
.then(response => response.json())
17-
.then( data => {
18-
if(data.hdurl) {
19-
setPhoto(data.hdurl)
20-
setTitle(data.title)
21-
setExplanation(data.explanation)
22-
}
23-
else {
24-
const randomFromZeroToNine = Math.floor(Math.random() * 10);
25-
const altPhotoAddress = `https://api.nasa.gov/planetary/apod?date=${fallBackImageDates[randomFromZeroToNine]}&api_key=5s0C1UhCZLh3WVVN2kGzF1kEw76CImpsBBf3AvEy`
26-
27-
fetch(altPhotoAddress)
28-
.then(response => response.json())
29-
.then(data => {
30-
setPhoto(data.hdurl)
31-
setTitle(data.title)
32-
setExplanation(data.explanation)
33-
})
34-
.catch(error => console.error("Error fetching api", error))
35-
}
25+
fetch(photoAddress)
26+
.then((response) => response.json())
27+
.then((data) => {
28+
if (data.hdurl) {
29+
setPhoto(data.hdurl);
30+
setTitle(data.title);
31+
setExplanation(data.explanation);
32+
} else {
33+
const randomFromZeroToNine = Math.floor(Math.random() * 10);
34+
const altPhotoAddress = `https://api.nasa.gov/planetary/apod?date=${fallBackImageDates[randomFromZeroToNine]}&api_key=5s0C1UhCZLh3WVVN2kGzF1kEw76CImpsBBf3AvEy`;
35+
36+
fetch(altPhotoAddress)
37+
.then((response) => response.json())
38+
.then((data) => {
39+
setPhoto(data.hdurl);
40+
setTitle(data.title);
41+
setExplanation(data.explanation);
3642
})
37-
.catch(error => console.error("Error fetching api", error))
38-
},[]);
39-
40-
return (
41-
<div> <link href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet"></link>
42-
<div className="photoOfTheDayContainer">
43-
<img src={photo} className="photo-of-the-day" width="100%" alt={title}/>
44-
45-
</div>
46-
<div className="photoTitle">Astronomy Photo of the Day</div>
47-
<div className="explanation">
48-
{explanation}
49-
</div>
50-
</div>
51-
)
43+
.catch((error) => console.error("Error fetching api", error));
44+
}
45+
})
46+
.catch((error) => console.error("Error fetching api", error));
47+
}, []);
5248

49+
return (
50+
<div>
51+
{" "}
52+
<link
53+
href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap"
54+
rel="stylesheet"
55+
></link>
56+
<div className="photoOfTheDayContainer">
57+
<img
58+
src={photo}
59+
className="photo-of-the-day"
60+
width="100%"
61+
alt={title}
62+
/>
63+
</div>
64+
<div className="photoTitle">Astronomy Photo of the Day</div>
65+
<div className="explanation">{explanation}</div>
66+
</div>
67+
);
5368
}

‎src/reportWebVitals.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ReportHandler } from "web-vitals"
1+
import { ReportHandler } from "web-vitals";
22

33
const reportWebVitals = (onPerfEntry?: ReportHandler) => {
44
if (onPerfEntry && onPerfEntry instanceof Function) {

0 commit comments

Comments
 (0)