- SendouQ Season 1 Finale tournament featuring Jackpot, FTWin, Starburst,
- Alliance Rogue and more top level teams! Catch the action{" "}
-
- via IPL
- {" "}
- on Sunday 3rd @ 10AM PST / 1PM EST / 6PM GMT
-
+ {happeningNow
+ ? t("common:showcase.bracket")
+ : t("common:showcase.register")}
+
+ )}
+
);
}
diff --git a/app/features/tournament/TournamentRepository.server.ts b/app/features/tournament/TournamentRepository.server.ts
index b96adacf2..ae2454422 100644
--- a/app/features/tournament/TournamentRepository.server.ts
+++ b/app/features/tournament/TournamentRepository.server.ts
@@ -182,6 +182,58 @@ export async function findById(id: number) {
};
}
+const NEXT_TOURNAMENTS_TO_SHOW_WITH_UPCOMING = 2;
+export async function forShowcase() {
+ const rows = await db
+ .selectFrom("Tournament")
+ .innerJoin("CalendarEvent", "Tournament.id", "CalendarEvent.tournamentId")
+ .innerJoin(
+ "CalendarEventDate",
+ "CalendarEvent.id",
+ "CalendarEventDate.eventId",
+ )
+ .select((eb) => [
+ "Tournament.id",
+ "CalendarEvent.name",
+ "CalendarEventDate.startTime",
+ jsonArrayFrom(
+ eb
+ .selectFrom("TournamentResult")
+ .innerJoin("User", "TournamentResult.userId", "User.id")
+ .innerJoin(
+ "TournamentTeam",
+ "TournamentResult.tournamentTeamId",
+ "TournamentTeam.id",
+ )
+ .whereRef("TournamentResult.tournamentId", "=", "Tournament.id")
+ .where("TournamentResult.placement", "=", 1)
+ .select([
+ "User.id",
+ "User.discordName",
+ "TournamentTeam.name as teamName",
+ ]),
+ ).as("firstPlacers"),
+ ])
+ .orderBy("CalendarEventDate.startTime desc")
+ .execute();
+
+ const latestWinners = rows.find((r) => r.firstPlacers.length > 0);
+ const next: typeof rows = [];
+
+ const nextTournamentsCount = latestWinners
+ ? NEXT_TOURNAMENTS_TO_SHOW_WITH_UPCOMING
+ : NEXT_TOURNAMENTS_TO_SHOW_WITH_UPCOMING + 1;
+
+ for (const row of rows) {
+ if (row.id === latestWinners?.id) break;
+ next.unshift(row);
+
+ if (next.length > nextTournamentsCount) next.pop();
+ }
+
+ return [latestWinners, ...next].filter(Boolean);
+}
+
export async function findCastTwitchAccountsByTournamentId(
tournamentId: number,
) {
diff --git a/app/features/tournament/tournament-utils.ts b/app/features/tournament/tournament-utils.ts
index 8fd2b468e..0f3932dd3 100644
--- a/app/features/tournament/tournament-utils.ts
+++ b/app/features/tournament/tournament-utils.ts
@@ -79,6 +79,36 @@ export function HACKY_resolvePicture(event: { name: string }) {
return tournamentLogoUrl("default");
}
+const BLACK = "#1e1e1e";
+const WHITE = "#fffcfc";
+export function HACKY_resolveThemeColors(event: { name: string }) {
+ if (HACKY_isInviteOnlyEvent(event)) {
+ return { bg: "#1e1e1e", text: WHITE };
+ }
+
+ if (event.name.includes("Paddling Pool")) {
+ return { bg: "#fff", text: BLACK };
+ }
+
+ if (event.name.includes("In The Zone")) {
+ return { bg: "#8b0000", text: BLACK };
+ }
+
+ if (event.name.includes("PICNIC")) {
+ return { bg: "#e3fefe", text: BLACK };
+ }
+
+ if (event.name.includes("Proving Grounds")) {
+ return { bg: "#ffe809", text: BLACK };
+ }
+
+ if (event.name.includes("Triton")) {
+ return { bg: "#aee8ff", text: BLACK };
+ }
+
+ return { bg: "#3430ad", text: WHITE };
+}
+
const HACKY_isSendouQSeasonFinale = (event: { name: string }) =>
event.name.includes("Finale");
diff --git a/app/root.tsx b/app/root.tsx
index fc69618a4..4167476f5 100644
--- a/app/root.tsx
+++ b/app/root.tsx
@@ -24,7 +24,11 @@ import { type SendouRouteHandle } from "~/utils/remix";
import { Catcher } from "./components/Catcher";
import { ConditionalScrollRestoration } from "./components/ConditionalScrollRestoration";
import { Layout } from "./components/layout";
-import { CUSTOMIZED_CSS_VARS_NAME } from "./constants";
+import {
+ CUSTOMIZED_CSS_VARS_NAME,
+ ONE_HOUR_IN_MS,
+ TEN_MINUTES_IN_MS,
+} from "./constants";
import { getUser } from "./features/auth/core/user.server";
import {
Theme,
@@ -39,6 +43,9 @@ import { DEFAULT_LANGUAGE } from "./modules/i18n/config";
import i18next, { i18nCookie } from "./modules/i18n/i18next.server";
import { browserTimingHeader } from "./utils/newrelic.server";
import { COMMON_PREVIEW_IMAGE } from "./utils/urls";
+import * as TournamentRepository from "~/features/tournament/TournamentRepository.server";
+import { cache, ttl } from "~/utils/cache.server";
+import cachified from "@epic-web/cachified";
import "nprogress/nprogress.css";
import "~/styles/common.css";
@@ -80,6 +87,15 @@ export const loader = async ({ request }: LoaderFunctionArgs) => {
locale,
theme: themeSession.getTheme(),
patrons: await UserRepository.findAllPatrons(),
+ tournaments: await cachified({
+ key: "tournament-showcase",
+ cache,
+ ttl: ttl(TEN_MINUTES_IN_MS),
+ staleWhileRevalidate: ttl(ONE_HOUR_IN_MS),
+ async getFreshValue() {
+ return TournamentRepository.forShowcase();
+ },
+ }),
baseUrl: process.env["BASE_URL"]!,
skalopUrl: process.env["SKALOP_WS_URL"]!,
publisherId: process.env["PLAYWIRE_PUBLISHER_ID"],
diff --git a/app/styles/front.css b/app/styles/front.css
index f20951a8f..a854028f3 100644
--- a/app/styles/front.css
+++ b/app/styles/front.css
@@ -1,19 +1,3 @@
-.front__top-banner {
- border-radius: var(--rounded);
- background: linear-gradient(to right, #4568dc, #b06ab3);
- font-weight: var(--bold);
- color: var(--button-text);
- font-size: var(--fonts-sm);
- padding-block: var(--s-1);
- padding-inline: var(--s-2);
- text-align: center;
-}
-
-.front__top-banner__link {
- color: var(--button-text);
- text-decoration: underline;
-}
-
.front__nav-items-container {
display: flex;
margin: 0 auto;
@@ -131,3 +115,60 @@
display: none;
}
}
+
+.front__tournament-card {
+ background-color: var(--card-bg);
+ border-radius: var(--rounded-sm);
+ padding: var(--s-1) var(--s-2);
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ gap: var(--s-1);
+ color: var(--card-text) !important;
+}
+
+.front__tournament-card__time {
+ font-size: var(--fonts-xxs);
+ font-weight: var(--bold);
+ opacity: 0.8;
+ text-transform: capitalize;
+}
+
+.front__tournament-card__first-placers {
+ opacity: 0.8;
+ font-size: var(--fonts-xxs);
+ list-style: none;
+ display: flex;
+ padding-left: 0;
+ justify-content: center;
+ gap: var(--s-1-5);
+ flex-wrap: wrap;
+}
+
+.front__tournament-card__first-placers li {
+ max-width: 75px;
+ text-overflow: ellipsis;
+ overflow-x: hidden;
+ white-space: nowrap;
+}
+
+.front__tournament-card__name {
+ font-size: var(--fonts-sm);
+ font-weight: var(--bold);
+ text-align: center;
+ margin-top: -3px;
+}
+
+.front__tournament-card__register {
+ font-weight: var(--semi-bold);
+ font-size: var(--fonts-xs);
+ text-align: center;
+ border-radius: var(--rounded-sm);
+ border: 1.5px solid var(--card-text);
+ margin-block: auto var(--s-1);
+ max-width: 100px;
+ margin-inline: auto;
+ padding: var(--s-0-5) var(--s-3);
+ background-color: var(--card-text);
+ color: var(--card-bg);
+}
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 64fa20102..080d85ec4 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -215,5 +215,9 @@
"chat.systemMsg.cancelConfirmed": "{{name}} confirmed canceling the match. Match is now locked",
"chat.systemMsg.userLeft": "{{name}} left the group",
- "fc.title": "Friend code"
+ "fc.title": "Friend code",
+
+ "showcase.register": "Register",
+ "showcase.bracket": "Bracket",
+ "showcase.liveNow": "Live now!"
}