@articles-media/articles-dev-box 1.0.16 → 1.0.22

package/README.md

@@ -47,18 +47,23 @@ npm run dev
     - Easy way to add future logic and components to all projects with ease. For now handling the font awesome script. Also shows connection status to required servers in development. Will ping the main and auth server as they are needed for some dev-box features.
 - ViewUserModal
     - View user profile data and recent activity.
+- SettingsModal
+    - All in one component to handle game settings UI across multiple games.
+- CreditsModal
+    - All in one component to handle game credits UI across multiple games.
+- DarkModeHandler
+    - Consumes a Zustand store, detects prefers-color-scheme, sets data-bs-theme on body element.
 - useUserToken
     - Hook for getting the subdomain auth token.
 - useUserDetails
     - Hook for getting the details of the current user if a valid user token is found.
+- useFullscreen
+    - Hook for going fullscreen on the body or provided element
 
 # Roadmap
 ⏹️ Remove Bootstrap reliance  
-⏹️ Look into npm package yalc  
-⏹️ Automatic GitHub Action for NPM are done but need to figure out how to show verified build badge on NPM.  
-⏹️ Figure out why this package does not work outside webpack, on Turbopack for example it fails.
-
+⏹️ Figure out why this package does not work outside webpack, on Turbopack for example it fails. Bootstrap SASS related I think.  
 
 # TODO
-- Bundle SCSS on a component level instead of a project level.
+- Bundle SCSS on a component level instead of a project level.  
 - Verify I am exporting components the most efficient way.

package/dist/Ad-Ck5UdTq3.js

@@ -0,0 +1,387 @@
+import { r as e, t } from "./jsx-runtime-VZk6y-ec.js";
+import { t as n } from "./classnames-DP6dWde5.js";
+import { t as r } from "./Button-BlAdEbSd.js";
+import { t as i } from "./Link-MFZblBb4.js";
+import { n as a, t as o } from "./numberWithCommas-BSKBdR-e.js";
+import { lazy as s, memo as c, useEffect as l, useState as u } from "react";
+import { useInView as d } from "react-intersection-observer";
+import f from "swr";
+import { differenceInMinutes as p, minutesToMilliseconds as m } from "date-fns";
+//#region src/hooks/Ads/useAd.js
+var h = async (e) => {
+	if (process.env.NODE_ENV === "development") try {
+		let t = new URLSearchParams({
+			ad_id: e.ad_id,
+			user_ad_token: e.user_ad_token
+		}).toString();
+		return (await (await fetch(`http://localhost:3001/api/ads/${e.ad_id}?${t}`)).json()).result;
+	} catch {}
+	let t = new URLSearchParams({ ad_id: e.ad_id }).toString();
+	return fetch(`${e.url}?${t}`).then((e) => e.json()).then((e) => e.result);
+}, g = { dedupingInterval: 1e3 * 60 * 60 }, _ = (e, t) => {
+	let { data: n, error: r, isLoading: i, mutate: a } = f(e ? {
+		url: `https://articles.media/api/ads/${e}`,
+		ad_id: e,
+		user_ad_token: t
+	} : null, h, g);
+	return {
+		data: n,
+		error: r,
+		isLoading: i,
+		mutate: a
+	};
+}, v = async (e) => {
+	if (process.env.NODE_ENV === "development") try {
+		return await (await fetch("http://localhost:3001/api/ads")).json();
+	} catch {}
+	return fetch(e.url).then((e) => e.json());
+}, y = 60, b = {
+	dedupingInterval: m(y),
+	focusThrottleInterval: m(y)
+}, x = (e) => {
+	let { data: t, error: n, isLoading: r, mutate: i } = f(e?.loading || e?.disabled ? null : { url: "https://articles.media/api/ads" }, v, b);
+	return {
+		data: t,
+		error: n,
+		isLoading: r,
+		mutate: i
+	};
+}, S = t(), C = /* @__PURE__ */ e(n(), 1), w = s(() => import("./AdDetailsModal-DRNRTL2W.js")), T = s(() => import("./AdConfirmExitModal-CJ-HtcVC.js"));
+function E(e, t) {
+	return Math.floor(Math.random() * (t - e + 1)) + e;
+}
+function D(e) {
+	let { previewMode: t, darkMode: n, user_ad_token: s, userDetails: c, userDetailsLoading: f, prepend: m, append: h } = e, g = [], [v, y] = u(null), { data: b, isLoading: D, mutate: O } = x({
+		loading: f,
+		disabled: c?.articles_membership?.status == "Active"
+	}), { data: k, isLoading: ee } = _(v, s), A = e.previewData || {}, [te, ne] = u(null), [j, M] = u(null), [N, P] = u(null), [F, I] = u(0), [L, R] = u(!1), [z, B] = u(!1), [V, H] = u(!1), [re, ie] = u(/* @__PURE__ */ new Date()), [U, W] = u([]);
+	l(() => {
+		b && b?.length > 0 && !v && (console.log("Ad Mounted or reduxAds changed"), y(e.ad_id || b[E(0, b?.length - 1)]?._id));
+	}, [b]), l(() => {}, [k]), l(() => {
+		k?.populated_promos && F >= 0 && P(k?.populated_promos[F]);
+	}, [F, k]);
+	function G() {
+		B(!z);
+	}
+	let { ref: K, inView: q, entry: ae } = d({
+		threshold: 0,
+		triggerOnce: !0
+	});
+	function J(e) {
+		if (t && console.log("Preventing this event from being logged as this ad is being shown in preview mode."), U.find((t) => t == e)) {
+			console.log("Already logged this event");
+			return;
+		}
+		let n = new URLSearchParams({
+			ad_id: k?._id,
+			event: e
+		}).toString();
+		fetch(`/api/ads/event?${n}`).then(function(e) {
+			return e.json();
+		}).then(function(t) {
+			W([...U, e]), console.log(t);
+		}).catch(function(e) {
+			console.log(e);
+		});
+	}
+	l(() => {
+		if (!t && (console.log("inView", q), q && v)) {
+			let e = [{
+				ad_id: v,
+				date: (/* @__PURE__ */ new Date()).toString()
+			}, ...g.filter((e) => {
+				if (console.log(p(/* @__PURE__ */ new Date(), new Date(e.date))), p(/* @__PURE__ */ new Date(), new Date(e.date)) > 5) {
+					console.log("adsViewed - Remove Old Ad View Object");
+					return;
+				} else return console.log("adsViewed - Keep Ad View Object"), e;
+			})];
+			console.log("unexpiredRecentViews", e);
+		}
+	}, [q, v]);
+	let [Y, X] = u(null), [Z, Q] = u(!1);
+	function $() {
+		Q(!0), console.log("logAdAvoided called", s);
+		let e = process.env.NODE_ENV === "development" ? "http://localhost:3001/api/user/advertising/avoided" : "https://articles.media/api/user/advertising/avoided", t = new URLSearchParams({ user_id: c?._id }).toString();
+		fetch(`${e}?${t}`, { headers: { "x-articles-api-key": s } }).then(function(e) {
+			return e.json();
+		}).then(function(e) {
+			Q(!1), X(e.avoided_count), console.log(e);
+		}).catch(function(e) {
+			console.log(e), Q(!1);
+		});
+	}
+	return l(() => {
+		t || (console.log("inView", q), c?.articles_membership?.status == "Active" && q && $("Ad Avoided"));
+	}, [q, c]), f ? null : /* @__PURE__ */ (0, S.jsxs)("div", {
+		ref: K,
+		className: (0, C.default)("ad-wrap", { "active-member": c?.articles_membership?.status == "Active" }),
+		style: {
+			"--articles-ad-background-color": A.background_color || k?.background_color,
+			"--articles-ad-font-color": A.font_color || k?.font_color,
+			"--articles-ad-border-color": A.border_color || k?.border_color
+		},
+		children: [
+			z && /* @__PURE__ */ (0, S.jsx)(w, {
+				setModalShow: B,
+				ad: k,
+				previewData: A
+			}),
+			V && /* @__PURE__ */ (0, S.jsx)(T, {
+				setModalShow: H,
+				ad: k,
+				previewData: A
+			}),
+			m && /* @__PURE__ */ (0, S.jsx)("div", {
+				className: "prepend-container",
+				children: m
+			}),
+			/* @__PURE__ */ (0, S.jsxs)("div", {
+				className: "ad",
+				children: [c?.articles_membership?.status !== "Active" && /* @__PURE__ */ (0, S.jsxs)("div", {
+					className: "main-panel",
+					children: [
+						/* @__PURE__ */ (0, S.jsx)("div", {
+							className: "ad-warning flex-header",
+							children: /* @__PURE__ */ (0, S.jsxs)("div", {
+								className: "",
+								children: [k?.city && "Local", " Advertisement"]
+							})
+						}),
+						/* @__PURE__ */ (0, S.jsxs)("div", {
+							className: "content-wrap",
+							children: [/* @__PURE__ */ (0, S.jsxs)("div", {
+								className: "photo-banner",
+								children: [
+									/* @__PURE__ */ (0, S.jsx)("div", {
+										className: "logo",
+										children: (A.logo?.location || k?.logo?.location) && /* @__PURE__ */ (0, S.jsx)("img", {
+											src: A?.logo?.key ? `${process.env.NEXT_PUBLIC_CDN}${A?.logo?.key}` : `${process.env.NEXT_PUBLIC_CDN}${k?.logo?.key}`,
+											alt: ""
+										})
+									}),
+									/* @__PURE__ */ (0, S.jsx)("div", {
+										className: "icon d-none",
+										children: /* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-mug-hot" })
+									}),
+									/* @__PURE__ */ (0, S.jsx)("img", {
+										className: "photo",
+										src: A?.background?.key ? `${process.env.NEXT_PUBLIC_CDN}${A.background?.key}` : `${process.env.NEXT_PUBLIC_CDN}${k?.background?.key}`,
+										alt: ""
+									})
+								]
+							}), /* @__PURE__ */ (0, S.jsxs)("div", {
+								className: "details-wrap",
+								children: [
+									/* @__PURE__ */ (0, S.jsxs)("div", {
+										className: "detail-title",
+										children: [/* @__PURE__ */ (0, S.jsx)("div", {
+											className: "detail",
+											children: /* @__PURE__ */ (0, S.jsx)("span", {
+												className: "h4",
+												children: A?.business || k?.business
+											})
+										}), /* @__PURE__ */ (0, S.jsxs)("div", {
+											className: "flex flex-column d-none",
+											children: [/* @__PURE__ */ (0, S.jsxs)("div", {
+												className: "detail",
+												children: [/* @__PURE__ */ (0, S.jsx)("span", {
+													className: "icon",
+													children: /* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-search-location" })
+												}), /* @__PURE__ */ (0, S.jsxs)("span", { children: [
+													k?.city,
+													", ",
+													k?.state
+												] })]
+											}), /* @__PURE__ */ (0, S.jsxs)("div", {
+												className: "detail",
+												children: [/* @__PURE__ */ (0, S.jsx)("span", {
+													className: "icon",
+													children: /* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-clock me-2" })
+												}), /* @__PURE__ */ (0, S.jsx)("span", { children: "6:30AM–8PM" })]
+											})]
+										})]
+									}),
+									k?.city && /* @__PURE__ */ (0, S.jsx)("div", { className: "details mb-3 d-none" }),
+									/* @__PURE__ */ (0, S.jsx)("div", {
+										className: "short-description",
+										children: A?.description || k?.description
+									})
+								]
+							})]
+						}),
+						(!1)?.roles?.isDev && k?.populated_promos?.length > 0 && /* @__PURE__ */ (0, S.jsxs)("div", { children: [N && /* @__PURE__ */ (0, S.jsx)("div", {
+							className: "promos-wrap",
+							children: N && /* @__PURE__ */ (0, S.jsxs)("div", {
+								className: "promo-wrap d-flex justify-content-between align-items-center mx-2 p-1 px-2 border border-2 border-light mb-0",
+								children: [/* @__PURE__ */ (0, S.jsxs)("div", {
+									className: "",
+									children: [/* @__PURE__ */ (0, S.jsx)("div", { children: N.title }), /* @__PURE__ */ (0, S.jsx)("div", {
+										className: "small",
+										children: /* @__PURE__ */ (0, S.jsx)("div", {
+											className: "small",
+											children: N.details
+										})
+									})]
+								}), /* @__PURE__ */ (0, S.jsx)(r, {
+									className: "px-3",
+									small: !0,
+									onClick: () => {
+										console.log("Load Save Modal"), R(!0);
+									},
+									children: "Save"
+								})]
+							}, N._id)
+						}), /* @__PURE__ */ (0, S.jsxs)("div", {
+							className: "d-flex justify-content-between",
+							children: [/* @__PURE__ */ (0, S.jsxs)("div", {
+								className: "px-2",
+								children: [k?.populated_promos?.length, " Promos Active"]
+							}), /* @__PURE__ */ (0, S.jsxs)("div", {
+								className: "controls",
+								children: [
+									/* @__PURE__ */ (0, S.jsx)("i", {
+										className: "fad fa-arrow-circle-left",
+										type: "button",
+										onClick: () => {
+											I(F == 0 ? k?.populated_promos?.length - 1 : (e) => e - 1);
+										}
+									}),
+									k?.populated_promos?.map((e, t) => /* @__PURE__ */ (0, S.jsx)("i", { className: `fa-square ${t == F ? "fad" : "fas"}` }, e._id)),
+									/* @__PURE__ */ (0, S.jsx)("i", {
+										className: "fad fa-arrow-circle-right",
+										type: "button",
+										onClick: () => {
+											F == k?.populated_promos?.length - 1 ? I(0) : I((e) => e + 1);
+										}
+									})
+								]
+							})]
+						})] }),
+						/* @__PURE__ */ (0, S.jsx)("hr", {
+							style: { borderColor: "white" },
+							className: "mt-auto mb-0"
+						}),
+						/* @__PURE__ */ (0, S.jsxs)("div", {
+							className: "action-wrap d-flex justify-content-lg-between px-3 py-2",
+							children: [
+								/* @__PURE__ */ (0, S.jsx)("div", {
+									onClick: () => {
+										G(), J("Details");
+									},
+									className: "action flex-grow-1 flex-shrink-0",
+									children: "Details"
+								}),
+								/* @__PURE__ */ (0, S.jsx)("span", { className: "px-4" }),
+								/* @__PURE__ */ (0, S.jsx)("a", {
+									className: "action flex-grow-1 flex-shrink-0",
+									href: k?.website,
+									target: "_blank",
+									rel: "noreferrer",
+									onClick: (e) => {
+										e.preventDefault(), H(!0), J("Confirm Exit Modal Opened");
+									},
+									children: /* @__PURE__ */ (0, S.jsx)("div", { children: "Website" })
+								})
+							]
+						})
+					]
+				}), c?.articles_membership?.status == "Active" && /* @__PURE__ */ (0, S.jsx)("div", {
+					className: "main-panel",
+					children: /* @__PURE__ */ (0, S.jsxs)("div", {
+						className: "content-wrap",
+						children: [/* @__PURE__ */ (0, S.jsxs)("div", {
+							className: "photo-banner",
+							children: [
+								/* @__PURE__ */ (0, S.jsx)("div", { className: "logo" }),
+								/* @__PURE__ */ (0, S.jsxs)("div", {
+									className: "splash",
+									children: [/* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-broadcast-tower" }), /* @__PURE__ */ (0, S.jsxs)("div", {
+										className: "text",
+										children: [/* @__PURE__ */ (0, S.jsx)("div", {
+											className: "count",
+											children: Z ? /* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-spinner fa-spin me-0" }) : Y ? o(Y) : 0
+										}), /* @__PURE__ */ (0, S.jsx)("div", {
+											className: "label",
+											children: "ads avoided."
+										})]
+									})]
+								}),
+								/* @__PURE__ */ (0, S.jsxs)("div", {
+									className: "member-since",
+									children: ["Member since: ", /* @__PURE__ */ (0, S.jsx)(a, {
+										format: "PP",
+										date: c?.articles_membership?.membership_started
+									})]
+								})
+							]
+						}), /* @__PURE__ */ (0, S.jsxs)("div", {
+							className: "details-wrap",
+							children: [/* @__PURE__ */ (0, S.jsx)("div", {
+								className: "detail-title",
+								children: /* @__PURE__ */ (0, S.jsx)("div", {
+									className: "detail",
+									children: /* @__PURE__ */ (0, S.jsx)("span", {
+										className: "h4",
+										children: "Thanks for the support!"
+									})
+								})
+							}), /* @__PURE__ */ (0, S.jsxs)("div", {
+								className: "short-description",
+								children: [/* @__PURE__ */ (0, S.jsx)("div", {
+									className: "mb-2",
+									children: "Without support from users like you, we wouldn't be here."
+								}), /* @__PURE__ */ (0, S.jsxs)("div", {
+									className: "links-list",
+									children: [
+										/* @__PURE__ */ (0, S.jsxs)(i, {
+											newPage: !0,
+											className: "link-item",
+											href: "https://articles.media/messages",
+											children: [/* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-comments-alt" }), "0 unread messages."]
+										}),
+										/* @__PURE__ */ (0, S.jsxs)(i, {
+											newPage: !0,
+											className: "link-item",
+											href: "https://articles.media/settings/notifications",
+											onClick: () => {
+												$();
+											},
+											children: [/* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-bell" }), "0 notifications."]
+										}),
+										/* @__PURE__ */ (0, S.jsxs)(i, {
+											newPage: !0,
+											className: "link-item",
+											href: "https://articles.media/settings/account",
+											children: [/* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-cog" }), "Manage account settings."]
+										})
+									]
+								})]
+							})]
+						})]
+					})
+				})]
+			}),
+			h && /* @__PURE__ */ (0, S.jsx)("div", {
+				className: "append-container",
+				children: h
+			}),
+			!t && /* @__PURE__ */ (0, S.jsx)("div", {
+				className: "advertise-with-us p-1",
+				style: {
+					backgroundColor: A.background_color || k?.background_color,
+					color: A.font_color || k?.font_color,
+					borderColor: A.border_color || k?.border_color
+				},
+				children: /* @__PURE__ */ (0, S.jsxs)(i, {
+					className: "small d-block w-100 text-center",
+					href: "https://articles.media/advertising",
+					newPage: !0,
+					children: [/* @__PURE__ */ (0, S.jsx)("i", { className: "fas fa-share me-1" }), "Advertise with Articles Media!"]
+				})
+			})
+		]
+	});
+}
+var O = c(D);
+//#endregion
+export { O as t };

package/dist/Ad-DYtftKNV.cjs

@@ -0,0 +1 @@
+const e=require(`./chunk-350yNsax.cjs`),t=require(`./classnames-pS64X3rL.cjs`),n=require(`./jsx-runtime-hCcDh67y.cjs`),r=require(`./Button-CbpRj01E.cjs`),i=require(`./Link-c7exNCJ3.cjs`),a=require(`./numberWithCommas-D9tgiUnq.cjs`);let o=require(`react`),s=require(`react-intersection-observer`),c=require(`swr`);c=e.n(c);let l=require(`date-fns`);var u=async e=>{if(process.env.NODE_ENV===`development`)try{let t=new URLSearchParams({ad_id:e.ad_id,user_ad_token:e.user_ad_token}).toString();return(await(await fetch(`http://localhost:3001/api/ads/${e.ad_id}?${t}`)).json()).result}catch{}let t=new URLSearchParams({ad_id:e.ad_id}).toString();return fetch(`${e.url}?${t}`).then(e=>e.json()).then(e=>e.result)},d={dedupingInterval:1e3*60*60},f=(e,t)=>{let{data:n,error:r,isLoading:i,mutate:a}=(0,c.default)(e?{url:`https://articles.media/api/ads/${e}`,ad_id:e,user_ad_token:t}:null,u,d);return{data:n,error:r,isLoading:i,mutate:a}},p=async e=>{if(process.env.NODE_ENV===`development`)try{return await(await fetch(`http://localhost:3001/api/ads`)).json()}catch{}return fetch(e.url).then(e=>e.json())},m=60,h={dedupingInterval:(0,l.minutesToMilliseconds)(m),focusThrottleInterval:(0,l.minutesToMilliseconds)(m)},g=e=>{let{data:t,error:n,isLoading:r,mutate:i}=(0,c.default)(e?.loading||e?.disabled?null:{url:`https://articles.media/api/ads`},p,h);return{data:t,error:n,isLoading:r,mutate:i}},_=n.t(),v=e.n(t.t(),1),y=(0,o.lazy)(()=>Promise.resolve().then(()=>require(`./AdDetailsModal-g0n7LiV6.cjs`))),b=(0,o.lazy)(()=>Promise.resolve().then(()=>require(`./AdConfirmExitModal-CRCnzYQM.cjs`)));function x(e,t){return Math.floor(Math.random()*(t-e+1))+e}function S(e){let{previewMode:t,darkMode:n,user_ad_token:c,userDetails:u,userDetailsLoading:d,prepend:p,append:m}=e,h=[],[S,C]=(0,o.useState)(null),{data:w,isLoading:T,mutate:E}=g({loading:d,disabled:u?.articles_membership?.status==`Active`}),{data:D,isLoading:O}=f(S,c),k=e.previewData||{},[ee,te]=(0,o.useState)(null),[ne,A]=(0,o.useState)(null),[j,M]=(0,o.useState)(null),[N,P]=(0,o.useState)(0),[F,I]=(0,o.useState)(!1),[L,R]=(0,o.useState)(!1),[z,B]=(0,o.useState)(!1),[V,H]=(0,o.useState)(new Date),[U,W]=(0,o.useState)([]);(0,o.useEffect)(()=>{w&&w?.length>0&&!S&&(console.log(`Ad Mounted or reduxAds changed`),C(e.ad_id||w[x(0,w?.length-1)]?._id))},[w]),(0,o.useEffect)(()=>{},[D]),(0,o.useEffect)(()=>{D?.populated_promos&&N>=0&&M(D?.populated_promos[N])},[N,D]);function G(){R(!L)}let{ref:K,inView:q,entry:re}=(0,s.useInView)({threshold:0,triggerOnce:!0});function J(e){if(t&&console.log(`Preventing this event from being logged as this ad is being shown in preview mode.`),U.find(t=>t==e)){console.log(`Already logged this event`);return}let n=new URLSearchParams({ad_id:D?._id,event:e}).toString();fetch(`/api/ads/event?${n}`).then(function(e){return e.json()}).then(function(t){W([...U,e]),console.log(t)}).catch(function(e){console.log(e)})}(0,o.useEffect)(()=>{if(!t&&(console.log(`inView`,q),q&&S)){let e=[{ad_id:S,date:new Date().toString()},...h.filter(e=>{if(console.log((0,l.differenceInMinutes)(new Date,new Date(e.date))),(0,l.differenceInMinutes)(new Date,new Date(e.date))>5){console.log(`adsViewed - Remove Old Ad View Object`);return}else return console.log(`adsViewed - Keep Ad View Object`),e})];console.log(`unexpiredRecentViews`,e)}},[q,S]);let[Y,X]=(0,o.useState)(null),[Z,Q]=(0,o.useState)(!1);function $(){Q(!0),console.log(`logAdAvoided called`,c);let e=process.env.NODE_ENV===`development`?`http://localhost:3001/api/user/advertising/avoided`:`https://articles.media/api/user/advertising/avoided`,t=new URLSearchParams({user_id:u?._id}).toString();fetch(`${e}?${t}`,{headers:{"x-articles-api-key":c}}).then(function(e){return e.json()}).then(function(e){Q(!1),X(e.avoided_count),console.log(e)}).catch(function(e){console.log(e),Q(!1)})}return(0,o.useEffect)(()=>{t||(console.log(`inView`,q),u?.articles_membership?.status==`Active`&&q&&$(`Ad Avoided`))},[q,u]),d?null:(0,_.jsxs)(`div`,{ref:K,className:(0,v.default)(`ad-wrap`,{"active-member":u?.articles_membership?.status==`Active`}),style:{"--articles-ad-background-color":k.background_color||D?.background_color,"--articles-ad-font-color":k.font_color||D?.font_color,"--articles-ad-border-color":k.border_color||D?.border_color},children:[L&&(0,_.jsx)(y,{setModalShow:R,ad:D,previewData:k}),z&&(0,_.jsx)(b,{setModalShow:B,ad:D,previewData:k}),p&&(0,_.jsx)(`div`,{className:`prepend-container`,children:p}),(0,_.jsxs)(`div`,{className:`ad`,children:[u?.articles_membership?.status!==`Active`&&(0,_.jsxs)(`div`,{className:`main-panel`,children:[(0,_.jsx)(`div`,{className:`ad-warning flex-header`,children:(0,_.jsxs)(`div`,{className:``,children:[D?.city&&`Local`,` Advertisement`]})}),(0,_.jsxs)(`div`,{className:`content-wrap`,children:[(0,_.jsxs)(`div`,{className:`photo-banner`,children:[(0,_.jsx)(`div`,{className:`logo`,children:(k.logo?.location||D?.logo?.location)&&(0,_.jsx)(`img`,{src:k?.logo?.key?`${process.env.NEXT_PUBLIC_CDN}${k?.logo?.key}`:`${process.env.NEXT_PUBLIC_CDN}${D?.logo?.key}`,alt:``})}),(0,_.jsx)(`div`,{className:`icon d-none`,children:(0,_.jsx)(`i`,{className:`fas fa-mug-hot`})}),(0,_.jsx)(`img`,{className:`photo`,src:k?.background?.key?`${process.env.NEXT_PUBLIC_CDN}${k.background?.key}`:`${process.env.NEXT_PUBLIC_CDN}${D?.background?.key}`,alt:``})]}),(0,_.jsxs)(`div`,{className:`details-wrap`,children:[(0,_.jsxs)(`div`,{className:`detail-title`,children:[(0,_.jsx)(`div`,{className:`detail`,children:(0,_.jsx)(`span`,{className:`h4`,children:k?.business||D?.business})}),(0,_.jsxs)(`div`,{className:`flex flex-column d-none`,children:[(0,_.jsxs)(`div`,{className:`detail`,children:[(0,_.jsx)(`span`,{className:`icon`,children:(0,_.jsx)(`i`,{className:`fas fa-search-location`})}),(0,_.jsxs)(`span`,{children:[D?.city,`, `,D?.state]})]}),(0,_.jsxs)(`div`,{className:`detail`,children:[(0,_.jsx)(`span`,{className:`icon`,children:(0,_.jsx)(`i`,{className:`fas fa-clock me-2`})}),(0,_.jsx)(`span`,{children:`6:30AM–8PM`})]})]})]}),D?.city&&(0,_.jsx)(`div`,{className:`details mb-3 d-none`}),(0,_.jsx)(`div`,{className:`short-description`,children:k?.description||D?.description})]})]}),(!1)?.roles?.isDev&&D?.populated_promos?.length>0&&(0,_.jsxs)(`div`,{children:[j&&(0,_.jsx)(`div`,{className:`promos-wrap`,children:j&&(0,_.jsxs)(`div`,{className:`promo-wrap d-flex justify-content-between align-items-center mx-2 p-1 px-2 border border-2 border-light mb-0`,children:[(0,_.jsxs)(`div`,{className:``,children:[(0,_.jsx)(`div`,{children:j.title}),(0,_.jsx)(`div`,{className:`small`,children:(0,_.jsx)(`div`,{className:`small`,children:j.details})})]}),(0,_.jsx)(r.t,{className:`px-3`,small:!0,onClick:()=>{console.log(`Load Save Modal`),I(!0)},children:`Save`})]},j._id)}),(0,_.jsxs)(`div`,{className:`d-flex justify-content-between`,children:[(0,_.jsxs)(`div`,{className:`px-2`,children:[D?.populated_promos?.length,` Promos Active`]}),(0,_.jsxs)(`div`,{className:`controls`,children:[(0,_.jsx)(`i`,{className:`fad fa-arrow-circle-left`,type:`button`,onClick:()=>{P(N==0?D?.populated_promos?.length-1:e=>e-1)}}),D?.populated_promos?.map((e,t)=>(0,_.jsx)(`i`,{className:`fa-square ${t==N?`fad`:`fas`}`},e._id)),(0,_.jsx)(`i`,{className:`fad fa-arrow-circle-right`,type:`button`,onClick:()=>{N==D?.populated_promos?.length-1?P(0):P(e=>e+1)}})]})]})]}),(0,_.jsx)(`hr`,{style:{borderColor:`white`},className:`mt-auto mb-0`}),(0,_.jsxs)(`div`,{className:`action-wrap d-flex justify-content-lg-between px-3 py-2`,children:[(0,_.jsx)(`div`,{onClick:()=>{G(),J(`Details`)},className:`action flex-grow-1 flex-shrink-0`,children:`Details`}),(0,_.jsx)(`span`,{className:`px-4`}),(0,_.jsx)(`a`,{className:`action flex-grow-1 flex-shrink-0`,href:D?.website,target:`_blank`,rel:`noreferrer`,onClick:e=>{e.preventDefault(),B(!0),J(`Confirm Exit Modal Opened`)},children:(0,_.jsx)(`div`,{children:`Website`})})]})]}),u?.articles_membership?.status==`Active`&&(0,_.jsx)(`div`,{className:`main-panel`,children:(0,_.jsxs)(`div`,{className:`content-wrap`,children:[(0,_.jsxs)(`div`,{className:`photo-banner`,children:[(0,_.jsx)(`div`,{className:`logo`}),(0,_.jsxs)(`div`,{className:`splash`,children:[(0,_.jsx)(`i`,{className:`fas fa-broadcast-tower`}),(0,_.jsxs)(`div`,{className:`text`,children:[(0,_.jsx)(`div`,{className:`count`,children:Z?(0,_.jsx)(`i`,{className:`fas fa-spinner fa-spin me-0`}):Y?a.t(Y):0}),(0,_.jsx)(`div`,{className:`label`,children:`ads avoided.`})]})]}),(0,_.jsxs)(`div`,{className:`member-since`,children:[`Member since: `,(0,_.jsx)(a.n,{format:`PP`,date:u?.articles_membership?.membership_started})]})]}),(0,_.jsxs)(`div`,{className:`details-wrap`,children:[(0,_.jsx)(`div`,{className:`detail-title`,children:(0,_.jsx)(`div`,{className:`detail`,children:(0,_.jsx)(`span`,{className:`h4`,children:`Thanks for the support!`})})}),(0,_.jsxs)(`div`,{className:`short-description`,children:[(0,_.jsx)(`div`,{className:`mb-2`,children:`Without support from users like you, we wouldn't be here.`}),(0,_.jsxs)(`div`,{className:`links-list`,children:[(0,_.jsxs)(i.t,{newPage:!0,className:`link-item`,href:`https://articles.media/messages`,children:[(0,_.jsx)(`i`,{className:`fas fa-comments-alt`}),`0 unread messages.`]}),(0,_.jsxs)(i.t,{newPage:!0,className:`link-item`,href:`https://articles.media/settings/notifications`,onClick:()=>{$()},children:[(0,_.jsx)(`i`,{className:`fas fa-bell`}),`0 notifications.`]}),(0,_.jsxs)(i.t,{newPage:!0,className:`link-item`,href:`https://articles.media/settings/account`,children:[(0,_.jsx)(`i`,{className:`fas fa-cog`}),`Manage account settings.`]})]})]})]})]})})]}),m&&(0,_.jsx)(`div`,{className:`append-container`,children:m}),!t&&(0,_.jsx)(`div`,{className:`advertise-with-us p-1`,style:{backgroundColor:k.background_color||D?.background_color,color:k.font_color||D?.font_color,borderColor:k.border_color||D?.border_color},children:(0,_.jsxs)(i.t,{className:`small d-block w-100 text-center`,href:`https://articles.media/advertising`,newPage:!0,children:[(0,_.jsx)(`i`,{className:`fas fa-share me-1`}),`Advertise with Articles Media!`]})})]})}var C=(0,o.memo)(S);Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return C}});

package/dist/Ad.cjs

@@ -1 +1 @@
-"use strict";const e=require("./jsx-runtime-nZSsnGb7.cjs"),c=require("react"),v=require("./numberWithCommas-CRgrb58X.cjs"),R=require("./index-Ddv_TnxK.cjs"),Z=require("./Button-0ZK0NKiK.cjs"),ee=require("./index-BlP2-uOi.cjs");function se(s){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const i in s)if(i!=="default"){const r=Object.getOwnPropertyDescriptor(s,i);Object.defineProperty(t,i,r.get?r:{enumerable:!0,get:()=>s[i]})}}return t.default=s,Object.freeze(t)}const A=se(c);var C=new Map,M=new WeakMap,W=0,te;function ne(s){return s?(M.has(s)||(W+=1,M.set(s,W.toString())),M.get(s)):"0"}function re(s){return Object.keys(s).sort().filter(t=>s[t]!==void 0).map(t=>`${t}_${t==="root"?ne(s.root):s[t]}`).toString()}function ie(s){const t=re(s);let i=C.get(t);if(!i){const r=new Map;let l;const u=new IntersectionObserver(x=>{x.forEach(o=>{var p;const N=o.isIntersecting&&l.some(j=>o.intersectionRatio>=j);s.trackVisibility&&typeof o.isVisible>"u"&&(o.isVisible=N),(p=r.get(o.target))==null||p.forEach(j=>{j(N,o)})})},s);l=u.thresholds||(Array.isArray(s.threshold)?s.threshold:[s.threshold||0]),i={id:t,observer:u,elements:r},C.set(t,i)}return i}function oe(s,t,i={},r=te){if(typeof window.IntersectionObserver>"u"&&r!==void 0){const p=s.getBoundingClientRect();return t(r,{isIntersecting:r,target:s,intersectionRatio:typeof i.threshold=="number"?i.threshold:0,time:0,boundingClientRect:p,intersectionRect:p,rootBounds:p}),()=>{}}const{id:l,observer:u,elements:x}=ie(i),o=x.get(s)||[];return x.has(s)||x.set(s,o),o.push(t),u.observe(s),function(){o.splice(o.indexOf(t),1),o.length===0&&(x.delete(s),u.unobserve(s)),x.size===0&&(u.disconnect(),C.delete(l))}}function ae({threshold:s,delay:t,trackVisibility:i,rootMargin:r,root:l,triggerOnce:u,skip:x,initialInView:o,fallbackInView:p,onChange:N}={}){var j;const[_,b]=A.useState(null),n=A.useRef(N),a=A.useRef(o),[k,D]=A.useState({inView:!!o,entry:void 0});n.current=N,A.useEffect(()=>{if(a.current===void 0&&(a.current=o),x||!_)return;let g;return g=oe(_,(f,E)=>{const P=a.current;a.current=f,!(P===void 0&&!f)&&(D({inView:f,entry:E}),n.current&&n.current(f,E),E.isIntersecting&&u&&g&&(g(),g=void 0))},{root:l,rootMargin:r,threshold:s,trackVisibility:i,delay:t},p),()=>{g&&g()}},[Array.isArray(s)?s.toString():s,_,l,r,u,x,i,p,t]);const y=(j=k.entry)==null?void 0:j.target,S=A.useRef(void 0);!_&&y&&!u&&!x&&S.current!==y&&(S.current=y,D({inView:!!o,entry:void 0}),a.current=o);const m=[b,k.inView,k.entry];return m.ref=m[0],m.inView=m[1],m.entry=m[2],m}const ce=async s=>{if(process.env.NODE_ENV==="development")try{return(await R.axios.get(`http://localhost:3001/api/ads/${s.ad_id}`,{params:{ad_id:s.ad_id,user_ad_token:s.user_ad_token}})).data.result}catch{}return R.axios.get(s.url,{params:{ad_id:s.ad_id}}).then(t=>t.data.result)},le=60,de={dedupingInterval:1e3*60*le},ue=(s,t)=>{const{data:i,error:r,isLoading:l,mutate:u}=R.useSWR(s?{url:`https://articles.media/api/ads/${s}`,ad_id:s,user_ad_token:t}:null,ce,de);return{data:i,error:r,isLoading:l,mutate:u}};function xe(s){return t=>{const r=(s?Math[s]:Math.trunc)(t);return r===0?0:r}}function me(s,t){return+v.toDate(s)-+v.toDate(t)}function z(s,t,i){const r=me(s,t)/v.millisecondsInMinute;return xe(i?.roundingMethod)(r)}function U(s){return Math.trunc(s*v.millisecondsInMinute)}const pe=async s=>{if(process.env.NODE_ENV==="development")try{return(await R.axios.get("http://localhost:3001/api/ads",{params:{}})).data}catch{}return R.axios.get(s.url,{params:{}}).then(t=>t.data)},X=60,je={dedupingInterval:U(X),focusThrottleInterval:U(X)},fe=s=>{const{data:t,error:i,isLoading:r,mutate:l}=R.useSWR(s?.loading||s?.disabled?null:{url:"https://articles.media/api/ads"},pe,je);return{data:t,error:i,isLoading:r,mutate:l}},he=c.lazy(()=>Promise.resolve().then(()=>require("./AdDetailsModal-k840vrS2.cjs"))),ve=c.lazy(()=>Promise.resolve().then(()=>require("./AdConfirmExitModal-CcSxmXKT.cjs")));function ge(s,t){return Math.floor(Math.random()*(t-s+1))+s}function Ee(s){let{previewMode:t,darkMode:i,user_ad_token:r,userDetails:l,userDetailsLoading:u,prepend:x,append:o}=s;const p=!1,N=[],[j,_]=c.useState(null),{data:b}=fe({loading:u,disabled:l?.articles_membership?.status=="Active"}),{data:n}=ue(j,r);let a=s.previewData||{};const[k,D]=c.useState(null),[y,S]=c.useState(null),[m,g]=c.useState(null),[f,E]=c.useState(0),[P,K]=c.useState(!1),[$,L]=c.useState(!1),[F,O]=c.useState(!1),[Ne,be]=c.useState(new Date),[V,G]=c.useState([]);c.useEffect(()=>{b&&b?.length>0&&!j&&(console.log("Ad Mounted or reduxAds changed"),_(s.ad_id||b[ge(0,b?.length-1)]?._id))},[b]),c.useEffect(()=>{},[n]),c.useEffect(()=>{n?.populated_promos&&f>=0&&g(n?.populated_promos[f])},[f,n]);function H(){L(!$)}const{ref:J,inView:w}=ae({threshold:0,triggerOnce:!0});function T(d){if(t&&console.log("Preventing this event from being logged as this ad is being shown in preview mode."),V.find(h=>h==d)){console.log("Already logged this event");return}R.axios.get("/api/ads/event",{params:{ad_id:n?._id,event:d}}).then(function(h){G([...V,d]),console.log(h.data)}).catch(function(h){console.log(h)})}c.useEffect(()=>{if(!t&&(console.log("inView",w),w&&j)){let d=[{ad_id:j,date:new Date().toString()},...N.filter(h=>{if(console.log(z(new Date,new Date(h.date))),z(new Date,new Date(h.date))>5){console.log("adsViewed - Remove Old Ad View Object");return}else return console.log("adsViewed - Keep Ad View Object"),h})];console.log("unexpiredRecentViews",d)}},[w,j]);const[q,Q]=c.useState(null),[Y,I]=c.useState(!1);function B(){I(!0),console.log("logAdAvoided called",r),R.axios.get(process.env.NODE_ENV==="development"?"http://localhost:3001/api/user/advertising/avoided":"https://articles.media/api/user/advertising/avoided",{params:{user_id:l?._id},headers:{"x-articles-api-key":r}}).then(function(d){I(!1),Q(d.data.avoided_count),console.log(d.data)}).catch(function(d){console.log(d),I(!1)})}return c.useEffect(()=>{t||(console.log("inView",w),l?.articles_membership?.status=="Active"&&w&&B())},[w,l]),u?null:e.jsxRuntimeExports.jsxs("div",{ref:J,className:ee.classNames("ad-wrap",{"active-member":l?.articles_membership?.status=="Active"}),style:{"--articles-ad-background-color":a.background_color||n?.background_color,"--articles-ad-font-color":a.font_color||n?.font_color,"--articles-ad-border-color":a.border_color||n?.border_color},children:[$&&e.jsxRuntimeExports.jsx(he,{setModalShow:L,ad:n,previewData:a}),F&&e.jsxRuntimeExports.jsx(ve,{setModalShow:O,ad:n,previewData:a}),x&&e.jsxRuntimeExports.jsx("div",{className:"prepend-container",children:x}),e.jsxRuntimeExports.jsxs("div",{className:"ad",children:[l?.articles_membership?.status!=="Active"&&e.jsxRuntimeExports.jsxs("div",{className:"main-panel",children:[e.jsxRuntimeExports.jsx("div",{className:"ad-warning flex-header",children:e.jsxRuntimeExports.jsxs("div",{className:"",children:[n?.city&&"Local"," Advertisement"]})}),e.jsxRuntimeExports.jsxs("div",{className:"content-wrap",children:[e.jsxRuntimeExports.jsxs("div",{className:"photo-banner",children:[e.jsxRuntimeExports.jsx("div",{className:"logo",children:(a.logo?.location||n?.logo?.location)&&e.jsxRuntimeExports.jsx("img",{src:a?.logo?.key?`${process.env.NEXT_PUBLIC_CDN}${a?.logo?.key}`:`${process.env.NEXT_PUBLIC_CDN}${n?.logo?.key}`,alt:""})}),e.jsxRuntimeExports.jsx("div",{className:"icon d-none",children:e.jsxRuntimeExports.jsx("i",{className:"fas fa-mug-hot"})}),e.jsxRuntimeExports.jsx("img",{className:"photo",src:a?.background?.key?`${process.env.NEXT_PUBLIC_CDN}${a.background?.key}`:`${process.env.NEXT_PUBLIC_CDN}${n?.background?.key}`,alt:""})]}),e.jsxRuntimeExports.jsxs("div",{className:"details-wrap",children:[e.jsxRuntimeExports.jsxs("div",{className:"detail-title",children:[e.jsxRuntimeExports.jsx("div",{className:"detail",children:e.jsxRuntimeExports.jsx("span",{className:"h4",children:a?.business||n?.business})}),e.jsxRuntimeExports.jsxs("div",{className:"flex flex-column d-none",children:[e.jsxRuntimeExports.jsxs("div",{className:"detail",children:[e.jsxRuntimeExports.jsx("span",{className:"icon",children:e.jsxRuntimeExports.jsx("i",{className:"fas fa-search-location"})}),e.jsxRuntimeExports.jsxs("span",{children:[n?.city,", ",n?.state]})]}),e.jsxRuntimeExports.jsxs("div",{className:"detail",children:[e.jsxRuntimeExports.jsx("span",{className:"icon",children:e.jsxRuntimeExports.jsx("i",{className:"fas fa-clock me-2"})}),e.jsxRuntimeExports.jsx("span",{children:"6:30AM–8PM"})]})]})]}),n?.city&&e.jsxRuntimeExports.jsx("div",{className:"details mb-3 d-none"}),e.jsxRuntimeExports.jsx("div",{className:"short-description",children:a?.description||n?.description})]})]}),p?.roles?.isDev&&n?.populated_promos?.length>0&&e.jsxRuntimeExports.jsxs("div",{children:[m&&e.jsxRuntimeExports.jsx("div",{className:"promos-wrap",children:m&&e.jsxRuntimeExports.jsxs("div",{className:"promo-wrap d-flex justify-content-between align-items-center mx-2 p-1 px-2 border border-2 border-light mb-0",children:[e.jsxRuntimeExports.jsxs("div",{className:"",children:[e.jsxRuntimeExports.jsx("div",{children:m.title}),e.jsxRuntimeExports.jsx("div",{className:"small",children:e.jsxRuntimeExports.jsx("div",{className:"small",children:m.details})})]}),e.jsxRuntimeExports.jsx(Z.ArticlesButton,{className:"px-3",small:!0,onClick:()=>{console.log("Load Save Modal"),K(!0)},children:"Save"})]},m._id)}),e.jsxRuntimeExports.jsxs("div",{className:"d-flex justify-content-between",children:[e.jsxRuntimeExports.jsxs("div",{className:"px-2",children:[n?.populated_promos?.length," Promos Active"]}),e.jsxRuntimeExports.jsxs("div",{className:"controls",children:[e.jsxRuntimeExports.jsx("i",{className:"fad fa-arrow-circle-left",type:"button",onClick:()=>{f==0?E(n?.populated_promos?.length-1):E(d=>d-1)}}),n?.populated_promos?.map((d,h)=>e.jsxRuntimeExports.jsx("i",{className:`fa-square ${h==f?"fad":"fas"}`},d._id)),e.jsxRuntimeExports.jsx("i",{className:"fad fa-arrow-circle-right",type:"button",onClick:()=>{f==n?.populated_promos?.length-1?E(0):E(d=>d+1)}})]})]})]}),e.jsxRuntimeExports.jsx("hr",{style:{borderColor:"white"},className:"mt-auto mb-0"}),e.jsxRuntimeExports.jsxs("div",{className:"action-wrap d-flex justify-content-lg-between px-3 py-2",children:[e.jsxRuntimeExports.jsx("div",{onClick:()=>{H(),T("Details")},className:"action flex-grow-1 flex-shrink-0",children:"Details"}),e.jsxRuntimeExports.jsx("span",{className:"px-4"}),e.jsxRuntimeExports.jsx("a",{className:"action flex-grow-1 flex-shrink-0",href:n?.website,target:"_blank",rel:"noreferrer",onClick:d=>{d.preventDefault(),O(!0),T("Confirm Exit Modal Opened")},children:e.jsxRuntimeExports.jsx("div",{children:"Website"})})]})]}),l?.articles_membership?.status=="Active"&&e.jsxRuntimeExports.jsx("div",{className:"main-panel",children:e.jsxRuntimeExports.jsxs("div",{className:"content-wrap",children:[e.jsxRuntimeExports.jsxs("div",{className:"photo-banner",children:[e.jsxRuntimeExports.jsx("div",{className:"logo"}),e.jsxRuntimeExports.jsxs("div",{className:"splash",children:[e.jsxRuntimeExports.jsx("i",{className:"fas fa-broadcast-tower"}),e.jsxRuntimeExports.jsxs("div",{className:"text",children:[e.jsxRuntimeExports.jsx("div",{className:"count",children:Y?e.jsxRuntimeExports.jsx("i",{className:"fas fa-spinner fa-spin me-0"}):q?v.numberWithCommas(q):0}),e.jsxRuntimeExports.jsx("div",{className:"label",children:"ads avoided."})]})]}),e.jsxRuntimeExports.jsxs("div",{className:"member-since",children:["Member since: ",e.jsxRuntimeExports.jsx(v.ArticlesDate,{format:"PP",date:l?.articles_membership?.membership_started})]})]}),e.jsxRuntimeExports.jsxs("div",{className:"details-wrap",children:[e.jsxRuntimeExports.jsx("div",{className:"detail-title",children:e.jsxRuntimeExports.jsx("div",{className:"detail",children:e.jsxRuntimeExports.jsx("span",{className:"h4",children:"Thanks for the support!"})})}),e.jsxRuntimeExports.jsxs("div",{className:"short-description",children:[e.jsxRuntimeExports.jsx("div",{className:"mb-2",children:"Without support from users like you, we wouldn't be here."}),e.jsxRuntimeExports.jsxs("div",{className:"links-list",children:[e.jsxRuntimeExports.jsxs(v.Link,{newPage:!0,className:"link-item",href:"https://articles.media/messages",children:[e.jsxRuntimeExports.jsx("i",{className:"fas fa-comments-alt"}),"0 unread messages."]}),e.jsxRuntimeExports.jsxs(v.Link,{newPage:!0,className:"link-item",href:"https://articles.media/settings/notifications",onClick:()=>{B()},children:[e.jsxRuntimeExports.jsx("i",{className:"fas fa-bell"}),"0 notifications."]}),e.jsxRuntimeExports.jsxs(v.Link,{newPage:!0,className:"link-item",href:"https://articles.media/settings/account",children:[e.jsxRuntimeExports.jsx("i",{className:"fas fa-cog"}),"Manage account settings."]})]})]})]})]})})]}),o&&e.jsxRuntimeExports.jsx("div",{className:"append-container",children:o}),!t&&e.jsxRuntimeExports.jsx("div",{className:"advertise-with-us p-1",style:{backgroundColor:a.background_color||n?.background_color,color:a.font_color||n?.font_color,borderColor:a.border_color||n?.border_color},children:e.jsxRuntimeExports.jsxs(v.Link,{className:"small d-block w-100 text-center",href:"https://articles.media/advertising",newPage:!0,children:[e.jsxRuntimeExports.jsx("i",{className:"fas fa-share me-1"}),"Advertise with Articles Media!"]})})]})}const Re=c.memo(Ee);module.exports=Re;
+const e=require(`./Ad-DYtftKNV.cjs`);module.exports=e.t;