@liiift-studio/sales-portal 3.1.5 → 3.1.8

package/components/LoginForm.js

@@ -33,8 +33,8 @@ export default function LoginForm({
 
 	const {
 		title = 'Sales Portal',
-		description = 'A comprehensive dashboard for type designers to track their typeface sales performance and revenue.',
-		subtitle = 'All sales are reviewed internally before payouts. Contact support if you have questions about your sales data.',
+		description = 'Track your typeface sales, monitor revenue trends, and gain insights into how your work is performing across the foundry.',
+		subtitle = 'Sales data is reviewed internally before payouts are issued. If something looks off, reach out to us.',
 		buttonLabel = 'Login',
 		errorMessage = 'Incorrect username/password or the user is not a designer.',
 		emptyFieldsMessage = 'Please enter a username and password.',

package/components/Sales.js

@@ -695,67 +695,63 @@ export default function Sales(props) {
 						<Box sx={{ display: { xs: 'none', md: 'flex' } }}>
 							<IconButton
 								className='print-button'
-								onClick={() => {
+								onClick={(e) => {
 									// Add print-specific styles to the document
 									const style = document.createElement('style');
 									style.id = 'print-style';
 									// Find the current salesPortal containing the clicked print button
-									const printButton = document.querySelector('.print-button:hover');
-									const currentPortal = printButton.closest('.salesPortal');
+									const currentPortal = e.currentTarget.closest('.salesPortal');
 									const allPortals = Array.from(document.querySelectorAll('.salesPortal'));
 									const portalIndex = allPortals.indexOf(currentPortal) + 1;
 									
 									style.textContent = `
-										@media print {
-											@page {
-												size: letter portrait;
-												margin: 0.5in;
-											}
-											/* Hide everything except this sales portal */
-											header, nav, footer, #navBar, #footer, #titleContainer,
-											.exportSection, .date-range-sales-table-wrapper,
-											.salesPortal:not(:nth-child(${portalIndex})) {
-												display: none !important;
-											}
-											.salesPortal, .salesPortalWrap {
-												background: white !important;
-											}
-											body {
-												-webkit-print-color-adjust: exact !important;
-												print-color-adjust: exact !important;
-											}
-											/* Clean up layout */
-											.salesPortal {
-												padding: 0 !important;
-												width: 100% !important;
-											}
-											.salesPortal > * {
-												page-break-inside: avoid;
-											}
-											/* Hide interactive elements */
-											button, .MuiIconButton-root, .MuiInput-root,
-											.MuiDateCalendar-root, .print-button,
-											.year-overview-wrapper, .sales-chart-wrapper {
-												display: none !important;
-											}
-											/* Full width sections */
-											.sales-header-section, .sales-data-section,
-											.insights-wrapper, .sales-table-wrapper {
-												width: 100% !important;
-												padding: 0 !important;
-												margin: 10px 0 !important;
-											}
-											/* Readable text */
-											.MuiTypography-root {
-												color: black !important;
-											}
-											/* Compact cards for print */
-											.MuiPaper-root {
-												box-shadow: none !important;
-												border: 1px solid #ddd !important;
-												page-break-inside: avoid;
-											}
-										}
+@media print {
+  @page { size: letter portrait; margin: 0.5in; }
+  body { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
+
+  /* Hide site chrome and other portals */
+  header, nav, footer, #navBar, #footer, #titleContainer,
+  .exportSection, .date-range-sales-table-wrapper,
+  .salesPortal:not(:nth-child(${portalIndex})) { display: none !important; }
+
+  /* Hide interactive controls */
+  .MuiIconButton-root, .MuiInput-root, .MuiDateCalendar-root,
+  .print-button, .MuiFilledInput-root, .MuiFormControl-root { display: none !important; }
+
+  /* Portal layout */
+  .salesPortal, .salesPortalWrap { background: white !important; padding: 0 !important; width: 100% !important; }
+
+  /* Full width sections */
+  .sales-header-section, .sales-data-section, .insights-wrapper, .sales-table-wrapper,
+  .sales-chart-wrapper, .year-overview-wrapper, .typeface-list-wrapper,
+  .license-type-list-wrapper, .top-performers-wrapper { width: 100% !important; padding: 0 !important; margin: 10px 0 !important; }
+
+  /* Page break control */
+  .insights-wrapper, .top-performers-wrapper, .typeface-list-wrapper,
+  .license-type-list-wrapper, .sales-table-wrapper { page-break-inside: avoid; break-inside: avoid; }
+
+  /* Prevent cutting elements across pages */
+  .MuiPaper-root, tr, .designers-section > div,
+  .top-performers-section > div, .product-section > div { page-break-inside: avoid; break-inside: avoid; }
+
+  /* Insight cards: keep dark bg with white text */
+  .insights-wrapper .MuiPaper-root { background-color: #000 !important; color: white !important; border: none !important; box-shadow: none !important; }
+  .insights-wrapper .MuiTypography-root { color: inherit !important; }
+
+  /* Other text: black on white */
+  .sales-header-section .MuiTypography-root, .typeface-list-wrapper .MuiTypography-root,
+  .license-type-list-wrapper .MuiTypography-root, .sales-table-wrapper .MuiTypography-root { color: black !important; }
+
+  /* Section header bars: keep dark bg */
+  .designers-section .MuiTypography-h5, .top-performers-section .MuiTypography-h5,
+  .product-section .MuiTypography-h5 { color: white !important; }
+
+  /* Charts: ensure visible */
+  .sales-chart-wrapper, .year-overview-wrapper { max-height: 400px !important; overflow: hidden !important; page-break-inside: avoid; }
+
+  /* Compact tables */
+  .MuiTableCell-root { padding: 4px 8px !important; font-size: 10px !important; }
+}
 									`;
 									document.head.appendChild(style);
 

package/components/TopPerformers.js

@@ -196,7 +196,7 @@ export default function TopPerformers({
 
 											{/* Individual typefaces for this designer */}
 											{typefaceData
-												?.filter(typeface => typeface.author._id === designer._id)
+												?.filter(typeface => typeface.author?._id === designer._id)
 												.map((typeface, j) => (
 													<Typography
 														key={`designer-typeface-${i}-${j}`}
@@ -209,7 +209,7 @@ export default function TopPerformers({
 														}}>
 														{typeface.title}
 														<span className={styles.earningContainer}>
-															<strong> {(typeface.total / (total + chartState.refundTotal)).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}</strong>%
+															<strong> {(typeface.total / (total + (chartState?.refundTotal || 0))).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}</strong>%
 														</span>
 														<span style={{ opacity: "0.5", textTransform: "none" }}> ({typeface.orders} Orders for a total of </span>
 														<span style={{ opacity: "0.5" }}> USD</span>$<strong>{(typeface.total / 100).toLocaleString('en-US', { minimumFractionDigits: 2 })}</strong>

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@liiift-studio/sales-portal",
-	"version": "3.1.5",
-	"description": "Centralized sales portal package for Liiift Studio projects",
+	"version": "3.1.8",
+	"description": "Sales dashboard and analytics components for Next.js type foundry sites — Stripe integration, MUI DataGrid, charts, CSV export, and multi-designer reporting.",
 	"main": "index.js",
 	"types": "index.d.ts",
 	"files": [
@@ -58,7 +58,17 @@
 		"sales",
 		"portal",
 		"dashboard",
-		"stripe"
+		"analytics",
+		"stripe",
+		"next",
+		"nextjs",
+		"mui",
+		"datagrid",
+		"charts",
+		"e-commerce",
+		"type-foundry",
+		"reporting",
+		"csv-export"
 	],
 	"author": "Liiift Studio",
 	"license": "UNLICENSED",

package/utils/salesDataProcessing.js

@@ -446,6 +446,7 @@ export function processDesignersData(typefaceData) {
 	let designersData = [];
 
 	typefaceData?.forEach(typeface => {
+		if (!typeface.author?._id) return;
 		let designer = designersData.find(author => author._id === typeface.author._id);
 		if (designer) {
 			designer.total += typeface.total;