axios.get('https://api.example.com/data')
  .then(response => {
    // Handle the successful response here
    console.log(response.data);
  })
  .catch(error => {
    // Handle errors here
    console.error('Error fetching data:', error);
  });

{    
    "Top": [
        "Top",
        "T-shirt",
        "T-Shirt",
        " T-shirt",
        "Tee",
        "Blouse",
        "Sweater",
        "Tank top",
        "Short Sleeve T-shirt",
        "Long-sleeve shirt",
        "Hoodie",
        "Polo shirt",
        "Turtleneck",
        "Button-up shirt",
        "Bra",
        "Hoodie",
        "Vest",
        "Bikini",
        "Tankini",
        "Bikinis-and-Tankini-Sets"
  ],
    "Shorts": [
      "Shorts",
      "Bermuda",
      "Bermudas",
      "Trunk",
      "Trunks",
      "Capri",
      "Capris",
      "Boardshort",
      "Boardshorts",
      "Culotte",
      "Culottes",
      "Cargo shorts",
      "Gym shorts",
      "Cycling shorts",
      "Jogging shorts",
      "Boxer shorts",
      "Swimsuit",
      "Swim-briefs-shorts",
      "briefs",
      "Swim",
      "Bandeaus",
      "Swimsuit-one-piece",        
      "Bikini",
      "Tankini"
    ],
    "Pants": [
      "Pant",
      "Pants",
      "Jean",
      "Jeans",
      "Legging",
      "Leggings",
      "Slack",
      "Slacks",
      "Trouser",
      "Trousers",
      "Chino",
      "Chinos",
      "Corduroy",
      "Corduroys",
      "Jegging",
      "Jeggings",
      "Sweatpant",
      "Sweatpants",
      "Jogger",
      "Joggers",
      "Palazzo pant",
      "Palazzo pants"
    ],
    "Outerwear": [
      "Jacket",
      "Coat",
      "Blazer",
      "Windbreaker",
      "Parka",
      "Peacoat",
      "Crop-top",
      "Crop top",
      "Trench coat",
      "Puffer jacket",
      "Denim jacket",
      "Bomber jacket",
      "Raincoat"
    ],
    "Hat": [
      "Hat",
      "Baseball cap",
      "Beanie",
      "Fedora",
      "Sun hat",
      "Trucker hat",
      "Bucket hat",
      "Cowboy hat",
      "Beret",
      "Panama hat",
      "Boater"
    ],
    "Sock": [
      "Sock",
      "Socks",
      "Ankle sock",
      "Ankle socks",
      "Crew sock",
      "Crew socks",
      "No-show sock",
      "No-show socks",
      "Athletic sock",
      "Athletic socks",
      "Thermal sock",
      "Thermal socks",
      "Compression sock",
      "Compression socks",
      "Toe sock",
      "Toe socks"
    ],
    "Dress": [
      "Dress",
      "Maxi dress",
      "Midi dress",
      "Mini dress",
      "Sheath dress",
      "A-line dress",
      "Bodycon dress",
      "Wrap dress",
      "Slip dress",
      "Skater dress",
      "Shift dress"
    ],
    "Miniskirt": [
      "Skirt",
      "Miniskirt",
      "Pencil skirt",
      "Pleated skirt",
      "A-line skirt",
      "Denim skirt",
      "Leather skirt",
      "Circle skirt",
      "Accordion skirt",
      "Ruffle skirt",
      "Tiered skirt",
      "Maxi skirt"
    ],
      "High heels": [
      "High heel",
      "High heels",
      "Stiletto",
      "Pump",
      "Pumps",
      "Wedge heel",
      "Wedge heels",
      "Kitten heel",
      "Kitten heels",
      "Platform heel",
      "Platform heels",
      "Slingback heel",
      "Slingback heels",
      "Peep-toe heel",
      "Peep-toe heels",
      "Ankle-strap heel",
      "Ankle-strap heels",
      "Cone heel",
      "Cone heels",
      "Block heel",
      "Block heels"
    ],
      "Shoes": [
      "Shoe",
      "Shoes",
      "Sneaker",
      "Sneakers",
      "Boot",
      "Boots",
      "Sandal",
      "Sandals",
      "Flat",
      "Flats",
      "Loafer",
      "Loafers",
      "Moccasin",
      "Moccasins",
      "Oxford",
      "Oxfords",
      "Espadrille",
      "Espadrilles",
      "Ballet shoe",
      "Ballet shoes",
      "Slipper",
      "Slippers"
    ]
}
  

app.post("/upload", upload.single("image"), async (req, res) => {
  try {
    if (!req.file) {
      res.status(400).json({ success: false, error: "No file uploaded" });
      return;
    }
    const imageBuffer = req.file.buffer;
    const itemsArray = [];

    const fileName = `public/${Date.now()}.png`;
    const imageUrl = await uploadToSupabase(imageBuffer, fileName);
    console.log("Uploaded image:", imageUrl);

    const objects = await getObjectDetection(imageBuffer);

    const productTitle = await getProductTitle(imageBuffer);
    console.log("Product title:", productTitle);

    const matchedCategory = await compareTitleToJSON(productTitle);
    console.log("Matched Category:", matchedCategory);

    let croppedImageUrl;
    let categoryExistsInObjects = false;
    if (matchedCategory) {
      for (const object of objects) {
        if (object.name.toLowerCase() === matchedCategory.toLowerCase()) {
          categoryExistsInObjects = true;
          break;
        }
      }
    }

    console.log(
      "Category Exists in Detected Objects:",
      categoryExistsInObjects
    );

    let secondaryMatchedCategory;
    if (!categoryExistsInObjects) {
      // Use OCR title as a backup
      secondaryMatchedCategory = await compareTitleToAllItems(productTitle);
      console.log(
        "Backup Matched Category from OCR title:",
        secondaryMatchedCategory
      );
    }

    if (matchedCategory && categoryExistsInObjects) {
      const object = objects.find(
        (obj) => obj.name.toLowerCase() === matchedCategory.toLowerCase()
      );

      croppedImageUrl = await cropImageForCategory(
        imageBuffer,
        objects,
        matchedCategory
      );

      if (object) {
        const vertices = object.boundingPoly.normalizedVertices;
        const x1 = vertices[0].x;
        const y1 = vertices[0].y;
        const x2 = vertices[2].x;
        const y2 = vertices[2].y;

        const croppedBuffer = await cropImage(imageBuffer, x1, y1, x2, y2);

        // Upload the cropped image to Supabase
        const croppedFileName = `public/${Date.now()}.png`;
        croppedImageUrl = await uploadToSupabase(
          croppedBuffer,
          croppedFileName
        );
        console.log("Cropped image URL:", croppedImageUrl);
      }
    } else if (secondaryMatchedCategory) {
      // Add this condition
      const croppedFileName = `public/${Date.now()}.png`;
      croppedImageUrl = await cropImageForCategory(
        imageBuffer,
        objects,
        secondaryMatchedCategory
      );
      console.log("Secondary cropped image URL:", croppedImageUrl);
    } else {
      croppedImageUrl = null; // Assign null when neither condition is met
    }

    const question = "Is this a shopping webpage where I can buy clothing?";
    const answer = await askQuestionAboutImage(imageUrl, question);
    const isShoppingWebpage = answer.includes("yes");
    console.log("This is a shopping page?:", isShoppingWebpage);

    if (croppedImageUrl) {
      const croppedItemsArray = await getItems(croppedImageUrl);
      itemsArray.push(...croppedItemsArray); // Combine the results
    }

    console.log(
      "Category Exists in Detected Objects (before response):",
      categoryExistsInObjects
    );

    res.json({
      success: true,
      imageUrl:
        categoryExistsInObjects && croppedImageUrl ? croppedImageUrl : imageUrl,
      objects,
      productTitle,
      itemsArray: itemsArray,
      isShoppingWebpage,
      matchedCategory,
      categoryExistsInObjects,
      croppedImageUrl,
    });

    console.log("Items Array sent in response:", itemsArray);
  } catch (error) {
    console.error("Error uploading image to Supabase:", error);
    res.status(500).json({ success: false, error: "Image upload failed" });
  }
});

import React, { useEffect } from "react";
import { Text, View, StyleSheet, BackHandler, Alert } from "react-native";
import { useBackHandler } from "@react-native-community/hooks"

const App = () => {

  // Callback function for back action
  const backActionHandler = () => {
    Alert.alert("Alert!", "Are you sure you want to exit app?", [
      {
        text: "Cancel",
        onPress: () => null,
        style: "cancel"
      },
      { text: "YES", onPress: () => BackHandler.exitApp() }
    ]);
    return true;
  };

  // hook which handles event listeners under the hood
  useBackHandler(backActionHandler)

  return (
    <View style={styles.container}>
      <Text style={styles.text}>Click Back button!</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: "center",
    justifyContent: "center"
  },
  text: {
    fontSize: 18,
    fontWeight: "bold"
  }
});

export default App;

const Nav = styled.div`
    div > a.active > div {
        color: ${props => props.color}
     }
`
function Header() {
    const {DefaultColor} = useContext(GlobalContext)
    return <Nav color={DefaultColor?.success} />
}

  <SafeAreaView style={styles.container}>
      <Text numberOfLines={1}>hello</Text>
    </SafeAreaView>