Skip to content
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

Jump to bottom

add ffxiv blog #440

Merged
merged 2 commits into from
Jun 13, 2024
Merged

add ffxiv blog #440

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
d17f882
add ffxiv blog
cohenaj194 Jun 13, 2024
bbeb14b
add new request page
cohenaj194 Jun 13, 2024
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
31 changes: 31 additions & 0 deletions app/requests/GetBlog.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import { address, UserAgent } from '~/requests/client/config'

export interface BlogResponse {
itemID: number
itemDescription: string
}

export interface GetBlogProps {
itemId: number
}

const GetBlog: ({ itemId }: GetBlogProps) => Promise<Response> = async ({
itemId
}) => {
const requestBody = JSON.stringify({
item_id: itemId
})

console.log('Request body:', requestBody)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider removing or replacing console logs before deployment.

Production code should not contain console logs as they can lead to unintentional data leakage and are not useful for end-users. Consider replacing it with a more robust logging mechanism if needed for debugging.


return fetch(`${address}/api/ffxiv/blog`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'User-Agent': UserAgent
},
body: requestBody
})
}
Comment on lines +12 to +29
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Check consistency in property naming and validate error handling.

-    item_id: itemId
+    itemId: itemId

The property name item_id in the request body at line 16 should match the naming convention used elsewhere in the project. If camelCase is standard, use itemId instead of item_id.

Also, consider adding error handling for the fetch operation to manage network errors or non-200 responses gracefully. This could improve the robustness of the API interaction.

Committable suggestion was skipped due to low confidence.


export default GetBlog
15 changes: 15 additions & 0 deletions app/routes/queries.item-data.$itemId.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ import type { HistoryResponse } from '~/requests/GetHistory'
import GetHistory from '~/requests/GetHistory'
import type { ListingResponseType } from '~/requests/GetListing'
import GetListing from '~/requests/GetListing'
import type { BlogResponseType } from '~/requests/GetBlog'
import GetBlog from '~/requests/GetBlog'
import { getUserSessionData } from '~/sessions'
import { getItemNameById } from '~/utils/items'
import HistoryResults from '~/components/FFXIVResults/item-history/Results'
Expand Down Expand Up @@ -80,6 +82,7 @@ export const loader: LoaderFunction = async ({ params, request }) => {
try {
const historyResponse = await GetHistory(input)
const listingResponse = await GetListing(input)
const blogResponse = await GetBlog({ itemId: parsedItemId })

if (!historyResponse.ok) {
return { exception: historyResponse.statusText }
Expand All @@ -89,9 +92,14 @@ export const loader: LoaderFunction = async ({ params, request }) => {
return { exception: listingResponse.statusText }
}

if (!blogResponse.ok) {
return { exception: blogResponse.statusText }
}

return json({
history: await historyResponse.json(),
listing: await listingResponse.json(),
itemDescription: (await blogResponse.json()).itemDescription,
itemName
})
} catch (error) {
Expand Down Expand Up @@ -181,6 +189,13 @@ const ItemPage = () => {
</>
</ContentContainer>
</Section>
<Section>
<ContentContainer>
<>
<div dangerouslySetInnerHTML={{ __html: data.itemDescription }} />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider sanitizing or ensuring the safety of data.itemDescription before using dangerouslySetInnerHTML to prevent XSS attacks.

- <div dangerouslySetInnerHTML={{ __html: data.itemDescription }} />
+ <div>{data.itemDescription}</div>

Committable suggestion was skipped due to low confidence.

Tools
Biome

[error] 195-195: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)

Setting content using code can expose users to cross-site scripting (XSS) attacks

</>
</ContentContainer>
</Section>
</>
</PageWrapper>
)
Expand Down
Loading