mirror of
https://github.com/ahmadk953/tasko.git
synced 2025-04-30 18:59:37 +00:00
Updated how Images are Handeled to Comply With Unsplash API Guidelines
This commit is contained in:
parent
d99f17c9d1
commit
01bebf0d83
3 changed files with 42 additions and 13 deletions
|
@ -7,7 +7,6 @@ import { useEffect, useState } from 'react';
|
|||
import { useFormStatus } from 'react-dom';
|
||||
import { Check, Loader2 } from 'lucide-react';
|
||||
|
||||
import { unsplash } from '@/lib/unsplash';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { defaultImages } from '@/constants/images';
|
||||
import { FormErrors } from './form-errors';
|
||||
|
@ -28,16 +27,12 @@ export const FormPicker = ({ id, errors }: FormPickerProps) => {
|
|||
useEffect(() => {
|
||||
const fetchImages = async () => {
|
||||
try {
|
||||
const result = await unsplash.photos.getRandom({
|
||||
collectionIds: ['317099'],
|
||||
count: 9,
|
||||
});
|
||||
|
||||
if (result?.response) {
|
||||
const newImages = result.response as Array<Record<string, any>>;
|
||||
const response = await fetch('/api/unsplash');
|
||||
if (response.ok) {
|
||||
const newImages = await response.json();
|
||||
setImages(newImages);
|
||||
} else {
|
||||
console.error('Failed to get images.');
|
||||
console.error('Failed to fetch images');
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
|
@ -80,7 +75,7 @@ export const FormPicker = ({ id, errors }: FormPickerProps) => {
|
|||
className='hidden'
|
||||
checked={selectedImageId === image.id}
|
||||
disabled={pending}
|
||||
value={`${image.id}|${image.urls.thumb}|${image.urls.full}|${image.links.html}|${image.user.name}`}
|
||||
value={`${image.id}|${image.urls.thumb}|${image.urls.full}|${image.links.html}|${image.user.name}|${image.links.download_location}`}
|
||||
/>
|
||||
<Image
|
||||
src={image.urls.thumb}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue