Skip to content

Commit

Permalink
code formatting
Browse files Browse the repository at this point in the history
  • Loading branch information
g-marcin committed Jun 25, 2023
1 parent c41a74b commit 25bb487
Show file tree
Hide file tree
Showing 8 changed files with 164 additions and 152 deletions.
35 changes: 16 additions & 19 deletions src/__tests__/beerInfo.test.tsx
Original file line number Diff line number Diff line change
@@ -1,21 +1,18 @@
import { render } from "@testing-library/react";
import { expect, test } from "vitest";
import { mockBeer } from "../mocks";
import { BeerInfo } from "../modules/BeerDetails/BeerInfo";
import { render } from '@testing-library/react';
import { expect, test } from 'vitest';
import { mockBeer } from '../mocks';
import { BeerInfo } from '../modules/BeerDetails/BeerInfo';

test('vitest environment works', () => {
expect(2).toEqual(2)
})

test('beer description renders', async () => {
const beerDetails = mockBeer
if (! beerDetails){
return
}
const beerInfo = render(<BeerInfo beerDetails={beerDetails}/>)
const beerDescription = await beerInfo.findByTestId("beer-description")
expect(beerDescription).toBeDefined()
})


test('vitest environment works', () => {
expect(2).toEqual(2);
});

test('beer description renders', async () => {
const beerDetails = mockBeer;
if (!beerDetails) {
return;
}
const beerInfo = render(<BeerInfo beerDetails={beerDetails} />);
const beerDescription = await beerInfo.findByTestId('beer-description');
expect(beerDescription).toBeDefined();
});
4 changes: 4 additions & 0 deletions src/components/AsyncImage/AsyncImage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ type AsyncImageProps = {

export const AsyncImage: FC<AsyncImageProps> = ({ src, alt, className }) => {
const [loadedSrc, setLoadedSrc] = useState<string | null>(null);

useEffect(() => {
setLoadedSrc(null);
if (src) {
Expand All @@ -18,13 +19,16 @@ export const AsyncImage: FC<AsyncImageProps> = ({ src, alt, className }) => {
const image = new Image();
image.addEventListener('load', handleLoad);
image.src = src;

return () => {
image.removeEventListener('load', handleLoad);
};
}
}, [src]);

if (loadedSrc === src) {
return <img src={src} alt={alt} className={className} />;
}

return <Loader />;
};
8 changes: 4 additions & 4 deletions src/components/layout/CustomOffcanvas/CustomOffcanvas.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@ export const CustomOffcanvas: FC<CustomOffcanvasProps> = ({ show, handleClose, .

return (
<>
<Offcanvas show={show} onHide={handleClose} className={styles.offcanvas} {...props} placement={'end'}>
<ReactFocusLock>
<Offcanvas show={show} onHide={handleClose} className={styles.offcanvas} {...props} placement={'end'}>
<ReactFocusLock>
<Offcanvas.Header closeButton>
<Offcanvas.Title>Menu:</Offcanvas.Title>
</Offcanvas.Header>
Expand All @@ -35,8 +35,8 @@ export const CustomOffcanvas: FC<CustomOffcanvasProps> = ({ show, handleClose, .
)}
</div>
</Offcanvas.Body>
</ReactFocusLock>
</Offcanvas>
</ReactFocusLock>
</Offcanvas>
</>
);
};
20 changes: 15 additions & 5 deletions src/hooks/useBeerDetails.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,15 +5,25 @@ import { BeerType, beerDataDTO } from '../types';
import { beerDetailsMapper } from './beerDetailsMapper';

export const useBeerDetails = (id: string | undefined) => {
const [beerDetails, setBeerDetails] = useState<BeerType>();
const [beerDetails, setBeerDetails] = useState<BeerType>({
id: 0,
name: '',
tagline: '',
description: '',
abv: 0,
ibu: 0,
ingredients: {
malt: [],
hops: [],
yeast: '',
},
imageUrl: '',
});
const [isLoading, setIsLoading] = useState(false);
useEffect(() => {
if (!id) {
return;
}
setIsLoading(true);
httpClient
.get(`/beers?ids=${id}`)
.get(`/beers?ids=${id || ''}`)
.then((response: AxiosResponse<beerDataDTO[]>) => {
if (response.data) {
setBeerDetails(beerDetailsMapper(response.data));
Expand Down
228 changes: 115 additions & 113 deletions src/mocks/beer.ts
Original file line number Diff line number Diff line change
@@ -1,114 +1,116 @@
export const mockBeer = {
"id": 2,
"name": "Trashy Blonde",
"tagline": "You Know You Shouldn't",
"first_brewed": "04/2008",
"description": "A titillating, neurotic, peroxide punk of a Pale Ale. Combining attitude, style, substance, and a little bit of low self esteem for good measure; what would your mother say? The seductive lure of the sassy passion fruit hop proves too much to resist. All that is even before we get onto the fact that there are no additives, preservatives, pasteurization or strings attached. All wrapped up with the customary BrewDog bite and imaginative twist.",
"imageUrl": "https://images.punkapi.com/v2/2.png",
"abv": 4.1,
"ibu": 41.5,
"target_fg": 1010,
"target_og": 1041.7,
"ebc": 15,
"srm": 15,
"ph": 4.4,
"attenuation_level": 76,
"volume": {
"value": 20,
"unit": "litres"
},
"boil_volume": {
"value": 25,
"unit": "litres"
},
"method": {
"mash_temp": [
{
"temp": {
"value": 69,
"unit": "celsius"
},
"duration": null
}
],
"fermentation": {
"temp": {
"value": 18,
"unit": "celsius"
}
},
"twist": null
},
"ingredients": {
"malt": [
{
"name": "Maris Otter Extra Pale",
"amount": {
"value": 3.25,
"unit": "kilograms"
}
},
{
"name": "Caramalt",
"amount": {
"value": 0.2,
"unit": "kilograms"
}
},
{
"name": "Munich",
"amount": {
"value": 0.4,
"unit": "kilograms"
}
}
],
"hops": [
{
"name": "Amarillo",
"amount": {
"value": 13.8,
"unit": "grams"
},
"add": "start",
"attribute": "bitter"
},
{
"name": "Simcoe",
"amount": {
"value": 13.8,
"unit": "grams"
},
"add": "start",
"attribute": "bitter"
},
{
"name": "Amarillo",
"amount": {
"value": 26.3,
"unit": "grams"
},
"add": "end",
"attribute": "flavour"
},
{
"name": "Motueka",
"amount": {
"value": 18.8,
"unit": "grams"
},
"add": "end",
"attribute": "flavour"
}
],
"yeast": "Wyeast 1056 - American Ale™"
},
"food_pairing": [
"Fresh crab with lemon",
"Garlic butter dipping sauce",
"Goats cheese salad",
"Creamy lemon bar doused in powdered sugar"
],
"brewers_tips": "Be careful not to collect too much wort from the mash. Once the sugars are all washed out there are some very unpleasant grainy tasting compounds that can be extracted into the wort.",
"contributed_by": "Sam Mason <samjbmason>"
}
id: 2,
name: 'Trashy Blonde',
tagline: "You Know You Shouldn't",
first_brewed: '04/2008',
description:
'A titillating, neurotic, peroxide punk of a Pale Ale. Combining attitude, style, substance, and a little bit of low self esteem for good measure; what would your mother say? The seductive lure of the sassy passion fruit hop proves too much to resist. All that is even before we get onto the fact that there are no additives, preservatives, pasteurization or strings attached. All wrapped up with the customary BrewDog bite and imaginative twist.',
imageUrl: 'https://images.punkapi.com/v2/2.png',
abv: 4.1,
ibu: 41.5,
target_fg: 1010,
target_og: 1041.7,
ebc: 15,
srm: 15,
ph: 4.4,
attenuation_level: 76,
volume: {
value: 20,
unit: 'litres',
},
boil_volume: {
value: 25,
unit: 'litres',
},
method: {
mash_temp: [
{
temp: {
value: 69,
unit: 'celsius',
},
duration: null,
},
],
fermentation: {
temp: {
value: 18,
unit: 'celsius',
},
},
twist: null,
},
ingredients: {
malt: [
{
name: 'Maris Otter Extra Pale',
amount: {
value: 3.25,
unit: 'kilograms',
},
},
{
name: 'Caramalt',
amount: {
value: 0.2,
unit: 'kilograms',
},
},
{
name: 'Munich',
amount: {
value: 0.4,
unit: 'kilograms',
},
},
],
hops: [
{
name: 'Amarillo',
amount: {
value: 13.8,
unit: 'grams',
},
add: 'start',
attribute: 'bitter',
},
{
name: 'Simcoe',
amount: {
value: 13.8,
unit: 'grams',
},
add: 'start',
attribute: 'bitter',
},
{
name: 'Amarillo',
amount: {
value: 26.3,
unit: 'grams',
},
add: 'end',
attribute: 'flavour',
},
{
name: 'Motueka',
amount: {
value: 18.8,
unit: 'grams',
},
add: 'end',
attribute: 'flavour',
},
],
yeast: 'Wyeast 1056 - American Ale™',
},
food_pairing: [
'Fresh crab with lemon',
'Garlic butter dipping sauce',
'Goats cheese salad',
'Creamy lemon bar doused in powdered sugar',
],
brewers_tips:
'Be careful not to collect too much wort from the mash. Once the sugars are all washed out there are some very unpleasant grainy tasting compounds that can be extracted into the wort.',
contributed_by: 'Sam Mason <samjbmason>',
};
2 changes: 1 addition & 1 deletion src/mocks/index.ts
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export * from "./beer";
export * from './beer';
18 changes: 9 additions & 9 deletions src/modules/BeerDetails/BeerDetails.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,21 +10,21 @@ import styles from './beerDetails.module.css';

const BeerDetails: FC = () => {
const { id } = useParams();
const { beerDetails} = useBeerDetails(id);
const { beerDetails } = useBeerDetails(id);

if (!beerDetails) {
return <Loader />;
}

return (
<div className={`${styles.wrapper} `}>
<BeerInfo beerDetails={beerDetails} />
<div className={styles['image-wrapper']}>
<AsyncImage src={beerDetails.imageUrl} alt="beer-image" className={styles.detailsImage} />
<BeerShadow variant="details" />
</div>
<IngredientsInfo beerDetails={beerDetails} />
</div>
<div className={`${styles.wrapper} `}>
<BeerInfo beerDetails={beerDetails} />
<div className={styles['image-wrapper']}>
<AsyncImage src={beerDetails.imageUrl} alt="beer-image" className={styles.detailsImage} />
<BeerShadow variant="details" />
</div>
<IngredientsInfo beerDetails={beerDetails} />
</div>
);
};

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ type IngredientsInfoProps = {
};

export const IngredientsInfo: FC<IngredientsInfoProps> = ({ beerDetails }) => {

const hopsStart = useMemo(() => {
return beerDetails?.ingredients.hops.filter((hop) => hop.add === 'start') || [];
}, [beerDetails]);
Expand Down

0 comments on commit 25bb487

Please sign in to comment.