code cleanup
Harish Vishwakarma
parent
311644fdf2
commit
8b9dc37b94
|
|
@ -19,7 +19,6 @@ const CompoundBay = observer(() => {
|
|||
>([]);
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const [loadCount, setLoadCount] = useState(10);
|
||||
//const [expandedSales, setExpandedSales] = useState<Set<string>>(new Set());
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
|
|
@ -28,12 +27,6 @@ const CompoundBay = observer(() => {
|
|||
const [vendor, setVendor] = useState("");
|
||||
const [shipsFromCountry, setShipsFromCountry] = useState("");
|
||||
const [compound, setCompound] = useState("");
|
||||
|
||||
// Add new state for dropdown options
|
||||
const [vendorOptions, setVendorOptions] = useState<string[]>([]);
|
||||
const [countryOptions, setCountryOptions] = useState<string[]>([]);
|
||||
const [compoundOptions, setCompoundOptions] = useState<string[]>([]);
|
||||
|
||||
const [isMobileFilterVisible, setIsMobileFilterVisible] = useState(false);
|
||||
|
||||
const fetchGroupBuySales = async () => {
|
||||
|
|
@ -48,23 +41,6 @@ const CompoundBay = observer(() => {
|
|||
const sales = results.data as GroupBuySale[];
|
||||
setGroupBuySales(sales);
|
||||
setVisibleGroupBuySales(sales.slice(0, loadCount));
|
||||
|
||||
// Extract unique options for dropdowns
|
||||
const vendors = [
|
||||
...new Set(sales.map((sale) => sale.Vendor)),
|
||||
];
|
||||
const countries = [
|
||||
...new Set(
|
||||
sales.map((sale) => sale["Ships from Country"]),
|
||||
),
|
||||
];
|
||||
const compounds = [
|
||||
...new Set(sales.map((sale) => sale.Compound)),
|
||||
];
|
||||
|
||||
setVendorOptions(vendors);
|
||||
setCountryOptions(countries);
|
||||
setCompoundOptions(compounds);
|
||||
},
|
||||
error: (error) => {
|
||||
console.error("Error parsing CSV:", error);
|
||||
|
|
@ -82,7 +58,6 @@ const CompoundBay = observer(() => {
|
|||
useEffect(() => {
|
||||
fetchGroupBuySales();
|
||||
const intervalId = setInterval(fetchGroupBuySales, 15 * 60 * 1000); // Refresh every 15 minutes
|
||||
|
||||
return () => clearInterval(intervalId);
|
||||
}, []);
|
||||
|
||||
|
|
|
|||
|
|
@ -37,6 +37,27 @@ const FilterSidebar: React.FC<FilterSidebarProps> = ({
|
|||
isMobileFilterVisible,
|
||||
toggleMobileFilter,
|
||||
}) => {
|
||||
const renderFilterSection = (
|
||||
title: string,
|
||||
value: string,
|
||||
options: string[],
|
||||
handleChange: (value: string) => void,
|
||||
) => (
|
||||
<div className={styles.filterSection}>
|
||||
<h3>{title}</h3>
|
||||
<select
|
||||
value={value}
|
||||
onChange={(e) => handleChange(e.target.value)}>
|
||||
<option value="">All</option>
|
||||
{options.map((option) => (
|
||||
<option key={option} value={option}>
|
||||
{option}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`${styles.filterSidebar} ${
|
||||
|
|
@ -49,63 +70,30 @@ const FilterSidebar: React.FC<FilterSidebarProps> = ({
|
|||
</button>
|
||||
<h2>Filters</h2>
|
||||
|
||||
<div className={styles.filterSection}>
|
||||
<h3>Vendor Rating</h3>
|
||||
<select
|
||||
value={vendorRating}
|
||||
onChange={(e) => handleVendorRatingChange(e.target.value)}>
|
||||
<option value="">All</option>
|
||||
{vendorRatingOptions.map((rating) => (
|
||||
<option key={rating} value={rating}>
|
||||
{rating}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className={styles.filterSection}>
|
||||
<h3>Vendor</h3>
|
||||
<select
|
||||
value={vendor}
|
||||
onChange={(e) => handleVendorChange(e.target.value)}>
|
||||
<option value="">All</option>
|
||||
{vendorOptions.map((v) => (
|
||||
<option key={v} value={v}>
|
||||
{v}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className={styles.filterSection}>
|
||||
<h3>Ships from Country</h3>
|
||||
<select
|
||||
value={shipsFromCountry}
|
||||
onChange={(e) =>
|
||||
handleShipsFromCountryChange(e.target.value)
|
||||
}>
|
||||
<option value="">All</option>
|
||||
{countryOptions.map((c) => (
|
||||
<option key={c} value={c}>
|
||||
{c}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className={styles.filterSection}>
|
||||
<h3>Compound</h3>
|
||||
<select
|
||||
value={compound}
|
||||
onChange={(e) => handleCompoundChange(e.target.value)}>
|
||||
<option value="">All</option>
|
||||
{compoundOptions.map((c) => (
|
||||
<option key={c} value={c}>
|
||||
{c}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
{renderFilterSection(
|
||||
"Vendor Rating",
|
||||
vendorRating,
|
||||
vendorRatingOptions,
|
||||
handleVendorRatingChange,
|
||||
)}
|
||||
{renderFilterSection(
|
||||
"Vendor",
|
||||
vendor,
|
||||
vendorOptions,
|
||||
handleVendorChange,
|
||||
)}
|
||||
{renderFilterSection(
|
||||
"Ships from Country",
|
||||
shipsFromCountry,
|
||||
countryOptions,
|
||||
handleShipsFromCountryChange,
|
||||
)}
|
||||
{renderFilterSection(
|
||||
"Compound",
|
||||
compound,
|
||||
compoundOptions,
|
||||
handleCompoundChange,
|
||||
)}
|
||||
|
||||
<button onClick={clearFilters} className={styles.clearFilters}>
|
||||
Clear Filters
|
||||
|
|
|
|||
|
|
@ -14,11 +14,7 @@ const ResultsSidebar: React.FC<ResultsSidebarProps> = ({
|
|||
handleScroll,
|
||||
}) => {
|
||||
const renderLink = (link: string, text: string) => {
|
||||
if (
|
||||
link &&
|
||||
link.toLowerCase() !== "invite only" &&
|
||||
link.toLowerCase() !== "n/a"
|
||||
) {
|
||||
if (link && !["invite only", "n/a"].includes(link.toLowerCase())) {
|
||||
return (
|
||||
<a href={link} target="_blank" rel="noopener noreferrer">
|
||||
{text}
|
||||
|
|
@ -34,91 +30,61 @@ const ResultsSidebar: React.FC<ResultsSidebarProps> = ({
|
|||
</div>
|
||||
);
|
||||
|
||||
const renderSaleItem = (sale: GroupBuySale, index: number) => (
|
||||
<div key={index} className={styles.saleItem}>
|
||||
<h3 className={styles.saleTitle}>
|
||||
{sale.Vendor} - {sale.Compound}
|
||||
</h3>
|
||||
<p className={styles.salePrice}>Price: {sale.Price}</p>
|
||||
<div className={styles.expandedDetails}>
|
||||
<div className={styles.detailsGrid}>
|
||||
{renderDetailItem("Type", sale.Type)}
|
||||
{renderDetailItem("Dose", `${sale.Dose} ${sale.Unit}`)}
|
||||
{renderDetailItem("Format", sale.Format)}
|
||||
{renderDetailItem("Quantity", sale.Quantity)}
|
||||
{renderDetailItem("Ships from", sale["Ships from Country"])}
|
||||
{renderDetailItem("Shipping Cost", sale["Shipping $"])}
|
||||
{renderDetailItem("MOQ", sale.MOQ)}
|
||||
{renderDetailItem("Vendor Rating", sale["Vendor rating"])}
|
||||
{renderDetailItem("Analysis", sale.Analysis)}
|
||||
{renderDetailItem(
|
||||
"Purity Guarantee",
|
||||
sale["Purity guarantee"],
|
||||
)}
|
||||
{renderDetailItem("Mass Guarantee", sale["Mass guarantee"])}
|
||||
{renderDetailItem(
|
||||
"Reship Guarantee",
|
||||
sale["Re-ship guarantee"],
|
||||
)}
|
||||
{renderDetailItem("Start", sale.Start)}
|
||||
{renderDetailItem("Close", sale.Close)}
|
||||
</div>
|
||||
<div className={styles.notes}>
|
||||
<span className={styles.detailLabel}>Notes:</span>{" "}
|
||||
{sale.Notes}
|
||||
</div>
|
||||
<div className={styles.links}>
|
||||
{renderDetailItem(
|
||||
"PepChat",
|
||||
renderLink(sale["PepChat Link"], "PepChat"),
|
||||
)}
|
||||
{renderDetailItem(
|
||||
"Discord",
|
||||
renderLink(sale["Discord Link"], "Discord"),
|
||||
)}
|
||||
{renderDetailItem(
|
||||
"Telegram",
|
||||
renderLink(sale["Telegram Link"], "Telegram"),
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={styles.results} onScroll={handleScroll}>
|
||||
{visibleGroupBuySales.length > 0 ? (
|
||||
visibleGroupBuySales.map((sale, index) => (
|
||||
<div key={index} className={styles.saleItem}>
|
||||
<h3 className={styles.saleTitle}>
|
||||
{sale.Vendor} - {sale.Compound}
|
||||
</h3>
|
||||
<p className={styles.salePrice}>Price: {sale.Price}</p>
|
||||
<div className={styles.expandedDetails}>
|
||||
<div className={styles.detailsGrid}>
|
||||
{renderDetailItem("Type", sale.Type)}
|
||||
{renderDetailItem(
|
||||
"Dose",
|
||||
`${sale.Dose} ${sale.Unit}`,
|
||||
)}
|
||||
{renderDetailItem("Format", sale.Format)}
|
||||
{renderDetailItem("Quantity", sale.Quantity)}
|
||||
{renderDetailItem(
|
||||
"Ships from",
|
||||
sale["Ships from Country"],
|
||||
)}
|
||||
{renderDetailItem(
|
||||
"Shipping Cost",
|
||||
sale["Shipping $"],
|
||||
)}
|
||||
{renderDetailItem("MOQ", sale.MOQ)}
|
||||
{renderDetailItem(
|
||||
"Vendor Rating",
|
||||
sale["Vendor rating"],
|
||||
)}
|
||||
{renderDetailItem("Analysis", sale.Analysis)}
|
||||
{renderDetailItem(
|
||||
"Purity Guarantee",
|
||||
sale["Purity guarantee"],
|
||||
)}
|
||||
{renderDetailItem(
|
||||
"Mass Guarantee",
|
||||
sale["Mass guarantee"],
|
||||
)}
|
||||
{renderDetailItem(
|
||||
"Reship Guarantee",
|
||||
sale["Re-ship guarantee"],
|
||||
)}
|
||||
{renderDetailItem("Start", sale.Start)}
|
||||
{renderDetailItem("Close", sale.Close)}
|
||||
</div>
|
||||
<div className={styles.notes}>
|
||||
<span className={styles.detailLabel}>
|
||||
Notes:
|
||||
</span>{" "}
|
||||
{sale.Notes}
|
||||
</div>
|
||||
<div className={styles.links}>
|
||||
<div className={styles.linkItem}>
|
||||
<span className={styles.detailLabel}>
|
||||
PepChat:
|
||||
</span>{" "}
|
||||
{renderLink(
|
||||
sale["PepChat Link"],
|
||||
"PepChat",
|
||||
)}
|
||||
</div>
|
||||
<div className={styles.linkItem}>
|
||||
<span className={styles.detailLabel}>
|
||||
Discord:
|
||||
</span>{" "}
|
||||
{renderLink(
|
||||
sale["Discord Link"],
|
||||
"Discord",
|
||||
)}
|
||||
</div>
|
||||
<div className={styles.linkItem}>
|
||||
<span className={styles.detailLabel}>
|
||||
Telegram:
|
||||
</span>{" "}
|
||||
{renderLink(
|
||||
sale["Telegram Link"],
|
||||
"Telegram",
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
visibleGroupBuySales.map(renderSaleItem)
|
||||
) : (
|
||||
<p className={styles.noResults}>
|
||||
No group buy sales available.
|
||||
|
|
|
|||
Loading…
Reference in New Issue