abner
/
for-legacy-web
mirror of https://github.com/stoatchat/for-legacy-web
1
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

code cleanup

pull/1047/head
Harish Vishwakarma 2024-10-21 22:35:13 +05:30
parent 311644fdf2
commit 8b9dc37b94
3 changed files with 98 additions and 169 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/pages/compoundbay/CompoundBay.tsx
View File

@ -19,7 +19,6 @@ const CompoundBay = observer(() => {
>([]); >([]);
const [searchTerm, setSearchTerm] = useState(""); const [searchTerm, setSearchTerm] = useState("");
const [loadCount, setLoadCount] = useState(10); const [loadCount, setLoadCount] = useState(10);
//const [expandedSales, setExpandedSales] = useState<Set<string>>(new Set());
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
@ -28,12 +27,6 @@ const CompoundBay = observer(() => {
const [vendor, setVendor] = useState(""); const [vendor, setVendor] = useState("");
const [shipsFromCountry, setShipsFromCountry] = useState(""); const [shipsFromCountry, setShipsFromCountry] = useState("");
const [compound, setCompound] = 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 [isMobileFilterVisible, setIsMobileFilterVisible] = useState(false);
const fetchGroupBuySales = async () => { const fetchGroupBuySales = async () => {
@ -48,23 +41,6 @@ const CompoundBay = observer(() => {
const sales = results.data as GroupBuySale[]; const sales = results.data as GroupBuySale[];
setGroupBuySales(sales); setGroupBuySales(sales);
setVisibleGroupBuySales(sales.slice(0, loadCount)); 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) => { error: (error) => {
console.error("Error parsing CSV:", error); console.error("Error parsing CSV:", error);
@ -82,7 +58,6 @@ const CompoundBay = observer(() => {
useEffect(() => { useEffect(() => {
fetchGroupBuySales(); fetchGroupBuySales();
const intervalId = setInterval(fetchGroupBuySales, 15 * 60 * 1000); // Refresh every 15 minutes const intervalId = setInterval(fetchGroupBuySales, 15 * 60 * 1000); // Refresh every 15 minutes
return () => clearInterval(intervalId); return () => clearInterval(intervalId);
}, []); }, []);

102
src/pages/compoundbay/FilterSidebar.tsx
View File

@ -37,6 +37,27 @@ const FilterSidebar: React.FC<FilterSidebarProps> = ({
isMobileFilterVisible, isMobileFilterVisible,
toggleMobileFilter, 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 ( return (
<div <div
className={`${styles.filterSidebar} ${ className={`${styles.filterSidebar} ${
@ -49,63 +70,30 @@ const FilterSidebar: React.FC<FilterSidebarProps> = ({
</button> </button>
<h2>Filters</h2> <h2>Filters</h2>
<div className={styles.filterSection}> {renderFilterSection(
<h3>Vendor Rating</h3> "Vendor Rating",
<select vendorRating,
value={vendorRating} vendorRatingOptions,
onChange={(e) => handleVendorRatingChange(e.target.value)}> handleVendorRatingChange,
<option value="">All</option> )}
{vendorRatingOptions.map((rating) => ( {renderFilterSection(
<option key={rating} value={rating}> "Vendor",
{rating} vendor,
</option> vendorOptions,
))} handleVendorChange,
</select> )}
</div> {renderFilterSection(
"Ships from Country",
<div className={styles.filterSection}> shipsFromCountry,
<h3>Vendor</h3> countryOptions,
<select handleShipsFromCountryChange,
value={vendor} )}
onChange={(e) => handleVendorChange(e.target.value)}> {renderFilterSection(
<option value="">All</option> "Compound",
{vendorOptions.map((v) => ( compound,
<option key={v} value={v}> compoundOptions,
{v} handleCompoundChange,
</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>
<button onClick={clearFilters} className={styles.clearFilters}> <button onClick={clearFilters} className={styles.clearFilters}>
Clear Filters Clear Filters

140
src/pages/compoundbay/ResultsSidebar.tsx
View File

@ -14,11 +14,7 @@ const ResultsSidebar: React.FC<ResultsSidebarProps> = ({
handleScroll, handleScroll,
}) => { }) => {
const renderLink = (link: string, text: string) => { const renderLink = (link: string, text: string) => {
if ( if (link && !["invite only", "n/a"].includes(link.toLowerCase())) {
link &&
link.toLowerCase() !== "invite only" &&
link.toLowerCase() !== "n/a"
) {
return ( return (
<a href={link} target="_blank" rel="noopener noreferrer"> <a href={link} target="_blank" rel="noopener noreferrer">
{text} {text}
@ -34,91 +30,61 @@ const ResultsSidebar: React.FC<ResultsSidebarProps> = ({
</div> </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 ( return (
<div className={styles.results} onScroll={handleScroll}> <div className={styles.results} onScroll={handleScroll}>
{visibleGroupBuySales.length > 0 ? ( {visibleGroupBuySales.length > 0 ? (
visibleGroupBuySales.map((sale, index) => ( visibleGroupBuySales.map(renderSaleItem)
<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>
))
) : ( ) : (
<p className={styles.noResults}> <p className={styles.noResults}>
No group buy sales available. No group buy sales available.