ImAlpha/kevos-attire
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

updated env variables, need to create server component to fetch data

Browse Source
This commit is contained in:
Jacob Delgado 2024-11-11 22:50:54 -08:00
parent a189a830ed
commit c37ca2c0da
5 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
api/src/api/product/content-types/product/schema.json
View File

@ -18,7 +18,7 @@
"desc": { "desc": {
"type": "text" "type": "text"
}, },
"Image": { "image": {
"type": "media", "type": "media",
"multiple": false, "multiple": false,
"required": false, "required": false,
@ -29,7 +29,7 @@
"audios" "audios"
] ]
}, },
"Image2": { "image2": {
"type": "media", "type": "media",
"multiple": false, "multiple": false,
"required": false, "required": false,

4
api/types/generated/contentTypes.d.ts vendored
View File

@ -486,8 +486,8 @@ export interface ApiProductProduct extends Struct.CollectionTypeSchema {
createdBy: Schema.Attribute.Relation<'oneToOne', 'admin::user'> & createdBy: Schema.Attribute.Relation<'oneToOne', 'admin::user'> &
Schema.Attribute.Private; Schema.Attribute.Private;
desc: Schema.Attribute.Text; desc: Schema.Attribute.Text;
Image: Schema.Attribute.Media<'images' | 'files' | 'videos' | 'audios'>; image: Schema.Attribute.Media<'images' | 'files' | 'videos' | 'audios'>;
Image2: Schema.Attribute.Media<'images' | 'files' | 'videos' | 'audios'>; image2: Schema.Attribute.Media<'images' | 'files' | 'videos' | 'audios'>;
isNew: Schema.Attribute.Boolean & Schema.Attribute.DefaultTo<false>; isNew: Schema.Attribute.Boolean & Schema.Attribute.DefaultTo<false>;
locale: Schema.Attribute.String & Schema.Attribute.Private; locale: Schema.Attribute.String & Schema.Attribute.Private;
localizations: Schema.Attribute.Relation< localizations: Schema.Attribute.Relation<

14
frontend/next.config.mjs
View File

@ -6,17 +6,11 @@ const nextConfig = {
source: '/backend/:path*', source: '/backend/:path*',
destination: `http://192.168.50.107:5580/:path*`, destination: `http://192.168.50.107:5580/:path*`,
}, },
]
},
images: {
remotePatterns: [
{ {
protocol: "https", source: '/strapi/:path*',
hostname: "ih1.redbubble.net", destination: `http://192.168.50.107:1337/:path*`,
port: "", }
pathname: "/**", ]
},
],
}, },
}; };

20
frontend/src/app/products/page.tsx
View File

@ -11,16 +11,21 @@ const Products = () => {
const [maxPrice, setMaxPrice] = useState(100); const [maxPrice, setMaxPrice] = useState(100);
const [sort, setSort] = useState("asc"); const [sort, setSort] = useState("asc");
async function getData () { async function GetData () {
let response = await fetch(process.env.REACT_APP_API_URL + "/products", { // const response = await fetch("/strapi/products?=populate=*", {
const response = await fetch(process.env.NEXT_PUBLIC_API_URL +"/products?populate=*", {
method: "GET", method: "GET",
headers: { headers: {
Authorization: "bearer" + process.env.REACT_APP_API_TOKEN, Authorization: "Bearer " + process.env.NEXT_PUBLIC_API_TOKEN
}, }
}); });
let data = await response.json(); const data = await response.json();
console.log(data); // console.log(data.data);
// console.log(data.data[0].image.url);
return data.data;
}; };
const products = GetData();
console.log(products);
return ( return (
<div className="products"> <div className="products">
@ -75,7 +80,8 @@ const Products = () => {
alt="Profile picture" alt="Profile picture"
/> */} /> */}
</div> </div>
<MenuCard Menu={Product} /> <MenuCard Menu={products} />
{/* <button onClick={GetData} className="bg-blue-500 text-white px-4 py-2 rounded-md">Get Data</button> */}
</div> </div>
); );
}; };

4
frontend/src/components/ui/MenuCard/MenuCard.tsx
View File

@ -20,8 +20,10 @@ const Popp = Poppins({ weight: "400", subsets: ["latin"] });
// }); // });
// const inter = Inter({ subsets: ["latin"] }); // const inter = Inter({ subsets: ["latin"] });
const MenuCard = ({ Menu }: any) => { const MenuCard = ({ Menu }: any) => {
const router = useRouter(); const router = useRouter();
return ( return (
<div className="grid qhd:grid-cols-5 desktop:grid-cols-4 tablet:grid-cols-3 md:grid-cols-2 grid-cols-1 grid-flow-row gap-y-6 md:gap-x-6 "> <div className="grid qhd:grid-cols-5 desktop:grid-cols-4 tablet:grid-cols-3 md:grid-cols-2 grid-cols-1 grid-flow-row gap-y-6 md:gap-x-6 ">
{Menu.map((menu_item: any) => { {Menu.map((menu_item: any) => {
@ -33,7 +35,7 @@ const MenuCard = ({ Menu }: any) => {
<div className="w-full h-[75%]"> <div className="w-full h-[75%]">
<div className="h-full relative w-full"> <div className="h-full relative w-full">
<Image <Image
src={`/${menu_item.photo}`} src={`/${process.env.NEXT_PUBLIC_UPLOAD_URL+menu_item.image.url}`}
alt="product photo" alt="product photo"
fill fill
style={{ objectFit: "cover", objectPosition: "center" }} style={{ objectFit: "cover", objectPosition: "center" }}