Subject array display And Implementation

src/components/posts/ClientViewProviderPosts.tsx

@@ -5,72 +5,77 @@ import supabase from "../../lib/supabaseClient";
 import { ui } from "../../i18n/ui";
 import type { uiObject } from "../../i18n/uiType";
 import { getLangFromUrl, useTranslations } from "../../i18n/utils";
-import stripe from "@lib/stripe"; 
+import stripe from "@lib/stripe";
 
 const lang = getLangFromUrl(new URL(window.location.href));
 
 //get the categories from the language files so they translate with changes in the language picker
 const values = ui[lang] as uiObject;
-const productCategories = values.productCategoryInfo.categories;
+const productCategories = values.subjectCategoryInfo.subjects;
 
 interface ProviderPost {
-  user_id: string;
-  content: string;
-  id: number;
-  //TODO: update this to allow a list of Subjects
-  subject: string;
-  title: string;
-  seller_name: string;
-  major_municipality: string;
-  image_urls: string;
-  price: number;
-  price_id: string;
-  quantity: number;
-  product_id: string;
+	user_id: string;
+	content: string;
+	id: number;
+	image_url: string | undefined;
+	seller_img: string | undefined;
+	//TODO: update this to allow a list of Subjects
+	subject: Array<string>;
+	title: string;
+	seller_name: string;
+	major_municipality: string;
+	image_urls: string;
+	price: number;
+	price_id: string;
+	quantity: number;
+	product_id: string;
 }
 
 interface Props {
-  id: string | undefined;
+	id: string | undefined;
 }
 
 export const ClientViewProviderPosts: Component<Props> = (props) => {
-  const [posts, setPosts] = createSignal<Array<ProviderPost>>([]);
+	const [posts, setPosts] = createSignal<Array<ProviderPost>>([]);
 
-  createEffect(async () => {
-    const { data, error } = await supabase
-      .from("sellerposts")
-      .select("*")
-      .eq("seller_id", props.id);
-    if (!data) {
-      alert("No posts available.");
-    }
-    if (error) {
-      console.log("supabase error: " + error.message);
-    } else {
-      const newItems = await Promise.all(
-      data?.map(async (item) => {
-        productCategories.forEach((productCategories) => {
-          if (item.product_subject.toString() === productCategories.id) {
-            item.subject = productCategories.name;
-          }
-        });
-        delete item.product_subject;
+	createEffect(async () => {
+		const { data, error } = await supabase
+			.from("sellerposts")
+			.select("*")
+			.eq("seller_id", props.id);
+		if (!data) {
+			alert("No posts available.");
+		}
+		if (error) {
+			console.log("supabase error: " + error.message);
+		} else {
+			const newItems = await Promise.all(
+				data?.map(async (item) => {
+					productCategories.forEach((productCategories) => {
+						item.product_subject.map((productSubject: string) => {
+							if (productSubject === productCategories.id) {
+								item.subject.push(productCategories.name);
+								console.log(productCategories.name);
+							}
+						});
+					});
+					delete item.product_subject;
 
-        if (item.price_id !== null) {
-          const priceData = await stripe.prices.retrieve(item.price_id);
-          item.price = priceData.unit_amount! / 100;
-        }
-        return item;
-      }))
-      ;
-      setPosts(data);
-      console.log("Posts")
-      console.log(posts())
-    }
-  });
-  return (
-    <div class="">
-      <ViewCard posts={posts()} />
-    </div>
-  );
+					if (item.price_id !== null) {
+						const priceData = await stripe.prices.retrieve(item.price_id);
+						item.price = priceData.unit_amount! / 100;
+					}
+					return item;
+				}),
+			);
+			setPosts(data);
+			console.log("Posts");
+			console.log(posts());
+		}
+	});
+	return (
+		<div class="">
+			<ViewCard posts={posts()} />
+		</div>
+	);
 };

src/components/posts/CreateNewPost.tsx

@@ -138,6 +138,9 @@ export const CreateNewPost: Component = () => {
   const [selectedTaxCode, setSelectedTaxCode] =
     createSignal<HTMLOptionElement>();
 
+  productCategoryData.subjects.map((item) =>
+    setSubjects([...subjects(), { id: Number(item.id), subject: item.name }]),
+  );
   onMount(() => {
     window.addEventListener("storage", (event) => {
       if (event.key === "theme") {
@@ -191,11 +194,14 @@ export const CreateNewPost: Component = () => {
               /^txcd_1.*/.test(taxCode.id) &&
               //Not in our filter list
               !Array.from(excludeTaxCodes).some((excludeTaxCode) =>
-                excludeTaxCode.test(taxCode.id)
+                excludeTaxCode.test(taxCode.id),
               )
             ) {
               let taxCodeOption = new Option(taxCode.name, taxCode.id);
-              taxCodeOption.setAttribute("data-description", taxCode.description);
+              taxCodeOption.setAttribute(
+                "data-description",
+                taxCode.description,
+              );
               taxCodeOptions.push(taxCodeOption);
             }
           });

src/components/posts/CreateStripeProductPrice.tsx

@@ -16,7 +16,7 @@ async function postStripeData(stripeData: FormData) {
   });
   const data = await response.json();
   if (data.redirect) {
-    alert(data.message); 
+    alert(data.message);
     window.location.href = `/${lang}` + data.redirect;
   }
   return data;
@@ -35,7 +35,11 @@ interface Props {
 export const CreateStripeProductPrice: Component<Props> = (props: Props) => {
   const [stripeData, setStripeData] = createSignal<FormData>();
   const [response] = createResource(stripeData, postStripeData);
-  async function createProduct(name: string, description: string, tax_code: string) {
+  async function createProduct(
+    name: string,
+    description: string,
+    tax_code: string,
+  ) {
     return stripe.products.create({
       name: name,
       description: description,
@@ -52,8 +56,12 @@ export const CreateStripeProductPrice: Component<Props> = (props: Props) => {
   }
 
   async function createPriceAndProduct() {
-    console.log("Stripe Tax Code: " + props.tax_code)
-    const product = await createProduct(props.name, props.description, props.tax_code);
+    console.log("Stripe Tax Code: " + props.tax_code);
+    const product = await createProduct(
+      props.name,
+      props.description,
+      props.tax_code,
+    );
     const price = await createPrice(product, props.price);
     const stripeData = new FormData();
     stripeData.append("price_id", price.id);