From c9e99d3852ed6794cc40ebcf4b2eda1ee57d5e20 Mon Sep 17 00:00:00 2001 From: bumyy Date: Thu, 7 Nov 2024 20:23:03 -0300 Subject: [PATCH 01/74] feat: migrated to scss --- src/renderer/src/app.scss | 130 +++++++++++++ src/renderer/src/app.tsx | 2 + .../src/components/backdrop/backdrop.css.ts | 54 ------ .../src/components/backdrop/backdrop.scss | 50 +++++ .../src/components/backdrop/backdrop.tsx | 9 +- .../checkbox-field/checkbox-field.css.ts | 41 ---- .../checkbox-field/checkbox-field.scss | 39 ++++ .../checkbox-field/checkbox-field.tsx | 10 +- .../confirmation-modal.css.ts | 13 -- .../confirmation-modal.scss | 17 ++ .../confirmation-modal/confirmation-modal.tsx | 8 +- .../src/components/game-card/game-card.css.ts | 106 ---------- .../src/components/game-card/game-card.scss | 102 ++++++++++ .../src/components/game-card/game-card.tsx | 27 +-- .../components/header/auto-update-header.scss | 32 +++ .../header/auto-update-sub-header.tsx | 23 ++- .../src/components/header/header.css.ts | 182 ------------------ .../src/components/header/header.scss | 132 +++++++++++++ src/renderer/src/components/header/header.tsx | 34 ++-- src/renderer/src/components/hero/hero.css.ts | 60 ------ src/renderer/src/components/hero/hero.scss | 56 ++++++ src/renderer/src/components/hero/hero.tsx | 14 +- src/renderer/src/components/link/link.css.ts | 9 - src/renderer/src/components/link/link.scss | 7 + src/renderer/src/components/link/link.tsx | 10 +- .../src/components/modal/modal.css.ts | 78 -------- src/renderer/src/components/modal/modal.scss | 77 ++++++++ src/renderer/src/components/modal/modal.tsx | 16 +- .../select-field/select-field.css.ts | 59 ------ .../components/select-field/select-field.scss | 49 +++++ .../components/select-field/select-field.tsx | 16 +- .../components/sidebar/sidebar-profile.css.ts | 79 -------- .../components/sidebar/sidebar-profile.scss | 77 ++++++++ .../components/sidebar/sidebar-profile.tsx | 16 +- .../src/components/sidebar/sidebar.css.ts | 126 ------------ .../src/components/sidebar/sidebar.scss | 110 +++++++++++ .../src/components/sidebar/sidebar.tsx | 44 +++-- .../components/text-field/text-field.css.ts | 89 --------- .../src/components/text-field/text-field.scss | 75 ++++++++ .../src/components/text-field/text-field.tsx | 35 ++-- .../src/components/toast/toast.css.ts | 87 --------- src/renderer/src/components/toast/toast.scss | 87 +++++++++ src/renderer/src/components/toast/toast.tsx | 23 ++- .../profile-content/profile-content.css.ts | 11 +- src/renderer/src/scss/globals.scss | 5 + 45 files changed, 1214 insertions(+), 1112 deletions(-) create mode 100644 src/renderer/src/app.scss delete mode 100644 src/renderer/src/components/backdrop/backdrop.css.ts create mode 100644 src/renderer/src/components/backdrop/backdrop.scss delete mode 100644 src/renderer/src/components/checkbox-field/checkbox-field.css.ts create mode 100644 src/renderer/src/components/checkbox-field/checkbox-field.scss delete mode 100644 src/renderer/src/components/confirmation-modal/confirmation-modal.css.ts create mode 100644 src/renderer/src/components/confirmation-modal/confirmation-modal.scss delete mode 100644 src/renderer/src/components/game-card/game-card.css.ts create mode 100644 src/renderer/src/components/game-card/game-card.scss create mode 100644 src/renderer/src/components/header/auto-update-header.scss delete mode 100644 src/renderer/src/components/header/header.css.ts create mode 100644 src/renderer/src/components/header/header.scss delete mode 100644 src/renderer/src/components/hero/hero.css.ts create mode 100644 src/renderer/src/components/hero/hero.scss delete mode 100644 src/renderer/src/components/link/link.css.ts create mode 100644 src/renderer/src/components/link/link.scss delete mode 100644 src/renderer/src/components/modal/modal.css.ts create mode 100644 src/renderer/src/components/modal/modal.scss delete mode 100644 src/renderer/src/components/select-field/select-field.css.ts create mode 100644 src/renderer/src/components/select-field/select-field.scss delete mode 100644 src/renderer/src/components/sidebar/sidebar-profile.css.ts create mode 100644 src/renderer/src/components/sidebar/sidebar-profile.scss delete mode 100644 src/renderer/src/components/sidebar/sidebar.css.ts create mode 100644 src/renderer/src/components/sidebar/sidebar.scss delete mode 100644 src/renderer/src/components/text-field/text-field.css.ts create mode 100644 src/renderer/src/components/text-field/text-field.scss delete mode 100644 src/renderer/src/components/toast/toast.css.ts create mode 100644 src/renderer/src/components/toast/toast.scss diff --git a/src/renderer/src/app.scss b/src/renderer/src/app.scss new file mode 100644 index 00000000..2f383d04 --- /dev/null +++ b/src/renderer/src/app.scss @@ -0,0 +1,130 @@ +@use "./scss/globals.scss"; + +* { + box-sizing: border-box; +} + +::-webkit-scrollbar { + width: 9px; + background-color: globals.$dark-background-color; +} + +::-webkit-scrollbar-track { + background-color: rgba(255, 255, 255, 0.03); +} + +::-webkit-scrollbar-thumb { + background-color: rgba(255, 255, 255, 0.08); + border-radius: 24px; +} + +::-webkit-scrollbar-thumb:hover { + background-color: rgba(255, 255, 255, 0.16); +} + +html, +body, +#root, +main { + height: 100%; +} + +body { + overflow: hidden; + user-select: none; + font-family: + Noto Sans, + sans-serif; + font-size: globals.$body-font-size; + color: globals.$body-color; + margin: 0; +} + +button { + padding: 0; + background-color: transparent; + border: none; + font-family: inherit; +} + +h1, +h2, +h3, +h4, +h5, +h6, +p { + margin: 0; +} + +p { + line-height: 20px; +} + +#root, +main { + display: flex; +} + +#root { + flex-direction: column; +} + +main { + overflow: hidden; +} + +input::-webkit-outer-spin-button, +input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} + +label { + font-size: globals.$body-font-size; +} + +img { + -webkit-user-drag: none; +} + +progress[value] { + -webkit-appearance: none; +} + +.container { + width: 100%; + height: 100%; + overflow: hidden; + display: flex; + flex-direction: column; + container-name: globals.$app-container; + container-type: inline-size; + + &__content { + overflow-y: auto; + align-items: center; + display: flex; + flex-direction: column; + position: relative; + height: 100%; + background: linear-gradient( + 0deg, + globals.$dark-background-color 50%, + globals.$background-color 100% + ); + } +} + +.title-bar { + display: flex; + width: 100%; + height: 35px; + min-height: 35px; + background-color: globals.$dark-background-color; + align-items: center; + padding: 0 calc(globals.$spacing-unit * 2); + -webkit-app-region: drag; + z-index: 4; + border-bottom: 1px solid globals.$border-color; +} diff --git a/src/renderer/src/app.tsx b/src/renderer/src/app.tsx index 7c572a56..ce184474 100644 --- a/src/renderer/src/app.tsx +++ b/src/renderer/src/app.tsx @@ -2,6 +2,8 @@ import { useCallback, useContext, useEffect, useRef } from "react"; import { Sidebar, BottomPanel, Header, Toast } from "@renderer/components"; +import "./app.scss"; + import { useAppDispatch, useAppSelector, diff --git a/src/renderer/src/components/backdrop/backdrop.css.ts b/src/renderer/src/components/backdrop/backdrop.css.ts deleted file mode 100644 index 1ccfe12f..00000000 --- a/src/renderer/src/components/backdrop/backdrop.css.ts +++ /dev/null @@ -1,54 +0,0 @@ -import { keyframes } from "@vanilla-extract/css"; -import { recipe } from "@vanilla-extract/recipes"; - -import { SPACING_UNIT, vars } from "../../theme.css"; - -export const backdropFadeIn = keyframes({ - "0%": { backdropFilter: "blur(0px)", backgroundColor: "rgba(0, 0, 0, 0.5)" }, - "100%": { - backdropFilter: "blur(2px)", - backgroundColor: "rgba(0, 0, 0, 0.7)", - }, -}); - -export const backdropFadeOut = keyframes({ - "0%": { backdropFilter: "blur(2px)", backgroundColor: "rgba(0, 0, 0, 0.7)" }, - "100%": { - backdropFilter: "blur(0px)", - backgroundColor: "rgba(0, 0, 0, 0)", - }, -}); - -export const backdrop = recipe({ - base: { - animationName: backdropFadeIn, - animationDuration: "0.4s", - backgroundColor: "rgba(0, 0, 0, 0.7)", - position: "absolute", - width: "100%", - height: "100%", - display: "flex", - justifyContent: "center", - alignItems: "center", - zIndex: vars.zIndex.backdrop, - top: "0", - padding: `${SPACING_UNIT * 3}px`, - backdropFilter: "blur(2px)", - transition: "all ease 0.2s", - }, - variants: { - closing: { - true: { - animationName: backdropFadeOut, - backdropFilter: "blur(0px)", - backgroundColor: "rgba(0, 0, 0, 0)", - }, - }, - windows: { - true: { - // SPACING_UNIT * 3 + title bar spacing - paddingTop: `${SPACING_UNIT * 3 + 35}px`, - }, - }, - }, -}); diff --git a/src/renderer/src/components/backdrop/backdrop.scss b/src/renderer/src/components/backdrop/backdrop.scss new file mode 100644 index 00000000..d62ff9a9 --- /dev/null +++ b/src/renderer/src/components/backdrop/backdrop.scss @@ -0,0 +1,50 @@ +@use "../../scss/globals.scss"; + +.backdrop { + animation-name: backdrop-fade-in; + animation-duration: 0.4s; + background-color: rgba(0, 0, 0, 0.7); + position: absolute; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + z-index: globals.$backdrop-z-index; + top: 0; + padding: calc(globals.$spacing-unit * 3); + backdrop-filter: blur(2px); + transition: all ease 0.2s; + + &--closing { + animation-name: backdrop-fade-out; + backdrop-filter: blur(0px); + background-color: rgba(0, 0, 0, 0); + } + + &--windows { + padding-top: calc(#{globals.$spacing-unit * 3} + 35); + } +} + +@keyframes backdrop-fade-in { + 0% { + backdrop-filter: blur(0px); + background-color: rgba(0, 0, 0, 0.5); + } + 100% { + backdrop-filter: blur(2px); + background-color: rgba(0, 0, 0, 0.7); + } +} + +@keyframes backdrop-fade-out { + 0% { + backdrop-filter: blur(2px); + background-color: rgba(0, 0, 0, 0.7); + } + 100% { + backdrop-filter: blur(0px); + background-color: rgba(0, 0, 0, 0); + } +} diff --git a/src/renderer/src/components/backdrop/backdrop.tsx b/src/renderer/src/components/backdrop/backdrop.tsx index f498e664..e62d42ee 100644 --- a/src/renderer/src/components/backdrop/backdrop.tsx +++ b/src/renderer/src/components/backdrop/backdrop.tsx @@ -1,4 +1,5 @@ -import * as styles from "./backdrop.css"; +import "./backdrop.scss"; +import cn from "classnames"; export interface BackdropProps { isClosing?: boolean; @@ -8,9 +9,9 @@ export interface BackdropProps { export function Backdrop({ isClosing = false, children }: BackdropProps) { return (
{children} diff --git a/src/renderer/src/components/checkbox-field/checkbox-field.css.ts b/src/renderer/src/components/checkbox-field/checkbox-field.css.ts deleted file mode 100644 index 606b226a..00000000 --- a/src/renderer/src/components/checkbox-field/checkbox-field.css.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { style } from "@vanilla-extract/css"; - -import { SPACING_UNIT, vars } from "../../theme.css"; - -export const checkboxField = style({ - display: "flex", - flexDirection: "row", - alignItems: "center", - gap: `${SPACING_UNIT}px`, - cursor: "pointer", -}); - -export const checkbox = style({ - width: "20px", - height: "20px", - borderRadius: "4px", - backgroundColor: vars.color.darkBackground, - display: "flex", - justifyContent: "center", - alignItems: "center", - position: "relative", - transition: "all ease 0.2s", - border: `solid 1px ${vars.color.border}`, - ":hover": { - borderColor: "rgba(255, 255, 255, 0.5)", - }, -}); - -export const checkboxInput = style({ - width: "100%", - height: "100%", - position: "absolute", - margin: "0", - padding: "0", - opacity: "0", - cursor: "pointer", -}); - -export const checkboxLabel = style({ - cursor: "pointer", -}); diff --git a/src/renderer/src/components/checkbox-field/checkbox-field.scss b/src/renderer/src/components/checkbox-field/checkbox-field.scss new file mode 100644 index 00000000..06235687 --- /dev/null +++ b/src/renderer/src/components/checkbox-field/checkbox-field.scss @@ -0,0 +1,39 @@ +@use "../../scss/globals.scss"; + +.checkbox-field { + display: flex; + flex-direction: row; + align-items: center; + gap: globals.$spacing-unit; + cursor: pointer; + + &__checkbox { + width: 20px; + height: 20px; + border-radius: 4px; + background-color: globals.$dark-background-color; + display: flex; + justify-content: center; + align-items: center; + position: relative; + transition: all ease 0.2s; + border: solid 1px globals.$border-color; + &:hover { + border-color: rgba(255, 255, 255, 0.5); + } + } + + &__input { + width: 100%; + height: 100%; + position: absolute; + margin: 0; + padding: 0; + opacity: 0; + cursor: pointer; + } + + &__label { + cursor: pointer; + } +} diff --git a/src/renderer/src/components/checkbox-field/checkbox-field.tsx b/src/renderer/src/components/checkbox-field/checkbox-field.tsx index bb81a910..3e80f0aa 100644 --- a/src/renderer/src/components/checkbox-field/checkbox-field.tsx +++ b/src/renderer/src/components/checkbox-field/checkbox-field.tsx @@ -1,6 +1,6 @@ import { useId } from "react"; -import * as styles from "./checkbox-field.css"; import { CheckIcon } from "@primer/octicons-react"; +import "./checkbox-field.scss"; export interface CheckboxFieldProps extends React.DetailedHTMLProps< @@ -14,17 +14,17 @@ export function CheckboxField({ label, ...props }: CheckboxFieldProps) { const id = useId(); return ( -
-
+
+
{props.checked && }
-
diff --git a/src/renderer/src/components/confirmation-modal/confirmation-modal.css.ts b/src/renderer/src/components/confirmation-modal/confirmation-modal.css.ts deleted file mode 100644 index a9aec403..00000000 --- a/src/renderer/src/components/confirmation-modal/confirmation-modal.css.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { SPACING_UNIT } from "../../theme.css"; -import { style } from "@vanilla-extract/css"; - -export const actions = style({ - display: "flex", - alignSelf: "flex-end", - gap: `${SPACING_UNIT * 2}px`, -}); - -export const descriptionText = style({ - fontSize: "16px", - lineHeight: "24px", -}); diff --git a/src/renderer/src/components/confirmation-modal/confirmation-modal.scss b/src/renderer/src/components/confirmation-modal/confirmation-modal.scss new file mode 100644 index 00000000..428818c4 --- /dev/null +++ b/src/renderer/src/components/confirmation-modal/confirmation-modal.scss @@ -0,0 +1,17 @@ +@use "../../scss/globals.scss"; + +.confirmation-modal { + display: flex; + flex-direction: column; + gap: calc(globals.$spacing-unit * 2); + + &__actions { + display: flex; + align-self: flex-end; + gap: calc(globals.$spacing-unit * 2); + } + &__description { + font-size: 16px; + line-height: 24px; + } +} diff --git a/src/renderer/src/components/confirmation-modal/confirmation-modal.tsx b/src/renderer/src/components/confirmation-modal/confirmation-modal.tsx index 31929c60..eaf3526a 100644 --- a/src/renderer/src/components/confirmation-modal/confirmation-modal.tsx +++ b/src/renderer/src/components/confirmation-modal/confirmation-modal.tsx @@ -1,7 +1,7 @@ import { Button } from "../button/button"; import { Modal, type ModalProps } from "../modal/modal"; -import * as styles from "./confirmation-modal.css"; +import "./confirmation-modal.scss"; export interface ConfirmationModalProps extends Omit { confirmButtonLabel: string; @@ -31,10 +31,10 @@ export function ConfirmationModal({ return ( -
-

{descriptionText}

+
+

{descriptionText}

-
+
diff --git a/src/renderer/src/components/game-card/game-card.css.ts b/src/renderer/src/components/game-card/game-card.css.ts deleted file mode 100644 index c810130d..00000000 --- a/src/renderer/src/components/game-card/game-card.css.ts +++ /dev/null @@ -1,106 +0,0 @@ -import { style } from "@vanilla-extract/css"; - -import { SPACING_UNIT, vars } from "../../theme.css"; - -export const card = style({ - width: "100%", - height: "180px", - boxShadow: "0px 0px 15px 0px #000000", - overflow: "hidden", - borderRadius: "4px", - transition: "all ease 0.2s", - border: `solid 1px ${vars.color.border}`, - cursor: "pointer", - zIndex: "1", - ":active": { - opacity: vars.opacity.active, - }, -}); - -export const backdrop = style({ - background: "linear-gradient(0deg, rgba(0, 0, 0, 0.7) 50%, transparent 100%)", - width: "100%", - height: "100%", - display: "flex", - justifyContent: "flex-end", - flexDirection: "column", - position: "relative", -}); - -export const cover = style({ - width: "100%", - height: "100%", - objectFit: "cover", - objectPosition: "center", - position: "absolute", - zIndex: "-1", - transition: "all ease 0.2s", - selectors: { - [`${card}:hover &`]: { - transform: "scale(1.05)", - }, - }, -}); - -export const content = style({ - color: "#DADBE1", - padding: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px`, - display: "flex", - alignItems: "flex-start", - gap: `${SPACING_UNIT}px`, - flexDirection: "column", - transition: "all ease 0.2s", - transform: "translateY(24px)", - selectors: { - [`${card}:hover &`]: { - transform: "translateY(0px)", - }, - }, -}); - -export const title = style({ - fontSize: "16px", - fontWeight: "bold", - textAlign: "left", -}); - -export const downloadOptions = style({ - display: "flex", - margin: "0", - padding: "0", - gap: `${SPACING_UNIT}px`, - flexWrap: "wrap", - listStyle: "none", -}); - -export const specifics = style({ - display: "flex", - gap: `${SPACING_UNIT * 2}px`, - justifyContent: "center", -}); - -export const specificsItem = style({ - gap: `${SPACING_UNIT}px`, - display: "flex", - color: vars.color.muted, - fontSize: "12px", - alignItems: "flex-end", -}); - -export const titleContainer = style({ - display: "flex", - alignItems: "center", - gap: `${SPACING_UNIT}px`, - color: vars.color.muted, -}); - -export const shopIcon = style({ - width: "20px", - height: "20px", - minWidth: "20px", -}); - -export const noDownloadsLabel = style({ - color: vars.color.body, - fontWeight: "bold", -}); diff --git a/src/renderer/src/components/game-card/game-card.scss b/src/renderer/src/components/game-card/game-card.scss new file mode 100644 index 00000000..ee4a22b1 --- /dev/null +++ b/src/renderer/src/components/game-card/game-card.scss @@ -0,0 +1,102 @@ +@use "../../scss/globals.scss"; + +.game-card { + width: 100%; + height: 180px; + box-shadow: 0px 0px 15px 0px #000000; + overflow: hidden; + border-radius: 4px; + transition: all ease 0.2s; + border: solid 1px globals.$border-color; + cursor: pointer; + z-index: 1; + + &:active { + opacity: globals.$active-opacity; + } + + &__backdrop { + background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 50%, transparent 100%); + width: 100%; + height: 100%; + display: flex; + justify-content: flex-end; + flex-direction: column; + position: relative; + } + + &__cover { + width: 100%; + height: 100%; + object-fit: cover; + object-position: center; + position: absolute; + z-index: -1; + transition: all ease 0.2s; + } + + &__content { + color: #dadbe1; + padding: globals.$spacing-unit calc(globals.$spacing-unit * 2); + display: flex; + align-items: flex-start; + gap: globals.$spacing-unit; + flex-direction: column; + transition: all ease 0.2s; + transform: translateY(24px); + } + + &__title { + font-size: 16px; + font-weight: bold; + text-align: left; + } + + &__download-options { + display: flex; + margin: 0; + padding: 0; + gap: globals.$spacing-unit; + flex-wrap: wrap; + list-style: none; + } + + &__specifics { + display: flex; + gap: calc(globals.$spacing-unit * 2); + justify-content: center; + } + + &__specifics-item { + gap: globals.$spacing-unit; + display: flex; + color: globals.$muted-color; + font-size: 12px; + align-items: flex-end; + } + + &__title-container { + display: flex; + align-items: center; + gap: globals.$spacing-unit; + color: globals.$muted-color; + } + + &__shop-icon { + width: 20px; + height: 20px; + min-width: 20px; + } + + &__no-download-label { + color: globals.$body-color; + font-weight: bold; + } + + &:hover &__cover { + transform: scale(1.05); + } + &:hover &__content { + transform: translateY(0px); + } +} diff --git a/src/renderer/src/components/game-card/game-card.tsx b/src/renderer/src/components/game-card/game-card.tsx index 869cb2d6..62290704 100644 --- a/src/renderer/src/components/game-card/game-card.tsx +++ b/src/renderer/src/components/game-card/game-card.tsx @@ -3,7 +3,8 @@ import type { CatalogueEntry, GameRepack, GameStats } from "@types"; import SteamLogo from "@renderer/assets/steam-logo.svg?react"; -import * as styles from "./game-card.css"; +import "./game-card.scss"; + import { useTranslation } from "react-i18next"; import { Badge } from "../badge/badge"; import { useCallback, useContext, useEffect, useState } from "react"; @@ -19,7 +20,7 @@ export interface GameCardProps } const shopIcon = { - steam: , + steam: , }; export function GameCard({ game, ...props }: GameCardProps) { @@ -56,25 +57,25 @@ export function GameCard({ game, ...props }: GameCardProps) { diff --git a/src/renderer/src/components/header/header.css.ts b/src/renderer/src/components/header/header.css.ts deleted file mode 100644 index 12855986..00000000 --- a/src/renderer/src/components/header/header.css.ts +++ /dev/null @@ -1,182 +0,0 @@ -import type { ComplexStyleRule } from "@vanilla-extract/css"; -import { keyframes, style } from "@vanilla-extract/css"; -import { recipe } from "@vanilla-extract/recipes"; - -import { SPACING_UNIT, vars } from "../../theme.css"; - -export const slideIn = keyframes({ - "0%": { transform: "translateX(20px)", opacity: "0" }, - "100%": { - transform: "translateX(0)", - opacity: "1", - }, -}); - -export const slideOut = keyframes({ - "0%": { transform: "translateX(0px)", opacity: "1" }, - "100%": { - transform: "translateX(20px)", - opacity: "0", - }, -}); - -export const header = recipe({ - base: { - display: "flex", - justifyContent: "space-between", - alignItems: "center", - gap: `${SPACING_UNIT * 2}px`, - WebkitAppRegion: "drag", - width: "100%", - padding: `${SPACING_UNIT * 2}px ${SPACING_UNIT * 3}px`, - color: vars.color.muted, - borderBottom: `solid 1px ${vars.color.border}`, - backgroundColor: vars.color.darkBackground, - } as ComplexStyleRule, - variants: { - draggingDisabled: { - true: { - WebkitAppRegion: "no-drag", - } as ComplexStyleRule, - }, - isWindows: { - true: { - WebkitAppRegion: "no-drag", - } as ComplexStyleRule, - }, - }, -}); - -export const search = recipe({ - base: { - backgroundColor: vars.color.background, - display: "inline-flex", - transition: "all ease 0.2s", - width: "200px", - alignItems: "center", - borderRadius: "8px", - border: `solid 1px ${vars.color.border}`, - height: "40px", - WebkitAppRegion: "no-drag", - } as ComplexStyleRule, - variants: { - focused: { - true: { - width: "250px", - borderColor: "#DADBE1", - }, - false: { - ":hover": { - borderColor: "rgba(255, 255, 255, 0.5)", - }, - }, - }, - }, -}); - -export const searchInput = style({ - backgroundColor: "transparent", - border: "none", - width: "100%", - height: "100%", - outline: "none", - color: "#DADBE1", - cursor: "default", - fontFamily: "inherit", - textOverflow: "ellipsis", - ":focus": { - cursor: "text", - }, -}); - -export const actionButton = style({ - color: "inherit", - cursor: "pointer", - transition: "all ease 0.2s", - padding: `${SPACING_UNIT}px`, - ":hover": { - color: "#DADBE1", - }, -}); - -export const section = style({ - display: "flex", - alignItems: "center", - gap: `${SPACING_UNIT * 2}px`, - height: "100%", - overflow: "hidden", -}); - -export const backButton = recipe({ - base: { - color: vars.color.body, - cursor: "pointer", - WebkitAppRegion: "no-drag", - position: "absolute", - transition: "transform ease 0.2s", - animationDuration: "0.2s", - width: "16px", - height: "16px", - display: "flex", - alignItems: "center", - } as ComplexStyleRule, - variants: { - enabled: { - true: { - animationName: slideIn, - }, - false: { - opacity: "0", - pointerEvents: "none", - animationName: slideOut, - }, - }, - }, -}); - -export const title = recipe({ - base: { - transition: "all ease 0.2s", - overflow: "hidden", - textOverflow: "ellipsis", - width: "100%", - }, - variants: { - hasBackButton: { - true: { - transform: "translateX(28px)", - width: "calc(100% - 28px)", - }, - }, - }, -}); - -export const subheader = style({ - borderBottom: `solid 1px ${vars.color.border}`, - padding: `${SPACING_UNIT / 2}px ${SPACING_UNIT * 3}px`, -}); - -export const newVersionButton = style({ - display: "flex", - alignItems: "center", - justifyContent: "center", - gap: `${SPACING_UNIT}px`, - color: vars.color.body, - fontSize: "12px", - ":hover": { - textDecoration: "underline", - cursor: "pointer", - }, -}); - -export const newVersionLink = style({ - display: "flex", - alignItems: "center", - gap: `${SPACING_UNIT}px`, - color: "#8e919b", - fontSize: "12px", -}); - -export const newVersionIcon = style({ - color: vars.color.success, -}); diff --git a/src/renderer/src/components/header/header.scss b/src/renderer/src/components/header/header.scss new file mode 100644 index 00000000..065aed8d --- /dev/null +++ b/src/renderer/src/components/header/header.scss @@ -0,0 +1,132 @@ +@use "../../scss/globals.scss"; + +.header { + display: flex; + justify-content: space-between; + align-items: center; + gap: calc(globals.$spacing-unit * 2); + -webkit-app-region: drag; + width: 100%; + padding: calc(globals.$spacing-unit * 2) calc(globals.$spacing-unit * 3); + color: globals.$muted-color; + border-bottom: solid 1px globals.$border-color; + + &--dragging-disabled { + -webkit-app-region: no-drag; + } + + &--is-windows { + -webkit-app-region: no-drag; + } + + &__search { + background-color: globals.$dark-background-color; + display: inline-flex; + transition: all ease 0.2s; + width: 200px; + align-items: center; + border-radius: 8px; + border: solid 1px globals.$border-color; + height: 40px; + -webkit-app-region: no-drag; + &:hover { + border-color: rgba(255, 255, 255, 0.5); + } + + &--focused { + width: 250px; + border-color: #dadbe1; + } + } + + &__search-input { + background-color: transparent; + border: none; + width: 100%; + height: 100%; + outline: none; + color: #dadbe1; + cursor: default; + font-family: inherit; + text-overflow: ellipsis; + + &:focus { + cursor: text; + } + } + + &__action-button { + color: inherit; + cursor: pointer; + transition: all ease 0.2s; + padding: globals.$spacing-unit; + + &:hover { + color: #dadbe1; + } + } + + &__section { + display: flex; + align-items: center; + gap: calc(globals.$spacing-unit * 2); + height: 100%; + overflow: hidden; + } + + &__back-button { + color: globals.$body-color; + cursor: pointer; + -webkit-app-region: no-drag; + position: absolute; + transition: transform ease 0.2s; + animation-duration: 0.2s; + width: 16px; + height: 16px; + display: flex; + align-items: center; + opacity: 0; + pointer-events: none; + animation-name: slide-out; + + &--enabled { + animation: slide-in; + opacity: 1; + pointer-events: all; + } + } + + &__title { + transition: all ease 0.2s; + overflow: hidden; + text-overflow: ellipsis; + width: 100%; + + &--has-back-button { + transform: translateX(28px); + width: calc(100% - 28px); + } + } +} + +@keyframes slide-in { + 0% { + transform: translateX(20px); + opacity: 0; + } + 100% { + transform: translateX(0); + opacity: 1; + } +} + +@keyframes slide-out { + 0% { + transform: translateX(0px); + opacity: 1; + } + 100% { + transform: translateX(20px); + opacity: 0; + } +} diff --git a/src/renderer/src/components/header/header.tsx b/src/renderer/src/components/header/header.tsx index e0721df4..83d32caa 100644 --- a/src/renderer/src/components/header/header.tsx +++ b/src/renderer/src/components/header/header.tsx @@ -5,9 +5,11 @@ import { ArrowLeftIcon, SearchIcon, XIcon } from "@primer/octicons-react"; import { useAppDispatch, useAppSelector } from "@renderer/hooks"; -import * as styles from "./header.css"; +import "./header.scss"; + import { clearSearch } from "@renderer/features"; import { AutoUpdateSubHeader } from "./auto-update-sub-header"; +import cn from "classnames"; export interface HeaderProps { onSearch: (query: string) => void; @@ -68,16 +70,16 @@ export function Header({ onSearch, onClear, search }: HeaderProps) { return ( <>
-
+
-
-
+
+
diff --git a/src/renderer/src/components/hero/hero.css.ts b/src/renderer/src/components/hero/hero.css.ts deleted file mode 100644 index eaf0a101..00000000 --- a/src/renderer/src/components/hero/hero.css.ts +++ /dev/null @@ -1,60 +0,0 @@ -import { style } from "@vanilla-extract/css"; - -import { SPACING_UNIT, vars } from "../../theme.css"; - -export const hero = style({ - width: "100%", - height: "280px", - minHeight: "280px", - maxHeight: "280px", - borderRadius: "4px", - color: "#DADBE1", - overflow: "hidden", - boxShadow: "0px 0px 15px 0px #000000", - cursor: "pointer", - border: `solid 1px ${vars.color.border}`, - zIndex: "1", -}); - -export const heroMedia = style({ - objectFit: "cover", - objectPosition: "center", - position: "absolute", - zIndex: "-1", - width: "100%", - height: "100%", - transition: "all ease 0.2s", - imageRendering: "revert", - selectors: { - [`${hero}:hover &`]: { - transform: "scale(1.02)", - }, - }, -}); - -export const backdrop = style({ - width: "100%", - height: "100%", - background: "linear-gradient(0deg, rgba(0, 0, 0, 0.8) 25%, transparent 100%)", - position: "relative", - display: "flex", - overflow: "hidden", -}); - -export const description = style({ - maxWidth: "700px", - color: vars.color.muted, - textAlign: "left", - lineHeight: "20px", - marginTop: `${SPACING_UNIT * 2}px`, -}); - -export const content = style({ - width: "100%", - height: "100%", - padding: `${SPACING_UNIT * 4}px ${SPACING_UNIT * 3}px`, - gap: `${SPACING_UNIT * 2}px`, - display: "flex", - flexDirection: "column", - justifyContent: "flex-end", -}); diff --git a/src/renderer/src/components/hero/hero.scss b/src/renderer/src/components/hero/hero.scss new file mode 100644 index 00000000..ea14c059 --- /dev/null +++ b/src/renderer/src/components/hero/hero.scss @@ -0,0 +1,56 @@ +@use "../../scss/globals.scss"; + +.hero { + width: 100%; + height: 280px; + min-height: 280px; + max-height: 280px; + border-radius: 4px; + color: #dadbe1; + overflow: hidden; + box-shadow: 0px 0px 15px 0px #000000; + cursor: pointer; + border: solid 1px globals.$border-color; + z-index: 1; + + &__media { + object-fit: cover; + object-position: center; + position: absolute; + z-index: -1; + width: 100%; + height: 100%; + transition: all ease 0.2s; + image-rendering: revert; + } + &:hover &__media { + transform: scale(1.02); + } + + &__backdrop { + width: 100%; + height: 100%; + background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 25%, transparent 100%); + position: relative; + display: flex; + overflow: hidden; + } + + &__description { + max-width: 700px; + color: globals.$muted-color; + text-align: left; + line-height: 20px; + margin-top: calc(globals.$spacing-unit * 2); + } + + &__content { + width: 100%; + height: 100%; + padding: calc(globals.$spacing-unit * 4) calc(globals.$spacing-unit * 3); + gap: calc(globals.$spacing-unit * 2); + display: flex; + flex-direction: column; + justify-content: flex-end; + } +} diff --git a/src/renderer/src/components/hero/hero.tsx b/src/renderer/src/components/hero/hero.tsx index 9bc5514d..b7a75c47 100644 --- a/src/renderer/src/components/hero/hero.tsx +++ b/src/renderer/src/components/hero/hero.tsx @@ -1,9 +1,9 @@ import { useNavigate } from "react-router-dom"; -import * as styles from "./hero.css"; import { useEffect, useState } from "react"; import type { TrendingGame } from "@types"; import { useTranslation } from "react-i18next"; import Skeleton from "react-loading-skeleton"; +import "./hero.scss"; export function Hero() { const [featuredGameDetails, setFeaturedGameDetails] = useState< @@ -29,7 +29,7 @@ export function Hero() { }, [i18n.language]); if (isLoading) { - return ; + return ; } if (featuredGameDetails?.length) { @@ -37,17 +37,17 @@ export function Hero() { diff --git a/src/renderer/src/components/link/link.css.ts b/src/renderer/src/components/link/link.css.ts deleted file mode 100644 index 4f0e4c41..00000000 --- a/src/renderer/src/components/link/link.css.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { style } from "@vanilla-extract/css"; - -export const link = style({ - textDecoration: "none", - color: "#C0C1C7", - ":hover": { - textDecoration: "underline", - }, -}); diff --git a/src/renderer/src/components/link/link.scss b/src/renderer/src/components/link/link.scss new file mode 100644 index 00000000..170f10f6 --- /dev/null +++ b/src/renderer/src/components/link/link.scss @@ -0,0 +1,7 @@ +.link { + text-decoration: none; + color: #c0c1c7; + &:hover { + text-decoration: underline; + } +} diff --git a/src/renderer/src/components/link/link.tsx b/src/renderer/src/components/link/link.tsx index ffd5f89c..1c3bad76 100644 --- a/src/renderer/src/components/link/link.tsx +++ b/src/renderer/src/components/link/link.tsx @@ -1,6 +1,6 @@ import { Link as ReactRouterDomLink, LinkProps } from "react-router-dom"; import cn from "classnames"; -import * as styles from "./link.css"; +import "./link.scss"; export function Link({ children, to, className, ...props }: LinkProps) { const openExternal = (event: React.MouseEvent) => { @@ -12,7 +12,7 @@ export function Link({ children, to, className, ...props }: LinkProps) { return ( @@ -22,11 +22,7 @@ export function Link({ children, to, className, ...props }: LinkProps) { } return ( - + {children} ); diff --git a/src/renderer/src/components/modal/modal.css.ts b/src/renderer/src/components/modal/modal.css.ts deleted file mode 100644 index d9d14fda..00000000 --- a/src/renderer/src/components/modal/modal.css.ts +++ /dev/null @@ -1,78 +0,0 @@ -import { keyframes, style } from "@vanilla-extract/css"; -import { recipe } from "@vanilla-extract/recipes"; - -import { SPACING_UNIT, vars } from "../../theme.css"; - -export const scaleFadeIn = keyframes({ - "0%": { opacity: "0", scale: "0.5" }, - "100%": { - opacity: "1", - scale: "1", - }, -}); - -export const scaleFadeOut = keyframes({ - "0%": { opacity: "1", scale: "1" }, - "100%": { - opacity: "0", - scale: "0.5", - }, -}); - -export const modal = recipe({ - base: { - animation: `${scaleFadeIn} 0.2s cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running`, - backgroundColor: vars.color.background, - borderRadius: "4px", - minWidth: "400px", - maxWidth: "600px", - color: vars.color.body, - maxHeight: "100%", - border: `solid 1px ${vars.color.border}`, - overflow: "hidden", - display: "flex", - flexDirection: "column", - }, - variants: { - closing: { - true: { - animationName: scaleFadeOut, - opacity: "0", - }, - }, - large: { - true: { - width: "800px", - maxWidth: "800px", - }, - }, - }, -}); - -export const modalContent = style({ - height: "100%", - overflow: "auto", - padding: `${SPACING_UNIT * 3}px ${SPACING_UNIT * 2}px`, -}); - -export const modalHeader = style({ - display: "flex", - gap: `${SPACING_UNIT}px`, - padding: `${SPACING_UNIT * 2}px`, - borderBottom: `solid 1px ${vars.color.border}`, - justifyContent: "space-between", - alignItems: "center", -}); - -export const closeModalButton = style({ - cursor: "pointer", - transition: "all ease 0.2s", - alignSelf: "flex-start", - ":hover": { - opacity: "0.75", - }, -}); - -export const closeModalButtonIcon = style({ - color: vars.color.body, -}); diff --git a/src/renderer/src/components/modal/modal.scss b/src/renderer/src/components/modal/modal.scss new file mode 100644 index 00000000..dbaee730 --- /dev/null +++ b/src/renderer/src/components/modal/modal.scss @@ -0,0 +1,77 @@ +@use "../../scss/globals.scss"; + +.modal { + animation: scale-fade-in 0.2s cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none + running; + background-color: globals.$background-color; + border-radius: 4px; + min-width: 400px; + max-width: 600px; + color: globals.$body-color; + max-height: 100%; + border: solid 1px globals.$border-color; + overflow: hidden; + display: flex; + flex-direction: column; + + &--closing { + animation-name: scale-fade-out; + opacity: 0; + } + + &--large { + width: 800px; + max-width: 800px; + } + + &__content { + height: 100%; + overflow: auto; + padding: calc(globals.$spacing-unit * 3) calc(globals.$spacing-unit * 2); + } + + &__header { + display: flex; + gap: globals.$spacing-unit; + padding: calc(globals.$spacing-unit * 2); + border-bottom: solid 1px globals.$border-color; + justify-content: space-between; + align-items: center; + } + + &__close-button { + cursor: pointer; + transition: all ease 0.2s; + align-self: flex-start; + + &:hover { + opacity: 0.75; + } + } + + &__close-button-icon { + color: globals.$body-color; + } +} + +@keyframes scale-fade-in { + 0% { + opacity: 0; + scale: 0.5; + } + 100% { + opacity: 1; + scale: 1; + } +} + +@keyframes scale-fade-out { + 0% { + opacity: 1; + scale: 1; + } + 100% { + opacity: 0; + scale: 0.5; + } +} diff --git a/src/renderer/src/components/modal/modal.tsx b/src/renderer/src/components/modal/modal.tsx index eb2894de..3eceedb3 100644 --- a/src/renderer/src/components/modal/modal.tsx +++ b/src/renderer/src/components/modal/modal.tsx @@ -2,10 +2,11 @@ import { useCallback, useEffect, useRef, useState } from "react"; import { createPortal } from "react-dom"; import { XIcon } from "@primer/octicons-react"; -import * as styles from "./modal.css"; +import "./modal.scss"; import { Backdrop } from "../backdrop/backdrop"; import { useTranslation } from "react-i18next"; +import cn from "classnames"; export interface ModalProps { visible: boolean; @@ -102,13 +103,16 @@ export function Modal({ return createPortal(
-
+

{title}

{description &&

{description}

} @@ -117,13 +121,13 @@ export function Modal({
-
{children}
+
{children}
, document.body diff --git a/src/renderer/src/components/select-field/select-field.css.ts b/src/renderer/src/components/select-field/select-field.css.ts deleted file mode 100644 index 7acd4e98..00000000 --- a/src/renderer/src/components/select-field/select-field.css.ts +++ /dev/null @@ -1,59 +0,0 @@ -import { style } from "@vanilla-extract/css"; -import { recipe } from "@vanilla-extract/recipes"; - -import { SPACING_UNIT, vars } from "../../theme.css"; - -export const select = recipe({ - base: { - display: "inline-flex", - transition: "all ease 0.2s", - width: "fit-content", - alignItems: "center", - borderRadius: "8px", - border: `1px solid ${vars.color.border}`, - height: "40px", - minHeight: "40px", - }, - variants: { - focused: { - true: { - borderColor: "#DADBE1", - }, - false: { - ":hover": { - borderColor: "rgba(255, 255, 255, 0.5)", - }, - }, - }, - theme: { - primary: { - backgroundColor: vars.color.darkBackground, - }, - dark: { - backgroundColor: vars.color.background, - }, - }, - }, -}); - -export const option = style({ - backgroundColor: vars.color.darkBackground, - borderRight: "4px solid", - borderColor: "transparent", - borderRadius: "8px", - width: "fit-content", - height: "100%", - outline: "none", - color: "#DADBE1", - cursor: "default", - fontFamily: "inherit", - fontSize: vars.size.body, - textOverflow: "ellipsis", - padding: `${SPACING_UNIT}px`, -}); - -export const label = style({ - marginBottom: `${SPACING_UNIT}px`, - display: "block", - color: vars.color.body, -}); diff --git a/src/renderer/src/components/select-field/select-field.scss b/src/renderer/src/components/select-field/select-field.scss new file mode 100644 index 00000000..38dfc65b --- /dev/null +++ b/src/renderer/src/components/select-field/select-field.scss @@ -0,0 +1,49 @@ +@use "../../scss/globals.scss"; + +.select-field { + display: inline-flex; + transition: all ease 0.2s; + width: fit-content; + align-items: center; + border-radius: 8px; + border: 1px solid globals.$border-color; + height: 40px; + min-height: 40px; + &:hover { + border-color: rgba(255, 255, 255, 0.5); + } + + &--focused { + border-color: #dadbe1; + } + + &--primary { + background-color: globals.$dark-background-color; + } + + &--dark { + background-color: globals.$background-color; + } + + &__option { + background-color: globals.$dark-background-color; + border-right: 4px solid; + border-color: transparent; + border-radius: 8px; + width: fit-content; + height: 100%; + outline: none; + color: #dadbe1; + cursor: default; + font-family: inherit; + font-size: globals.$body-font-size; + text-overflow: ellipsis; + padding: globals.$spacing-unit; + } + + &__label { + margin-bottom: globals.$spacing-unit; + display: block; + color: globals.$body-color; + } +} diff --git a/src/renderer/src/components/select-field/select-field.tsx b/src/renderer/src/components/select-field/select-field.tsx index fb5038f6..16b266cd 100644 --- a/src/renderer/src/components/select-field/select-field.tsx +++ b/src/renderer/src/components/select-field/select-field.tsx @@ -1,13 +1,13 @@ import { useId, useState } from "react"; -import type { RecipeVariants } from "@vanilla-extract/recipes"; -import * as styles from "./select-field.css"; +import "./select-field.scss"; +import cn from "classnames"; export interface SelectProps extends React.DetailedHTMLProps< React.SelectHTMLAttributes, HTMLSelectElement > { - theme?: NonNullable>["theme"]; + theme?: "primary" | "dark"; label?: string; options?: { key: string; value: string; label: string }[]; } @@ -25,16 +25,20 @@ export function SelectField({ return (
{label && ( -
-
- {t("my_library")} +
+ {t("my_library")} - + -
    - {filteredLibrary.map((game) => ( -
  • - -
    • - ))} -
-
+ + {getGameTitle(game)} + + + + ))} + +
+
+ {hasActiveSubscription && ( + + )} +
)} + + + handleChange({ disableNsfwAlert: !form.disableNsfwAlert }) + } + /> ); } diff --git a/src/renderer/src/vite-env.d.ts b/src/renderer/src/vite-env.d.ts index b1f45c78..304dde0f 100644 --- a/src/renderer/src/vite-env.d.ts +++ b/src/renderer/src/vite-env.d.ts @@ -1,2 +1,10 @@ /// /// + +interface ImportMetaEnv { + readonly RENDERER_VITE_INTERCOM_APP_ID: string; +} + +interface ImportMeta { + readonly env: ImportMetaEnv; +} diff --git a/src/shared/index.ts b/src/shared/index.ts index 1f17ac56..173867df 100644 --- a/src/shared/index.ts +++ b/src/shared/index.ts @@ -55,6 +55,9 @@ export const removeDuplicateSpaces = (name: string) => export const replaceDotsWithSpace = (name: string) => name.replace(/\./g, " "); +export const replaceNbspWithSpace = (name: string) => + name.replace(new RegExp(String.fromCharCode(160), "g"), " "); + export const replaceUnderscoreWithSpace = (name: string) => name.replace(/_/g, " "); @@ -69,6 +72,7 @@ export const formatName = pipe( removeSpecialEditionFromName, replaceUnderscoreWithSpace, replaceDotsWithSpace, + replaceNbspWithSpace, (str) => str.replace(/DIRECTOR'S CUT/g, ""), removeSymbolsFromName, removeDuplicateSpaces, diff --git a/src/types/howlongtobeat.types.ts b/src/types/how-long-to-beat.types.ts similarity index 100% rename from src/types/howlongtobeat.types.ts rename to src/types/how-long-to-beat.types.ts diff --git a/src/types/index.ts b/src/types/index.ts index 9bb25e3f..c0269cd3 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -161,6 +161,7 @@ export interface UserPreferences { preferQuitInsteadOfHiding: boolean; runAtStartup: boolean; startMinimized: boolean; + disableNsfwAlert: boolean; } export interface Steam250Game { @@ -245,6 +246,7 @@ export interface Subscription { export interface UserDetails { id: string; username: string; + email: string | null; displayName: string; profileImageUrl: string | null; backgroundImageUrl: string | null; @@ -257,6 +259,7 @@ export interface UserProfile { id: string; displayName: string; profileImageUrl: string | null; + email: string | null; backgroundImageUrl: string | null; profileVisibility: ProfileVisibility; libraryGames: UserGame[]; @@ -373,4 +376,4 @@ export interface ComparedAchievements { export * from "./steam.types"; export * from "./real-debrid.types"; export * from "./ludusavi.types"; -export * from "./howlongtobeat.types"; +export * from "./how-long-to-beat.types"; diff --git a/yarn.lock b/yarn.lock index d241181c..0220a873 100644 --- a/yarn.lock +++ b/yarn.lock @@ -480,11 +480,6 @@ resolved "https://registry.yarnpkg.com/@bufbuild/protobuf/-/protobuf-2.2.2.tgz#1a6d89603fb215dc4d4178052d05b30b83c75402" integrity sha512-UNtPCbrwrenpmrXuRwn9jYpPoweNXj8X5sMvYgsqYyaH8jQ6LfUJSk3dJLnBK+6sfYPrF4iAIo5sd5HQ+tg75A== -"@canvas/image-data@^1.0.0": - version "1.0.0" - resolved "https://registry.npmjs.org/@canvas/image-data/-/image-data-1.0.0.tgz" - integrity sha512-BxOqI5LgsIQP1odU5KMwV9yoijleOPzHL18/YvNqF9KFSGF2K/DLlYAbDQsWqd/1nbaFuSkYD/191dpMtNh4vw== - "@commitlint/cli@^19.5.0": version "19.5.0" resolved "https://registry.yarnpkg.com/@commitlint/cli/-/cli-19.5.0.tgz#a6e2f7f8397ddf9abd5ee5870e30a1bf51b7be2b" @@ -1071,6 +1066,11 @@ resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-2.0.3.tgz#4a2868d75d6d6963e423bcf90b7fd1be343409d3" integrity sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA== +"@intercom/messenger-js-sdk@^0.0.14": + version "0.0.14" + resolved "https://registry.yarnpkg.com/@intercom/messenger-js-sdk/-/messenger-js-sdk-0.0.14.tgz#a27999370cc0a82a2a57a779426df25a57891863" + integrity sha512-2dH4BDAh9EI90K7hUkAdZ76W79LM45Sd1OBX7t6Vzy8twpNiQ5X+7sH9G5hlJlkSGnf+vFWlFcy9TOYAyEs1hA== + "@isaacs/cliui@^8.0.2": version "8.0.2" resolved "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz" @@ -1090,21 +1090,6 @@ dependencies: minipass "^7.0.4" -"@jimp/bmp@^0.22.12": - version "0.22.12" - resolved "https://registry.yarnpkg.com/@jimp/bmp/-/bmp-0.22.12.tgz#0316044dc7b1a90274aef266d50349347fb864d4" - integrity sha512-aeI64HD0npropd+AR76MCcvvRaa+Qck6loCOS03CkkxGHN5/r336qTM5HPUdHKMDOGzqknuVPA8+kK1t03z12g== - dependencies: - "@jimp/utils" "^0.22.12" - bmp-js "^0.1.0" - -"@jimp/utils@^0.22.12": - version "0.22.12" - resolved "https://registry.npmjs.org/@jimp/utils/-/utils-0.22.12.tgz" - integrity sha512-yJ5cWUknGnilBq97ZXOyOS0HhsHOyAyjHwYfHxGbSyMTohgQI6sVyE8KPgDwH8HHW/nMKXk8TrSwAE71zt716Q== - dependencies: - regenerator-runtime "^0.13.3" - "@jridgewell/gen-mapping@^0.3.5": version "0.3.5" resolved "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz" @@ -1620,7 +1605,7 @@ "@tokenizer/token@^0.3.0": version "0.3.0" - resolved "https://registry.npmjs.org/@tokenizer/token/-/token-0.3.0.tgz" + resolved "https://registry.yarnpkg.com/@tokenizer/token/-/token-0.3.0.tgz#fe98a93fe789247e998c75e74e9c7c63217aa276" integrity sha512-OvjF+z51L3ov0OyAU0duzsYuvO01PH7x4t6DJx+guahgTnBHkhJdG7soQeTSFLWN3efnHyibZ4Z8l2EuWwJN3A== "@tootallnate/once@2": @@ -2523,11 +2508,6 @@ bluebird@^3.5.5: resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.2.tgz#9f229c15be272454ffa973ace0dbee79a1b0c36f" integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg== -bmp-js@^0.1.0: - version "0.1.0" - resolved "https://registry.yarnpkg.com/bmp-js/-/bmp-js-0.1.0.tgz#e05a63f796a6c1ff25f4771ec7adadc148c07233" - integrity sha512-vHdS19CnY3hwiNdkaqk93DvjVLfbEcI8mys4UjuWrlX1haDmroo8o4xCzh4wD6DGV6HxRCyauwhHRqMTfERtjw== - boolean@^3.0.1: version "3.2.0" resolved "https://registry.yarnpkg.com/boolean/-/boolean-3.2.0.tgz#9e5294af4e98314494cbb17979fa54ca159f116b" @@ -3139,23 +3119,6 @@ decimal.js@^10.4.3: resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.4.3.tgz#1044092884d245d1b7f65725fa4ad4c6f781cc23" integrity sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA== -decode-bmp@^0.2.0: - version "0.2.1" - resolved "https://registry.yarnpkg.com/decode-bmp/-/decode-bmp-0.2.1.tgz#cec3e0197ec3b6c60f02220f50e8757030ff2427" - integrity sha512-NiOaGe+GN0KJqi2STf24hfMkFitDUaIoUU3eKvP/wAbLe8o6FuW5n/x7MHPR0HKvBokp6MQY/j7w8lewEeVCIA== - dependencies: - "@canvas/image-data" "^1.0.0" - to-data-view "^1.1.0" - -decode-ico@^0.4.1: - version "0.4.1" - resolved "https://registry.yarnpkg.com/decode-ico/-/decode-ico-0.4.1.tgz#e0f7373081532c7b8495bd51fb225d354e14de25" - integrity sha512-69NZfbKIzux1vBOd31al3XnMnH+2mqDhEgLdpygErm4d60N+UwA5Sq5WFjmEDQzumgB9fElojGwWG0vybVfFmA== - dependencies: - "@canvas/image-data" "^1.0.0" - decode-bmp "^0.2.0" - to-data-view "^1.1.0" - decompress-response@^6.0.0: version "6.0.0" resolved "https://registry.yarnpkg.com/decompress-response/-/decompress-response-6.0.0.tgz#ca387612ddb7e104bd16d85aab00d5ecf09c66fc" @@ -3967,13 +3930,13 @@ file-entry-cache@^6.0.1: dependencies: flat-cache "^3.0.4" -file-type@^19.0.0: - version "19.5.0" - resolved "https://registry.yarnpkg.com/file-type/-/file-type-19.5.0.tgz#c13c5eca9c1c7270f6d5fbff70331b3c976f92b5" - integrity sha512-dMuq6WWnP6BpQY0zYJNpTtQWgeCImSMG0BTIzUBXvxbwc1HWP/E7AE4UWU9XSCOPGJuOHda0HpDnwM2FW+d90A== +file-type@^19.6.0: + version "19.6.0" + resolved "https://registry.yarnpkg.com/file-type/-/file-type-19.6.0.tgz#b43d8870453363891884cf5e79bb3e4464f2efd3" + integrity sha512-VZR5I7k5wkD0HgFnMsq5hOsSc710MJMu5Nc5QYsbe38NN5iPV/XTObYLc/cpttRTf6lX538+5uO1ZQRhYibiZQ== dependencies: get-stream "^9.0.1" - strtok3 "^8.1.0" + strtok3 "^9.0.1" token-types "^6.0.0" uint8array-extras "^1.3.0" @@ -4529,18 +4492,6 @@ i18next@^23.11.2: dependencies: "@babel/runtime" "^7.23.2" -icojs@^0.19.4: - version "0.19.4" - resolved "https://registry.yarnpkg.com/icojs/-/icojs-0.19.4.tgz#fdbc9e61a0945ed1d331beb358d67f72cf7d78dc" - integrity sha512-86oNepPk2jAmbb96BPeucZI7HoSBobFlXDhhjIbwRb3wkQpvdBO5HO9KtMUNzMFT3qqQZsjLsfW+L0/9Rl9VqA== - dependencies: - "@jimp/bmp" "^0.22.12" - decode-ico "^0.4.1" - file-type "^19.0.0" - jpeg-js "^0.4.4" - pngjs "^7.0.0" - to-data-view "^2.0.0" - iconv-corefoundation@^1.1.7: version "1.1.7" resolved "https://registry.yarnpkg.com/iconv-corefoundation/-/iconv-corefoundation-1.1.7.tgz#31065e6ab2c9272154c8b0821151e2c88f1b002a" @@ -4955,11 +4906,6 @@ jiti@^1.19.1: resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.6.tgz#6c7f7398dd4b3142767f9a168af2f317a428d268" integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w== -jpeg-js@^0.4.4: - version "0.4.4" - resolved "https://registry.yarnpkg.com/jpeg-js/-/jpeg-js-0.4.4.tgz#a9f1c6f1f9f0fa80cdb3484ed9635054d28936aa" - integrity sha512-WZzeDOEtTOBK4Mdsar0IqEU5sMr3vSV2RqkAIzUEV2BHnUfKGyswWFPFwK5EeDo93K3FohSHbLAjj0s1Wzd+dg== - "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" @@ -5961,10 +5907,10 @@ pe-library@^0.4.1: resolved "https://registry.yarnpkg.com/pe-library/-/pe-library-0.4.1.tgz#e269be0340dcb13aa6949d743da7d658c3e2fbea" integrity sha512-eRWB5LBz7PpDu4PUlwT0PhnQfTQJlDDdPa35urV4Osrm0t0AqQFGn+UIkU3klZvwJ8KPO3VbBFsXquA6p6kqZw== -peek-readable@^5.1.4: - version "5.2.0" - resolved "https://registry.yarnpkg.com/peek-readable/-/peek-readable-5.2.0.tgz#7458f18126217c154938c32a185f5d05f3df3710" - integrity sha512-U94a+eXHzct7vAd19GH3UQ2dH4Satbng0MyYTMaQatL0pvYYL5CTPR25HBhKtecl+4bfu1/i3vC6k0hydO5Vcw== +peek-readable@^5.3.1: + version "5.3.1" + resolved "https://registry.yarnpkg.com/peek-readable/-/peek-readable-5.3.1.tgz#9cc2c275cceda9f3d07a988f4f664c2080387dff" + integrity sha512-GVlENSDW6KHaXcd9zkZltB7tCLosKB/4Hg0fqBJkAoBgYG2Tn1xtMgXtSUuMU9AK/gCm/tTdT8mgAeF4YNeeqw== pend@~1.2.0: version "1.2.0" @@ -6011,11 +5957,6 @@ plist@^3.0.4, plist@^3.0.5, plist@^3.1.0: base64-js "^1.5.1" xmlbuilder "^15.1.1" -pngjs@^7.0.0: - version "7.0.0" - resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-7.0.0.tgz#a8b7446020ebbc6ac739db6c5415a65d17090e26" - integrity sha512-LKWqWJRhstyYo9pGvgor/ivk2w94eSjE3RGVuzLGlr3NmD8bf7RcYGze1mNdEHRP6TRP6rMuDHk5t44hnTRyow== - possible-typed-array-names@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz#89bb63c6fada2c3e90adc4a647beeeb39cc7bf8f" @@ -6262,11 +6203,6 @@ reflect.getprototypeof@^1.0.4: globalthis "^1.0.3" which-builtin-type "^1.1.3" -regenerator-runtime@^0.13.3: - version "0.13.11" - resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9" - integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg== - regenerator-runtime@^0.14.0: version "0.14.1" resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz#356ade10263f685dda125100cd862c1db895327f" @@ -6971,13 +6907,13 @@ strip-json-comments@~2.0.1: resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a" integrity sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ== -strtok3@^8.1.0: - version "8.1.0" - resolved "https://registry.yarnpkg.com/strtok3/-/strtok3-8.1.0.tgz#9234a6f42ee03bf8569c7ae0788d5fd4e67e095b" - integrity sha512-ExzDvHYPj6F6QkSNe/JxSlBxTh3OrI6wrAIz53ulxo1c4hBJ1bT9C/JrAthEKHWG9riVH3Xzg7B03Oxty6S2Lw== +strtok3@^9.0.1: + version "9.0.1" + resolved "https://registry.yarnpkg.com/strtok3/-/strtok3-9.0.1.tgz#7e3d7bbd2b829c9def6a7bb90d82e240abdd32be" + integrity sha512-ERPW+XkvX9W2A+ov07iy+ZFJpVdik04GhDA4eVogiG9hpC97Kem2iucyzhFxbFRvQ5o2UckFtKZdp1hkGvnrEw== dependencies: "@tokenizer/token" "^0.3.0" - peek-readable "^5.1.4" + peek-readable "^5.3.1" sudo-prompt@^9.2.1: version "9.2.1" @@ -7154,16 +7090,6 @@ tmp@^0.2.0: resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.2.3.tgz#eb783cc22bc1e8bebd0671476d46ea4eb32a79ae" integrity sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w== -to-data-view@^1.1.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/to-data-view/-/to-data-view-1.1.0.tgz#08d6492b0b8deb9b29bdf1f61c23eadfa8994d00" - integrity sha512-1eAdufMg6mwgmlojAx3QeMnzB/BTVp7Tbndi3U7ftcT2zCZadjxkkmLmd97zmaxWi+sgGcgWrokmpEoy0Dn0vQ== - -to-data-view@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/to-data-view/-/to-data-view-2.0.0.tgz#4cc3f5c9eb59514a7436fc54c587c3c34c9b1d60" - integrity sha512-RGEM5KqlPHr+WVTPmGNAXNeFEmsBnlkxXaIfEpUYV0AST2Z5W1EGq9L/MENFrMMmL2WQr1wjkmZy/M92eKhjYA== - to-fast-properties@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e" From 2c5fb8a0379c1515a3f2b4874ea5ec23c7bc8344 Mon Sep 17 00:00:00 2001 From: Chubby Granny Chaser Date: Wed, 15 Jan 2025 16:58:59 +0000 Subject: [PATCH 03/74] feat: adding initial leveldb configuration --- electron.vite.config.ts | 7 ++ package.json | 1 + src/main/constants.ts | 7 +- src/main/data-source.ts | 4 -- src/main/entity/index.ts | 2 - src/main/entity/user-auth.entity.ts | 45 ------------ src/main/entity/user-subscription.entity.ts | 42 ------------ src/main/events/auth/get-session-hash.ts | 13 +++- src/main/events/auth/sign-out.ts | 21 +++--- src/main/events/misc/open-checkout.ts | 14 ++-- src/main/events/user/get-user-friends.ts | 11 +-- src/main/repository.ts | 7 -- src/main/services/hydra-api.ts | 71 ++++++++++++------- src/main/services/index.ts | 1 + src/main/services/user/get-user-data.ts | 64 +++++++---------- src/renderer/src/components/modal/modal.tsx | 1 + src/types/index.ts | 11 +-- yarn.lock | 76 +++++++++++++++++++++ 18 files changed, 202 insertions(+), 196 deletions(-) delete mode 100644 src/main/entity/user-auth.entity.ts delete mode 100644 src/main/entity/user-subscription.entity.ts diff --git a/electron.vite.config.ts b/electron.vite.config.ts index cd08b6d4..2b7048c4 100644 --- a/electron.vite.config.ts +++ b/electron.vite.config.ts @@ -38,6 +38,13 @@ export default defineConfig(({ mode }) => { build: { sourcemap: true, }, + css: { + preprocessorOptions: { + scss: { + api: "modern", + }, + }, + }, resolve: { alias: { "@renderer": resolve("src/renderer/src"), diff --git a/package.json b/package.json index 2895f20c..4630ad41 100644 --- a/package.json +++ b/package.json @@ -62,6 +62,7 @@ "jsdom": "^24.0.0", "jsonwebtoken": "^9.0.2", "knex": "^3.1.0", + "level": "^9.0.0", "lodash-es": "^4.17.21", "parse-torrent": "^11.0.17", "piscina": "^4.7.0", diff --git a/src/main/constants.ts b/src/main/constants.ts index b98b5935..f9d9c3e2 100644 --- a/src/main/constants.ts +++ b/src/main/constants.ts @@ -7,13 +7,18 @@ export const defaultDownloadsPath = app.getPath("downloads"); export const isStaging = import.meta.env.MAIN_VITE_API_URL.includes("staging"); +export const levelDatabasePath = path.join( + app.getPath("userData"), + `hydra-db${isStaging ? "-staging" : ""}` +); + export const databaseDirectory = path.join(app.getPath("appData"), "hydra"); export const databasePath = path.join( databaseDirectory, isStaging ? "hydra_test.db" : "hydra.db" ); -export const logsPath = path.join(app.getPath("appData"), "hydra", "logs"); +export const logsPath = path.join(app.getPath("userData"), "hydra", "logs"); export const seedsPath = app.isPackaged ? path.join(process.resourcesPath, "seeds") diff --git a/src/main/data-source.ts b/src/main/data-source.ts index 51c8522e..05fdb04d 100644 --- a/src/main/data-source.ts +++ b/src/main/data-source.ts @@ -4,9 +4,7 @@ import { Game, GameShopCache, UserPreferences, - UserAuth, GameAchievement, - UserSubscription, } from "@main/entity"; import { databasePath } from "./constants"; @@ -15,9 +13,7 @@ export const dataSource = new DataSource({ type: "better-sqlite3", entities: [ Game, - UserAuth, UserPreferences, - UserSubscription, GameShopCache, DownloadQueue, GameAchievement, diff --git a/src/main/entity/index.ts b/src/main/entity/index.ts index 1625ac8a..ab0ebff9 100644 --- a/src/main/entity/index.ts +++ b/src/main/entity/index.ts @@ -1,7 +1,5 @@ export * from "./game.entity"; -export * from "./user-auth.entity"; export * from "./user-preferences.entity"; -export * from "./user-subscription.entity"; export * from "./game-shop-cache.entity"; export * from "./game.entity"; export * from "./game-achievements.entity"; diff --git a/src/main/entity/user-auth.entity.ts b/src/main/entity/user-auth.entity.ts deleted file mode 100644 index f34e23ec..00000000 --- a/src/main/entity/user-auth.entity.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { - Entity, - PrimaryGeneratedColumn, - Column, - CreateDateColumn, - UpdateDateColumn, - OneToOne, -} from "typeorm"; -import { UserSubscription } from "./user-subscription.entity"; - -@Entity("user_auth") -export class UserAuth { - @PrimaryGeneratedColumn() - id: number; - - @Column("text", { default: "" }) - userId: string; - - @Column("text", { default: "" }) - displayName: string; - - @Column("text", { nullable: true }) - profileImageUrl: string | null; - - @Column("text", { nullable: true }) - backgroundImageUrl: string | null; - - @Column("text", { default: "" }) - accessToken: string; - - @Column("text", { default: "" }) - refreshToken: string; - - @Column("int", { default: 0 }) - tokenExpirationTimestamp: number; - - @OneToOne("UserSubscription", "user") - subscription: UserSubscription | null; - - @CreateDateColumn() - createdAt: Date; - - @UpdateDateColumn() - updatedAt: Date; -} diff --git a/src/main/entity/user-subscription.entity.ts b/src/main/entity/user-subscription.entity.ts deleted file mode 100644 index e74ada48..00000000 --- a/src/main/entity/user-subscription.entity.ts +++ /dev/null @@ -1,42 +0,0 @@ -import type { SubscriptionStatus } from "@types"; -import { - Entity, - PrimaryGeneratedColumn, - Column, - CreateDateColumn, - UpdateDateColumn, - OneToOne, - JoinColumn, -} from "typeorm"; -import { UserAuth } from "./user-auth.entity"; - -@Entity("user_subscription") -export class UserSubscription { - @PrimaryGeneratedColumn() - id: number; - - @Column("text", { default: "" }) - subscriptionId: string; - - @OneToOne("UserAuth", "subscription") - @JoinColumn() - user: UserAuth; - - @Column("text", { default: "" }) - status: SubscriptionStatus; - - @Column("text", { default: "" }) - planId: string; - - @Column("text", { default: "" }) - planName: string; - - @Column("datetime", { nullable: true }) - expiresAt: Date | null; - - @CreateDateColumn() - createdAt: Date; - - @UpdateDateColumn() - updatedAt: Date; -} diff --git a/src/main/events/auth/get-session-hash.ts b/src/main/events/auth/get-session-hash.ts index c9dd39cc..293fb62e 100644 --- a/src/main/events/auth/get-session-hash.ts +++ b/src/main/events/auth/get-session-hash.ts @@ -1,13 +1,20 @@ import jwt from "jsonwebtoken"; -import { userAuthRepository } from "@main/repository"; import { registerEvent } from "../register-event"; +import { db } from "@main/level"; +import type { Auth } from "@types"; +import { levelKeys } from "@main/level/sublevels/keys"; +import { Crypto } from "@main/services"; const getSessionHash = async (_event: Electron.IpcMainInvokeEvent) => { - const auth = await userAuthRepository.findOne({ where: { id: 1 } }); + const auth = await db.get(levelKeys.auth, { + valueEncoding: "json", + }); if (!auth) return null; - const payload = jwt.decode(auth.accessToken) as jwt.JwtPayload; + const payload = jwt.decode( + Crypto.decrypt(auth.accessToken) + ) as jwt.JwtPayload; if (!payload) return null; diff --git a/src/main/events/auth/sign-out.ts b/src/main/events/auth/sign-out.ts index 6b720015..1fb3a054 100644 --- a/src/main/events/auth/sign-out.ts +++ b/src/main/events/auth/sign-out.ts @@ -1,8 +1,10 @@ import { registerEvent } from "../register-event"; import { DownloadManager, HydraApi, gamesPlaytime } from "@main/services"; import { dataSource } from "@main/data-source"; -import { DownloadQueue, Game, UserAuth, UserSubscription } from "@main/entity"; +import { DownloadQueue, Game } from "@main/entity"; import { PythonRPC } from "@main/services/python-rpc"; +import { db } from "@main/level"; +import { levelKeys } from "@main/level/sublevels/keys"; const signOut = async (_event: Electron.IpcMainInvokeEvent) => { const databaseOperations = dataSource @@ -11,13 +13,16 @@ const signOut = async (_event: Electron.IpcMainInvokeEvent) => { await transactionalEntityManager.getRepository(Game).delete({}); - await transactionalEntityManager - .getRepository(UserAuth) - .delete({ id: 1 }); - - await transactionalEntityManager - .getRepository(UserSubscription) - .delete({ id: 1 }); + await db.batch([ + { + type: "del", + key: levelKeys.auth, + }, + { + type: "del", + key: levelKeys.user, + }, + ]); }) .then(() => { /* Removes all games being played */ diff --git a/src/main/events/misc/open-checkout.ts b/src/main/events/misc/open-checkout.ts index ba48f03b..76e7fe09 100644 --- a/src/main/events/misc/open-checkout.ts +++ b/src/main/events/misc/open-checkout.ts @@ -1,17 +1,21 @@ import { shell } from "electron"; import { registerEvent } from "../register-event"; -import { userAuthRepository } from "@main/repository"; -import { HydraApi } from "@main/services"; +import { Crypto, HydraApi } from "@main/services"; +import { db } from "@main/level"; +import type { Auth } from "@types"; +import { levelKeys } from "@main/level/sublevels/keys"; const openCheckout = async (_event: Electron.IpcMainInvokeEvent) => { - const userAuth = await userAuthRepository.findOne({ where: { id: 1 } }); + const auth = await db.get(levelKeys.auth, { + valueEncoding: "json", + }); - if (!userAuth) { + if (!auth) { return; } const paymentToken = await HydraApi.post("/auth/payment", { - refreshToken: userAuth.refreshToken, + refreshToken: Crypto.decrypt(auth.refreshToken), }).then((response) => response.accessToken); const params = new URLSearchParams({ diff --git a/src/main/events/user/get-user-friends.ts b/src/main/events/user/get-user-friends.ts index 9a6f156c..7c308506 100644 --- a/src/main/events/user/get-user-friends.ts +++ b/src/main/events/user/get-user-friends.ts @@ -1,16 +1,19 @@ -import { userAuthRepository } from "@main/repository"; +import { db } from "@main/level"; import { registerEvent } from "../register-event"; import { HydraApi } from "@main/services"; -import type { UserFriends } from "@types"; +import type { User, UserFriends } from "@types"; +import { levelKeys } from "@main/level/sublevels/keys"; export const getUserFriends = async ( userId: string, take: number, skip: number ): Promise => { - const loggedUser = await userAuthRepository.findOne({ where: { id: 1 } }); + const user = await db.get(levelKeys.user, { + valueEncoding: "json", + }); - if (loggedUser?.userId === userId) { + if (user?.id === userId) { return HydraApi.get(`/profile/friends`, { take, skip }); } diff --git a/src/main/repository.ts b/src/main/repository.ts index e0c4204e..ef120f7e 100644 --- a/src/main/repository.ts +++ b/src/main/repository.ts @@ -4,9 +4,7 @@ import { Game, GameShopCache, UserPreferences, - UserAuth, GameAchievement, - UserSubscription, } from "@main/entity"; export const gameRepository = dataSource.getRepository(Game); @@ -18,10 +16,5 @@ export const gameShopCacheRepository = dataSource.getRepository(GameShopCache); export const downloadQueueRepository = dataSource.getRepository(DownloadQueue); -export const userAuthRepository = dataSource.getRepository(UserAuth); - -export const userSubscriptionRepository = - dataSource.getRepository(UserSubscription); - export const gameAchievementRepository = dataSource.getRepository(GameAchievement); diff --git a/src/main/services/hydra-api.ts b/src/main/services/hydra-api.ts index 63dd9b16..6cf9a8af 100644 --- a/src/main/services/hydra-api.ts +++ b/src/main/services/hydra-api.ts @@ -1,7 +1,3 @@ -import { - userAuthRepository, - userSubscriptionRepository, -} from "@main/repository"; import axios, { AxiosError, AxiosInstance } from "axios"; import { WindowManager } from "./window-manager"; import url from "url"; @@ -13,6 +9,10 @@ import { omit } from "lodash-es"; import { appVersion } from "@main/constants"; import { getUserData } from "./user/get-user-data"; import { isFuture, isToday } from "date-fns"; +import { db } from "@main/level"; +import { levelKeys } from "@main/level/sublevels/keys"; +import type { Auth, User } from "@types"; +import { Crypto } from "./crypto"; interface HydraApiOptions { needsAuth?: boolean; @@ -77,14 +77,14 @@ export class HydraApi { tokenExpirationTimestamp ); - await userAuthRepository.upsert( + db.put( + levelKeys.auth, { - id: 1, - accessToken, + accessToken: Crypto.encrypt(accessToken), + refreshToken: Crypto.encrypt(refreshToken), tokenExpirationTimestamp, - refreshToken, }, - ["id"] + { valueEncoding: "json" } ); await getUserData().then((userDetails) => { @@ -186,17 +186,23 @@ export class HydraApi { ); } - const userAuth = await userAuthRepository.findOne({ - where: { id: 1 }, - relations: { subscription: true }, + const result = await db.getMany([levelKeys.auth, levelKeys.user], { + valueEncoding: "json", }); + const userAuth = result.at(0) as Auth | undefined; + const user = result.at(1) as User | undefined; + this.userAuth = { - authToken: userAuth?.accessToken ?? "", - refreshToken: userAuth?.refreshToken ?? "", + authToken: userAuth?.accessToken + ? Crypto.decrypt(userAuth.accessToken) + : "", + refreshToken: userAuth?.refreshToken + ? Crypto.decrypt(userAuth.refreshToken) + : "", expirationTimestamp: userAuth?.tokenExpirationTimestamp ?? 0, - subscription: userAuth?.subscription - ? { expiresAt: userAuth.subscription?.expiresAt } + subscription: user?.subscription + ? { expiresAt: user.subscription?.expiresAt } : null, }; @@ -239,14 +245,19 @@ export class HydraApi { this.userAuth.expirationTimestamp ); - userAuthRepository.upsert( - { - id: 1, - accessToken, - tokenExpirationTimestamp, - }, - ["id"] - ); + await db + .get(levelKeys.auth, { valueEncoding: "json" }) + .then((auth) => { + return db.put( + levelKeys.auth, + { + ...auth, + accessToken: Crypto.encrypt(accessToken), + tokenExpirationTimestamp, + }, + { valueEncoding: "json" } + ); + }); } catch (err) { this.handleUnauthorizedError(err); } @@ -276,8 +287,16 @@ export class HydraApi { subscription: null, }; - userAuthRepository.delete({ id: 1 }); - userSubscriptionRepository.delete({ id: 1 }); + db.batch([ + { + type: "del", + key: levelKeys.auth, + }, + { + type: "del", + key: levelKeys.user, + }, + ]); this.sendSignOutEvent(); } diff --git a/src/main/services/index.ts b/src/main/services/index.ts index 5aaf5322..d2034f15 100644 --- a/src/main/services/index.ts +++ b/src/main/services/index.ts @@ -1,3 +1,4 @@ +export * from "./crypto"; export * from "./logger"; export * from "./steam"; export * from "./steam-250"; diff --git a/src/main/services/user/get-user-data.ts b/src/main/services/user/get-user-data.ts index 7e924454..e6cf1c71 100644 --- a/src/main/services/user/get-user-data.ts +++ b/src/main/services/user/get-user-data.ts @@ -1,43 +1,30 @@ -import type { ProfileVisibility, UserDetails } from "@types"; +import { User, type ProfileVisibility, type UserDetails } from "@types"; import { HydraApi } from "../hydra-api"; -import { - userAuthRepository, - userSubscriptionRepository, -} from "@main/repository"; import { UserNotLoggedInError } from "@shared"; import { logger } from "../logger"; +import { db } from "@main/level"; +import { levelKeys } from "@main/level/sublevels/keys"; -export const getUserData = () => { +export const getUserData = async () => { return HydraApi.get(`/profile/me`) .then(async (me) => { - userAuthRepository.upsert( - { - id: 1, - displayName: me.displayName, - profileImageUrl: me.profileImageUrl, - backgroundImageUrl: me.backgroundImageUrl, - userId: me.id, - }, - ["id"] + db.get(levelKeys.user, { valueEncoding: "json" }).then( + (user) => { + return db.put( + levelKeys.user, + { + ...user, + id: me.id, + displayName: me.displayName, + profileImageUrl: me.profileImageUrl, + backgroundImageUrl: me.backgroundImageUrl, + subscription: me.subscription, + }, + { valueEncoding: "json" } + ); + } ); - if (me.subscription) { - await userSubscriptionRepository.upsert( - { - id: 1, - subscriptionId: me.subscription?.id || "", - status: me.subscription?.status || "", - planId: me.subscription?.plan.id || "", - planName: me.subscription?.plan.name || "", - expiresAt: me.subscription?.expiresAt || null, - user: { id: 1 }, - }, - ["id"] - ); - } else { - await userSubscriptionRepository.delete({ id: 1 }); - } - return me; }) .catch(async (err) => { @@ -46,15 +33,14 @@ export const getUserData = () => { return null; } logger.error("Failed to get logged user"); - const loggedUser = await userAuthRepository.findOne({ - where: { id: 1 }, - relations: { subscription: true }, + + const loggedUser = await db.get(levelKeys.user, { + valueEncoding: "json", }); if (loggedUser) { return { ...loggedUser, - id: loggedUser.userId, username: "", bio: "", email: null, @@ -64,11 +50,11 @@ export const getUserData = () => { }, subscription: loggedUser.subscription ? { - id: loggedUser.subscription.subscriptionId, + id: loggedUser.subscription.id, status: loggedUser.subscription.status, plan: { - id: loggedUser.subscription.planId, - name: loggedUser.subscription.planName, + id: loggedUser.subscription.plan.id, + name: loggedUser.subscription.plan.name, }, expiresAt: loggedUser.subscription.expiresAt, } diff --git a/src/renderer/src/components/modal/modal.tsx b/src/renderer/src/components/modal/modal.tsx index d8d0554d..af09ef38 100644 --- a/src/renderer/src/components/modal/modal.tsx +++ b/src/renderer/src/components/modal/modal.tsx @@ -52,6 +52,7 @@ export function Modal({ ) ) return false; + const openModals = document.querySelectorAll("[role=dialog]"); return ( diff --git a/src/types/index.ts b/src/types/index.ts index 345893a5..bae42702 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -248,16 +248,6 @@ export interface UserProfileCurrentGame extends Omit { export type ProfileVisibility = "PUBLIC" | "PRIVATE" | "FRIENDS"; -export type SubscriptionStatus = "active" | "pending" | "cancelled"; - -export interface Subscription { - id: string; - status: SubscriptionStatus; - plan: { id: string; name: string }; - expiresAt: string | null; - paymentMethod: "pix" | "paypal"; -} - export interface UserDetails { id: string; username: string; @@ -421,3 +411,4 @@ export * from "./real-debrid.types"; export * from "./ludusavi.types"; export * from "./how-long-to-beat.types"; export * from "./torbox.types"; +export * from "./level.types"; diff --git a/yarn.lock b/yarn.lock index 69ee75d8..4e58584e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3699,6 +3699,18 @@ abort-controller@^3.0.0: dependencies: event-target-shim "^5.0.0" +abstract-level@^2.0.0, abstract-level@^2.0.1: + version "2.0.2" + resolved "https://registry.yarnpkg.com/abstract-level/-/abstract-level-2.0.2.tgz#8d965e731afb42a72f163874410c1687fb2e4bdb" + integrity sha512-pPJixmXk/kTKLB2sSue7o4Uj6TlLD2XfaP2gWZomHVCC6cuUGX/VslQqKG1yZHfXwBb/3lS6oSTMPGzh1P1iig== + dependencies: + buffer "^6.0.3" + is-buffer "^2.0.5" + level-supports "^6.0.0" + level-transcoder "^1.0.1" + maybe-combine-errors "^1.0.0" + module-error "^1.0.1" + acorn-jsx@^5.3.2: version "5.3.2" resolved "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz" @@ -4169,6 +4181,13 @@ braces@^3.0.3, braces@~3.0.2: dependencies: fill-range "^7.1.1" +browser-level@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/browser-level/-/browser-level-2.0.0.tgz#cc63eb1322e67c44489d7fbdda5c30a2db7b59da" + integrity sha512-RuYSCHG/jwFCrK+KWA3dLSUNLKHEgIYhO5ORPjJMjCt7T3e+RzpIDmYKWRHxq2pfKGXjlRuEff7y7RESAAgzew== + dependencies: + abstract-level "^2.0.1" + browserslist@^4.22.2, browserslist@^4.23.1: version "4.24.0" resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.24.0.tgz#a1325fe4bc80b64fda169629fc01b3d6cecd38d4" @@ -4421,6 +4440,16 @@ ci-info@^3.2.0: resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.9.0.tgz#4279a62028a7b1f262f3473fc9605f5e218c59b4" integrity sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ== +classic-level@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/classic-level/-/classic-level-2.0.0.tgz#6fd9ca686bbcd645e35caaf403c3f3a56495d11b" + integrity sha512-ftiMvKgCQK+OppXcvMieDoYlYLYWhScK6yZRFBrrlHQRbm4k6Gr+yDgu/wt3V0k1/jtNbuiXAsRmuAFcD0Tx5Q== + dependencies: + abstract-level "^2.0.0" + module-error "^1.0.1" + napi-macros "^2.2.2" + node-gyp-build "^4.3.0" + classnames@^2.2.1, classnames@^2.2.6, classnames@^2.5.1: version "2.5.1" resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.5.1.tgz#ba774c614be0f016da105c858e7159eae8e7687b" @@ -6459,6 +6488,11 @@ is-boolean-object@^1.2.0: call-bound "^1.0.2" has-tostringtag "^1.0.2" +is-buffer@^2.0.5: + version "2.0.5" + resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-2.0.5.tgz#ebc252e400d22ff8d77fa09888821a24a658c191" + integrity sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ== + is-callable@^1.1.3, is-callable@^1.1.4, is-callable@^1.2.7: version "1.2.7" resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.7.tgz#3bc2a85ea742d9e36205dcacdd72ca1fdc51b055" @@ -6958,6 +6992,28 @@ lazy-val@^1.0.5: resolved "https://registry.yarnpkg.com/lazy-val/-/lazy-val-1.0.5.tgz#6cf3b9f5bc31cee7ee3e369c0832b7583dcd923d" integrity sha512-0/BnGCCfyUMkBpeDgWihanIAF9JmZhHBgUhEqzvf+adhNGLoP6TaiI5oF8oyb3I45P+PcnrqihSf01M0l0G5+Q== +level-supports@^6.0.0: + version "6.2.0" + resolved "https://registry.yarnpkg.com/level-supports/-/level-supports-6.2.0.tgz#e78b228973a24acdc5199c5f51e244e70f26c611" + integrity sha512-QNxVXP0IRnBmMsJIh+sb2kwNCYcKciQZJEt+L1hPCHrKNELllXhvrlClVHXBYZVT+a7aTSM6StgNXdAldoab3w== + +level-transcoder@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/level-transcoder/-/level-transcoder-1.0.1.tgz#f8cef5990c4f1283d4c86d949e73631b0bc8ba9c" + integrity sha512-t7bFwFtsQeD8cl8NIoQ2iwxA0CL/9IFw7/9gAjOonH0PWTTiRfY7Hq+Ejbsxh86tXobDQ6IOiddjNYIfOBs06w== + dependencies: + buffer "^6.0.3" + module-error "^1.0.1" + +level@^9.0.0: + version "9.0.0" + resolved "https://registry.yarnpkg.com/level/-/level-9.0.0.tgz#880aa9d341a5411e36bed77f4fa233f425b492a8" + integrity sha512-n+mVuf63mUEkd8NUx7gwxY+QF5vtkibv6fXTGUgtHWLPDaA5/XZjLcI/Q1nQ8k6OttHT6Ezt+7nSEXsRUfHtOQ== + dependencies: + abstract-level "^2.0.1" + browser-level "^2.0.0" + classic-level "^2.0.0" + levn@^0.4.1: version "0.4.1" resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade" @@ -7198,6 +7254,11 @@ math-intrinsics@^1.0.0: resolved "https://registry.yarnpkg.com/math-intrinsics/-/math-intrinsics-1.0.0.tgz#4e04bf87c85aa51e90d078dac2252b4eb5260817" integrity sha512-4MqMiKP90ybymYvsut0CH2g4XWbfLtmlCkXmtmdcDCxNB+mQcu1w/1+L/VD7vi/PSv7X2JYV7SCcR+jiPXnQtA== +maybe-combine-errors@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/maybe-combine-errors/-/maybe-combine-errors-1.0.0.tgz#e9592832e61fc47643a92cff3c1f33e27211e5be" + integrity sha512-eefp6IduNPT6fVdwPp+1NgD0PML1NU5P6j1Mj5nz1nidX8/sWY7119WL8vTAHgqfsY74TzW0w1XPgdYEKkGZ5A== + media-query-parser@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/media-query-parser/-/media-query-parser-2.0.2.tgz#ff79e56cee92615a304a1c2fa4f2bd056c0a1d29" @@ -7414,6 +7475,11 @@ modern-ahocorasick@^1.0.0: resolved "https://registry.yarnpkg.com/modern-ahocorasick/-/modern-ahocorasick-1.0.1.tgz#dec373444f51b5458ac05216a8ec376e126dd283" integrity sha512-yoe+JbhTClckZ67b2itRtistFKf8yPYelHLc7e5xAwtNAXxM6wJTUx2C7QeVSJFDzKT7bCIFyBVybPMKvmB9AA== +module-error@^1.0.1: + version "1.0.2" + resolved "https://registry.yarnpkg.com/module-error/-/module-error-1.0.2.tgz#8d1a48897ca883f47a45816d4fb3e3c6ba404d86" + integrity sha512-0yuvsqSCv8LbaOKhnsQ/T5JhyFlCYLPXK3U2sgV10zoKQwzs/MyfuQUOZQ1V/6OCOJsK/TRgNVrPuPDqtdMFtA== + ms@2.1.2: version "2.1.2" resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009" @@ -7448,6 +7514,11 @@ napi-build-utils@^1.0.1: resolved "https://registry.yarnpkg.com/napi-build-utils/-/napi-build-utils-1.0.2.tgz#b1fddc0b2c46e380a0b7a76f984dd47c41a13806" integrity sha512-ONmRUqK7zj7DWX0D9ADe03wbwOBZxNAfF20PlGfCWQcD3+/MakShIHrMqx9YwPTfxDdF1zLeL+RGZiR9kGMLdg== +napi-macros@^2.2.2: + version "2.2.2" + resolved "https://registry.yarnpkg.com/napi-macros/-/napi-macros-2.2.2.tgz#817fef20c3e0e40a963fbf7b37d1600bd0201044" + integrity sha512-hmEVtAGYzVQpCKdbQea4skABsdXW4RUh5t5mJ2zzqowJS2OyXZTU1KhDVFhx+NlWZ4ap9mqR9TcDO3LTTttd+g== + natural-compare@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7" @@ -7506,6 +7577,11 @@ node-fetch@^3.3.0: fetch-blob "^3.1.4" formdata-polyfill "^4.0.10" +node-gyp-build@^4.3.0: + version "4.8.4" + resolved "https://registry.yarnpkg.com/node-gyp-build/-/node-gyp-build-4.8.4.tgz#8a70ee85464ae52327772a90d66c6077a900cfc8" + integrity sha512-LA4ZjwlnUblHVgq0oBF3Jl/6h/Nvs5fzBLwdEF4nuxnFdsfajde4WfxtJr3CaiH+F6ewcIB/q4jQ4UzPyid+CQ== + node-gyp@^9.0.0: version "9.4.1" resolved "https://registry.yarnpkg.com/node-gyp/-/node-gyp-9.4.1.tgz#8a1023e0d6766ecb52764cc3a734b36ff275e185" From 08bcf096411e802919acb607f7eebe56d492a90b Mon Sep 17 00:00:00 2001 From: Chubby Granny Chaser Date: Wed, 15 Jan 2025 17:00:27 +0000 Subject: [PATCH 04/74] feat: adding initial leveldb configuration --- src/main/services/hosters/datanodes.ts | 3 ++- src/types/index.ts | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/main/services/hosters/datanodes.ts b/src/main/services/hosters/datanodes.ts index d77e7d51..ae144418 100644 --- a/src/main/services/hosters/datanodes.ts +++ b/src/main/services/hosters/datanodes.ts @@ -33,7 +33,8 @@ export class DatanodesApi { "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/125.0.0.0 Safari/537.36", }, - maxRedirects: 0, validateStatus: (status: number) => status === 302 || status < 400, + maxRedirects: 0, + validateStatus: (status: number) => status === 302 || status < 400, } ); diff --git a/src/types/index.ts b/src/types/index.ts index bae42702..dd631ccb 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -1,5 +1,6 @@ import type { Cracker, DownloadSourceStatus, Downloader } from "@shared"; import type { SteamAppDetails } from "./steam.types"; +import type { Subscription } from "./level.types"; export type GameStatus = | "active" From c59b039eb4cb5a0eae558cb77cc8cedeb57ed441 Mon Sep 17 00:00:00 2001 From: Chubby Granny Chaser Date: Wed, 15 Jan 2025 17:02:40 +0000 Subject: [PATCH 05/74] fix: removing unused navigate --- src/renderer/src/pages/achievements/achievements.tsx | 2 +- .../src/pages/profile/profile-content/profile-content.tsx | 4 ---- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/src/renderer/src/pages/achievements/achievements.tsx b/src/renderer/src/pages/achievements/achievements.tsx index 605300ef..f467cf89 100644 --- a/src/renderer/src/pages/achievements/achievements.tsx +++ b/src/renderer/src/pages/achievements/achievements.tsx @@ -44,7 +44,7 @@ export default function Achievements() { .getComparedUnlockedAchievements(objectId, shop as GameShop, userId) .then(setComparedAchievements); } - }, [objectId, shop, userId]); + }, [objectId, shop, userDetails?.id, userId]); const otherUserId = userDetails?.id === userId ? null : userId; diff --git a/src/renderer/src/pages/profile/profile-content/profile-content.tsx b/src/renderer/src/pages/profile/profile-content/profile-content.tsx index 951eb41b..71788a32 100644 --- a/src/renderer/src/pages/profile/profile-content/profile-content.tsx +++ b/src/renderer/src/pages/profile/profile-content/profile-content.tsx @@ -7,7 +7,6 @@ import { SPACING_UNIT } from "@renderer/theme.css"; import * as styles from "./profile-content.css"; import { TelescopeIcon } from "@primer/octicons-react"; import { useTranslation } from "react-i18next"; -import { useNavigate } from "react-router-dom"; import { LockedProfile } from "./locked-profile"; import { ReportProfile } from "../report-profile/report-profile"; import { FriendsBox } from "./friends-box"; @@ -66,8 +65,6 @@ export function ProfileContent() { const { numberFormatter } = useFormat(); - const navigate = useNavigate(); - const usersAreFriends = useMemo(() => { return userProfile?.relation?.status === "ACCEPTED"; }, [userProfile]); @@ -148,7 +145,6 @@ export function ProfileContent() { userStats, numberFormatter, t, - navigate, statsIndex, ]); From 8b47082047b6e89adb59a39cafadcc45ea525078 Mon Sep 17 00:00:00 2001 From: Chubby Granny Chaser Date: Wed, 15 Jan 2025 17:08:22 +0000 Subject: [PATCH 06/74] fix: removing unused navigate --- src/main/level/index.ts | 3 +++ src/main/level/level.ts | 4 ++++ src/main/level/sublevels/games.ts | 7 +++++++ src/main/level/sublevels/index.ts | 1 + src/main/level/sublevels/keys.ts | 8 ++++++++ src/main/services/crypto.ts | 28 ++++++++++++++++++++++++++++ src/types/level.types.ts | 23 +++++++++++++++++++++++ 7 files changed, 74 insertions(+) create mode 100644 src/main/level/index.ts create mode 100644 src/main/level/level.ts create mode 100644 src/main/level/sublevels/games.ts create mode 100644 src/main/level/sublevels/index.ts create mode 100644 src/main/level/sublevels/keys.ts create mode 100644 src/main/services/crypto.ts create mode 100644 src/types/level.types.ts diff --git a/src/main/level/index.ts b/src/main/level/index.ts new file mode 100644 index 00000000..90a34be3 --- /dev/null +++ b/src/main/level/index.ts @@ -0,0 +1,3 @@ +export { db } from "./level"; + +export * from "./sublevels"; diff --git a/src/main/level/level.ts b/src/main/level/level.ts new file mode 100644 index 00000000..382c61a5 --- /dev/null +++ b/src/main/level/level.ts @@ -0,0 +1,4 @@ +import { levelDatabasePath } from "@main/constants"; +import { Level } from "level"; + +export const db = new Level(levelDatabasePath, { valueEncoding: "json" }); diff --git a/src/main/level/sublevels/games.ts b/src/main/level/sublevels/games.ts new file mode 100644 index 00000000..bc0cad30 --- /dev/null +++ b/src/main/level/sublevels/games.ts @@ -0,0 +1,7 @@ +import { Game } from "@types"; +import { db } from "../level"; +import { levelKeys } from "./keys"; + +export const gamesSublevel = db.sublevel(levelKeys.games, { + valueEncoding: "json", +}); diff --git a/src/main/level/sublevels/index.ts b/src/main/level/sublevels/index.ts new file mode 100644 index 00000000..9d316e1a --- /dev/null +++ b/src/main/level/sublevels/index.ts @@ -0,0 +1 @@ +export * from "./games"; diff --git a/src/main/level/sublevels/keys.ts b/src/main/level/sublevels/keys.ts new file mode 100644 index 00000000..6bb54c4a --- /dev/null +++ b/src/main/level/sublevels/keys.ts @@ -0,0 +1,8 @@ +import type { GameShop } from "@types"; + +export const levelKeys = { + games: "games", + game: (shop: GameShop, objectId: string) => `${shop}:${objectId}`, + user: "user", + auth: "auth", +}; diff --git a/src/main/services/crypto.ts b/src/main/services/crypto.ts new file mode 100644 index 00000000..63a50668 --- /dev/null +++ b/src/main/services/crypto.ts @@ -0,0 +1,28 @@ +import { safeStorage } from "electron"; +import { logger } from "./logger"; + +export class Crypto { + public static encrypt(str: string) { + if (safeStorage.isEncryptionAvailable()) { + return safeStorage.encryptString(str).toString("base64"); + } else { + logger.warn( + "Encrypt method returned raw string because encryption is not available" + ); + + return str; + } + } + + public static decrypt(b64: string) { + if (safeStorage.isEncryptionAvailable()) { + return safeStorage.decryptString(Buffer.from(b64, "base64")); + } else { + logger.warn( + "Decrypt method returned raw string because encryption is not available" + ); + + return b64; + } + } +} diff --git a/src/types/level.types.ts b/src/types/level.types.ts new file mode 100644 index 00000000..490ab060 --- /dev/null +++ b/src/types/level.types.ts @@ -0,0 +1,23 @@ +export type SubscriptionStatus = "active" | "pending" | "cancelled"; + +export interface Subscription { + id: string; + status: SubscriptionStatus; + plan: { id: string; name: string }; + expiresAt: string | null; + paymentMethod: "pix" | "paypal"; +} + +export interface Auth { + accessToken: string; + refreshToken: string; + tokenExpirationTimestamp: number; +} + +export interface User { + id: string; + displayName: string; + profileImageUrl: string | null; + backgroundImageUrl: string | null; + subscription: Subscription | null; +} From 2c881a61002390a48438f6118b2ce4197c852072 Mon Sep 17 00:00:00 2001 From: Chubby Granny Chaser Date: Wed, 15 Jan 2025 17:15:57 +0000 Subject: [PATCH 07/74] fix: fixing duplicate export --- src/main/entity/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/main/entity/index.ts b/src/main/entity/index.ts index ab0ebff9..06b543d4 100644 --- a/src/main/entity/index.ts +++ b/src/main/entity/index.ts @@ -1,6 +1,5 @@ export * from "./game.entity"; export * from "./user-preferences.entity"; export * from "./game-shop-cache.entity"; -export * from "./game.entity"; export * from "./game-achievements.entity"; export * from "./download-queue.entity"; From a23106b0b1d62b257b7aef1a9dd365d7ef92a967 Mon Sep 17 00:00:00 2001 From: Chubby Granny Chaser Date: Thu, 16 Jan 2025 02:30:09 +0000 Subject: [PATCH 08/74] feat: migrating achievements to level --- src/main/data-source.ts | 16 +- src/main/entity/game-achievements.entity.ts | 19 -- src/main/entity/game-shop-cache.entity.ts | 35 ---- src/main/entity/index.ts | 2 - src/main/events/auth/get-session-hash.ts | 2 +- src/main/events/auth/sign-out.ts | 2 +- .../events/catalogue/get-game-shop-details.ts | 34 ++-- .../events/library/reset-game-achievements.ts | 24 ++- src/main/events/misc/open-checkout.ts | 2 +- .../events/user/get-unlocked-achievements.ts | 20 +-- src/main/events/user/get-user-friends.ts | 2 +- src/main/level/sublevels/game-achievements.ts | 11 ++ src/main/level/sublevels/game-shop-cache.ts | 11 ++ src/main/level/sublevels/games.ts | 3 +- src/main/level/sublevels/index.ts | 4 + src/main/level/sublevels/keys.ts | 4 + src/main/repository.ts | 13 +- .../achievements/get-game-achievement-data.ts | 48 ++--- .../achievements/merge-achievements.ts | 66 +++---- src/main/services/hydra-api.ts | 2 +- src/main/services/user/get-user-data.ts | 2 +- .../src/components/sidebar/sidebar.tsx | 11 +- src/renderer/src/declaration.d.ts | 6 +- src/renderer/src/features/library-slice.ts | 4 +- .../pages/achievements/achievement-list.tsx | 9 +- .../src/pages/downloads/download-group.tsx | 10 +- .../src/pages/downloads/downloads.tsx | 6 +- .../pages/game-details/sidebar/sidebar.tsx | 4 +- src/types/download.types.ts | 167 ++++++++++++++++++ src/types/game.types.ts | 59 +++++++ src/types/index.ts | 115 +----------- src/types/level.types.ts | 7 + src/types/real-debrid.types.ts | 66 ------- src/types/torbox.types.ts | 77 -------- 34 files changed, 388 insertions(+), 475 deletions(-) delete mode 100644 src/main/entity/game-achievements.entity.ts delete mode 100644 src/main/entity/game-shop-cache.entity.ts create mode 100644 src/main/level/sublevels/game-achievements.ts create mode 100644 src/main/level/sublevels/game-shop-cache.ts create mode 100644 src/types/download.types.ts create mode 100644 src/types/game.types.ts delete mode 100644 src/types/real-debrid.types.ts delete mode 100644 src/types/torbox.types.ts diff --git a/src/main/data-source.ts b/src/main/data-source.ts index 05fdb04d..7414a758 100644 --- a/src/main/data-source.ts +++ b/src/main/data-source.ts @@ -1,23 +1,11 @@ import { DataSource } from "typeorm"; -import { - DownloadQueue, - Game, - GameShopCache, - UserPreferences, - GameAchievement, -} from "@main/entity"; +import { DownloadQueue, Game, UserPreferences } from "@main/entity"; import { databasePath } from "./constants"; export const dataSource = new DataSource({ type: "better-sqlite3", - entities: [ - Game, - UserPreferences, - GameShopCache, - DownloadQueue, - GameAchievement, - ], + entities: [Game, UserPreferences, DownloadQueue], synchronize: false, database: databasePath, }); diff --git a/src/main/entity/game-achievements.entity.ts b/src/main/entity/game-achievements.entity.ts deleted file mode 100644 index 0cb15f6e..00000000 --- a/src/main/entity/game-achievements.entity.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { Column, Entity, PrimaryGeneratedColumn } from "typeorm"; - -@Entity("game_achievement") -export class GameAchievement { - @PrimaryGeneratedColumn() - id: number; - - @Column("text") - objectId: string; - - @Column("text") - shop: string; - - @Column("text", { nullable: true }) - unlockedAchievements: string | null; - - @Column("text", { nullable: true }) - achievements: string | null; -} diff --git a/src/main/entity/game-shop-cache.entity.ts b/src/main/entity/game-shop-cache.entity.ts deleted file mode 100644 index 3382da1c..00000000 --- a/src/main/entity/game-shop-cache.entity.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { - Entity, - PrimaryColumn, - Column, - CreateDateColumn, - UpdateDateColumn, -} from "typeorm"; -import type { GameShop } from "@types"; - -@Entity("game_shop_cache") -export class GameShopCache { - @PrimaryColumn("text", { unique: true }) - objectID: string; - - @Column("text") - shop: GameShop; - - @Column("text", { nullable: true }) - serializedData: string; - - /** - * @deprecated Use IndexedDB's `howLongToBeatEntries` instead - */ - @Column("text", { nullable: true }) - howLongToBeatSerializedData: string; - - @Column("text", { nullable: true }) - language: string; - - @CreateDateColumn() - createdAt: Date; - - @UpdateDateColumn() - updatedAt: Date; -} diff --git a/src/main/entity/index.ts b/src/main/entity/index.ts index 06b543d4..f35f643d 100644 --- a/src/main/entity/index.ts +++ b/src/main/entity/index.ts @@ -1,5 +1,3 @@ export * from "./game.entity"; export * from "./user-preferences.entity"; -export * from "./game-shop-cache.entity"; -export * from "./game-achievements.entity"; export * from "./download-queue.entity"; diff --git a/src/main/events/auth/get-session-hash.ts b/src/main/events/auth/get-session-hash.ts index 293fb62e..5848cbd7 100644 --- a/src/main/events/auth/get-session-hash.ts +++ b/src/main/events/auth/get-session-hash.ts @@ -3,7 +3,7 @@ import jwt from "jsonwebtoken"; import { registerEvent } from "../register-event"; import { db } from "@main/level"; import type { Auth } from "@types"; -import { levelKeys } from "@main/level/sublevels/keys"; +import { levelKeys } from "@main/level"; import { Crypto } from "@main/services"; const getSessionHash = async (_event: Electron.IpcMainInvokeEvent) => { diff --git a/src/main/events/auth/sign-out.ts b/src/main/events/auth/sign-out.ts index 1fb3a054..866d1ec0 100644 --- a/src/main/events/auth/sign-out.ts +++ b/src/main/events/auth/sign-out.ts @@ -4,7 +4,7 @@ import { dataSource } from "@main/data-source"; import { DownloadQueue, Game } from "@main/entity"; import { PythonRPC } from "@main/services/python-rpc"; import { db } from "@main/level"; -import { levelKeys } from "@main/level/sublevels/keys"; +import { levelKeys } from "@main/level"; const signOut = async (_event: Electron.IpcMainInvokeEvent) => { const databaseOperations = dataSource diff --git a/src/main/events/catalogue/get-game-shop-details.ts b/src/main/events/catalogue/get-game-shop-details.ts index 08366abc..39f8425b 100644 --- a/src/main/events/catalogue/get-game-shop-details.ts +++ b/src/main/events/catalogue/get-game-shop-details.ts @@ -1,10 +1,10 @@ -import { gameShopCacheRepository } from "@main/repository"; -import { getSteamAppDetails } from "@main/services"; +import { getSteamAppDetails, logger } from "@main/services"; -import type { ShopDetails, GameShop, SteamAppDetails } from "@types"; +import type { ShopDetails, GameShop } from "@types"; import { registerEvent } from "../register-event"; import { steamGamesWorker } from "@main/workers"; +import { gamesShopCacheSublevel, levelKeys } from "@main/level"; const getLocalizedSteamAppDetails = async ( objectId: string, @@ -39,35 +39,27 @@ const getGameShopDetails = async ( language: string ): Promise => { if (shop === "steam") { - const cachedData = await gameShopCacheRepository.findOne({ - where: { objectID: objectId, language }, - }); + const cachedData = await gamesShopCacheSublevel.get( + levelKeys.gameShopCacheItem(shop, objectId, language) + ); const appDetails = getLocalizedSteamAppDetails(objectId, language).then( (result) => { if (result) { - gameShopCacheRepository.upsert( - { - objectID: objectId, - shop: "steam", - language, - serializedData: JSON.stringify(result), - }, - ["objectID"] - ); + gamesShopCacheSublevel + .put(levelKeys.gameShopCacheItem(shop, objectId, language), result) + .catch((err) => { + logger.error("Could not cache game details", err); + }); } return result; } ); - const cachedGame = cachedData?.serializedData - ? (JSON.parse(cachedData?.serializedData) as SteamAppDetails) - : null; - - if (cachedGame) { + if (cachedData) { return { - ...cachedGame, + ...cachedData, objectId, } as ShopDetails; } diff --git a/src/main/events/library/reset-game-achievements.ts b/src/main/events/library/reset-game-achievements.ts index 8d52a3a6..0ea26adf 100644 --- a/src/main/events/library/reset-game-achievements.ts +++ b/src/main/events/library/reset-game-achievements.ts @@ -1,9 +1,10 @@ -import { gameAchievementRepository, gameRepository } from "@main/repository"; +import { gameRepository } from "@main/repository"; import { registerEvent } from "../register-event"; import { findAchievementFiles } from "@main/services/achievements/find-achivement-files"; import fs from "fs"; import { achievementsLogger, HydraApi, WindowManager } from "@main/services"; import { getUnlockedAchievements } from "../user/get-unlocked-achievements"; +import { gameAchievementsSublevel, levelKeys } from "@main/level"; const resetGameAchievements = async ( _event: Electron.IpcMainInvokeEvent, @@ -23,12 +24,21 @@ const resetGameAchievements = async ( } } - await gameAchievementRepository.update( - { objectId: game.objectID }, - { - unlockedAchievements: null, - } - ); + const levelKey = levelKeys.game(game.shop, game.objectID); + + await gameAchievementsSublevel + .get(levelKey) + .then(async (gameAchievements) => { + if (gameAchievements) { + await gameAchievementsSublevel.put( + levelKeys.game(game.shop, game.objectID), + { + ...gameAchievements, + unlockedAchievements: [], + } + ); + } + }); await HydraApi.delete(`/profile/games/achievements/${game.remoteId}`).then( () => diff --git a/src/main/events/misc/open-checkout.ts b/src/main/events/misc/open-checkout.ts index 76e7fe09..95d76d5b 100644 --- a/src/main/events/misc/open-checkout.ts +++ b/src/main/events/misc/open-checkout.ts @@ -3,7 +3,7 @@ import { registerEvent } from "../register-event"; import { Crypto, HydraApi } from "@main/services"; import { db } from "@main/level"; import type { Auth } from "@types"; -import { levelKeys } from "@main/level/sublevels/keys"; +import { levelKeys } from "@main/level"; const openCheckout = async (_event: Electron.IpcMainInvokeEvent) => { const auth = await db.get(levelKeys.auth, { diff --git a/src/main/events/user/get-unlocked-achievements.ts b/src/main/events/user/get-unlocked-achievements.ts index ffa25399..78820a94 100644 --- a/src/main/events/user/get-unlocked-achievements.ts +++ b/src/main/events/user/get-unlocked-achievements.ts @@ -1,19 +1,17 @@ -import type { GameShop, UnlockedAchievement, UserAchievement } from "@types"; +import type { GameShop, UserAchievement } from "@types"; import { registerEvent } from "../register-event"; -import { - gameAchievementRepository, - userPreferencesRepository, -} from "@main/repository"; +import { userPreferencesRepository } from "@main/repository"; import { getGameAchievementData } from "@main/services/achievements/get-game-achievement-data"; +import { gameAchievementsSublevel, levelKeys } from "@main/level"; export const getUnlockedAchievements = async ( objectId: string, shop: GameShop, useCachedData: boolean ): Promise => { - const cachedAchievements = await gameAchievementRepository.findOne({ - where: { objectId, shop }, - }); + const cachedAchievements = await gameAchievementsSublevel.get( + levelKeys.game(shop, objectId) + ); const userPreferences = await userPreferencesRepository.findOne({ where: { id: 1 }, @@ -25,12 +23,10 @@ export const getUnlockedAchievements = async ( const achievementsData = await getGameAchievementData( objectId, shop, - useCachedData ? cachedAchievements : null + useCachedData ); - const unlockedAchievements = JSON.parse( - cachedAchievements?.unlockedAchievements || "[]" - ) as UnlockedAchievement[]; + const unlockedAchievements = cachedAchievements?.unlockedAchievements ?? []; return achievementsData .map((achievementData) => { diff --git a/src/main/events/user/get-user-friends.ts b/src/main/events/user/get-user-friends.ts index 7c308506..aefc7052 100644 --- a/src/main/events/user/get-user-friends.ts +++ b/src/main/events/user/get-user-friends.ts @@ -2,7 +2,7 @@ import { db } from "@main/level"; import { registerEvent } from "../register-event"; import { HydraApi } from "@main/services"; import type { User, UserFriends } from "@types"; -import { levelKeys } from "@main/level/sublevels/keys"; +import { levelKeys } from "@main/level/sublevels"; export const getUserFriends = async ( userId: string, diff --git a/src/main/level/sublevels/game-achievements.ts b/src/main/level/sublevels/game-achievements.ts new file mode 100644 index 00000000..4b1fa0c8 --- /dev/null +++ b/src/main/level/sublevels/game-achievements.ts @@ -0,0 +1,11 @@ +import type { GameAchievement } from "@types"; + +import { db } from "../level"; +import { levelKeys } from "./keys"; + +export const gameAchievementsSublevel = db.sublevel( + levelKeys.gameAchievements, + { + valueEncoding: "json", + } +); diff --git a/src/main/level/sublevels/game-shop-cache.ts b/src/main/level/sublevels/game-shop-cache.ts new file mode 100644 index 00000000..8187e5c0 --- /dev/null +++ b/src/main/level/sublevels/game-shop-cache.ts @@ -0,0 +1,11 @@ +import type { ShopDetails } from "@types"; + +import { db } from "../level"; +import { levelKeys } from "./keys"; + +export const gamesShopCacheSublevel = db.sublevel( + levelKeys.gameShopCache, + { + valueEncoding: "json", + } +); diff --git a/src/main/level/sublevels/games.ts b/src/main/level/sublevels/games.ts index bc0cad30..ce7492f1 100644 --- a/src/main/level/sublevels/games.ts +++ b/src/main/level/sublevels/games.ts @@ -1,4 +1,5 @@ -import { Game } from "@types"; +import type { Game } from "@types"; + import { db } from "../level"; import { levelKeys } from "./keys"; diff --git a/src/main/level/sublevels/index.ts b/src/main/level/sublevels/index.ts index 9d316e1a..ce61c4e2 100644 --- a/src/main/level/sublevels/index.ts +++ b/src/main/level/sublevels/index.ts @@ -1 +1,5 @@ export * from "./games"; +export * from "./game-shop-cache"; +export * from "./game-achievements"; + +export * from "./keys"; diff --git a/src/main/level/sublevels/keys.ts b/src/main/level/sublevels/keys.ts index 6bb54c4a..f2bb6f3c 100644 --- a/src/main/level/sublevels/keys.ts +++ b/src/main/level/sublevels/keys.ts @@ -5,4 +5,8 @@ export const levelKeys = { game: (shop: GameShop, objectId: string) => `${shop}:${objectId}`, user: "user", auth: "auth", + gameShopCache: "gameShopCache", + gameShopCacheItem: (shop: GameShop, objectId: string, language: string) => + `${shop}:${objectId}:${language}`, + gameAchievements: "gameAchievements", }; diff --git a/src/main/repository.ts b/src/main/repository.ts index ef120f7e..5bbfaf9f 100644 --- a/src/main/repository.ts +++ b/src/main/repository.ts @@ -1,20 +1,9 @@ import { dataSource } from "./data-source"; -import { - DownloadQueue, - Game, - GameShopCache, - UserPreferences, - GameAchievement, -} from "@main/entity"; +import { DownloadQueue, Game, UserPreferences } from "@main/entity"; export const gameRepository = dataSource.getRepository(Game); export const userPreferencesRepository = dataSource.getRepository(UserPreferences); -export const gameShopCacheRepository = dataSource.getRepository(GameShopCache); - export const downloadQueueRepository = dataSource.getRepository(DownloadQueue); - -export const gameAchievementRepository = - dataSource.getRepository(GameAchievement); diff --git a/src/main/services/achievements/get-game-achievement-data.ts b/src/main/services/achievements/get-game-achievement-data.ts index daac7e11..2dc643c1 100644 --- a/src/main/services/achievements/get-game-achievement-data.ts +++ b/src/main/services/achievements/get-game-achievement-data.ts @@ -1,40 +1,36 @@ -import { - gameAchievementRepository, - userPreferencesRepository, -} from "@main/repository"; +import { userPreferencesRepository } from "@main/repository"; import { HydraApi } from "../hydra-api"; -import type { AchievementData, GameShop } from "@types"; +import type { GameShop, SteamAchievement } from "@types"; import { UserNotLoggedInError } from "@shared"; import { logger } from "../logger"; -import { GameAchievement } from "@main/entity"; +import { gameAchievementsSublevel, levelKeys } from "@main/level"; export const getGameAchievementData = async ( objectId: string, shop: GameShop, - cachedAchievements: GameAchievement | null + useCachedData: boolean ) => { - if (cachedAchievements && cachedAchievements.achievements) { - return JSON.parse(cachedAchievements.achievements) as AchievementData[]; - } + const cachedAchievements = await gameAchievementsSublevel.get( + levelKeys.game(shop, objectId) + ); + + if (cachedAchievements && useCachedData) + return cachedAchievements.achievements; const userPreferences = await userPreferencesRepository.findOne({ where: { id: 1 }, }); - return HydraApi.get("/games/achievements", { + return HydraApi.get("/games/achievements", { shop, objectId, language: userPreferences?.language || "en", }) - .then((achievements) => { - gameAchievementRepository.upsert( - { - objectId, - shop, - achievements: JSON.stringify(achievements), - }, - ["objectId", "shop"] - ); + .then(async (achievements) => { + await gameAchievementsSublevel.put(levelKeys.game(shop, objectId), { + unlockedAchievements: cachedAchievements?.unlockedAchievements ?? [], + achievements, + }); return achievements; }) @@ -42,15 +38,9 @@ export const getGameAchievementData = async ( if (err instanceof UserNotLoggedInError) { throw err; } + logger.error("Failed to get game achievements", err); - return gameAchievementRepository - .findOne({ - where: { objectId, shop }, - }) - .then((gameAchievements) => { - return JSON.parse( - gameAchievements?.achievements || "[]" - ) as AchievementData[]; - }); + + return []; }); }; diff --git a/src/main/services/achievements/merge-achievements.ts b/src/main/services/achievements/merge-achievements.ts index dd8c877d..ac2f69d1 100644 --- a/src/main/services/achievements/merge-achievements.ts +++ b/src/main/services/achievements/merge-achievements.ts @@ -1,8 +1,5 @@ -import { - gameAchievementRepository, - userPreferencesRepository, -} from "@main/repository"; -import type { AchievementData, GameShop, UnlockedAchievement } from "@types"; +import { userPreferencesRepository } from "@main/repository"; +import type { GameShop, UnlockedAchievement } from "@types"; import { WindowManager } from "../window-manager"; import { HydraApi } from "../hydra-api"; import { getUnlockedAchievements } from "@main/events/user/get-unlocked-achievements"; @@ -10,33 +7,36 @@ import { Game } from "@main/entity"; import { publishNewAchievementNotification } from "../notifications"; import { SubscriptionRequiredError } from "@shared"; import { achievementsLogger } from "../logger"; +import { gameAchievementsSublevel, levelKeys } from "@main/level"; const saveAchievementsOnLocal = async ( objectId: string, shop: GameShop, - achievements: UnlockedAchievement[], + unlockedAchievements: UnlockedAchievement[], sendUpdateEvent: boolean ) => { - return gameAchievementRepository - .upsert( - { - objectId, - shop, - unlockedAchievements: JSON.stringify(achievements), - }, - ["objectId", "shop"] - ) - .then(() => { - if (!sendUpdateEvent) return; + const levelKey = levelKeys.game(shop, objectId); - return getUnlockedAchievements(objectId, shop, true) - .then((achievements) => { - WindowManager.mainWindow?.webContents.send( - `on-update-achievements-${objectId}-${shop}`, - achievements - ); - }) - .catch(() => {}); + return gameAchievementsSublevel + .get(levelKey) + .then(async (gameAchievement) => { + if (gameAchievement) { + await gameAchievementsSublevel.put(levelKey, { + ...gameAchievement, + unlockedAchievements: unlockedAchievements, + }); + + if (!sendUpdateEvent) return; + + return getUnlockedAchievements(objectId, shop, true) + .then((achievements) => { + WindowManager.mainWindow?.webContents.send( + `on-update-achievements-${objectId}-${shop}`, + achievements + ); + }) + .catch(() => {}); + } }); }; @@ -46,22 +46,12 @@ export const mergeAchievements = async ( publishNotification: boolean ) => { const [localGameAchievement, userPreferences] = await Promise.all([ - gameAchievementRepository.findOne({ - where: { - objectId: game.objectID, - shop: game.shop, - }, - }), + gameAchievementsSublevel.get(levelKeys.game(game.shop, game.objectID)), userPreferencesRepository.findOne({ where: { id: 1 } }), ]); - const achievementsData = JSON.parse( - localGameAchievement?.achievements || "[]" - ) as AchievementData[]; - - const unlockedAchievements = JSON.parse( - localGameAchievement?.unlockedAchievements || "[]" - ).filter((achievement) => achievement.name) as UnlockedAchievement[]; + const achievementsData = localGameAchievement?.achievements ?? []; + const unlockedAchievements = localGameAchievement?.unlockedAchievements ?? []; const newAchievementsMap = new Map( achievements.reverse().map((achievement) => { diff --git a/src/main/services/hydra-api.ts b/src/main/services/hydra-api.ts index 6cf9a8af..5f7a5034 100644 --- a/src/main/services/hydra-api.ts +++ b/src/main/services/hydra-api.ts @@ -10,7 +10,7 @@ import { appVersion } from "@main/constants"; import { getUserData } from "./user/get-user-data"; import { isFuture, isToday } from "date-fns"; import { db } from "@main/level"; -import { levelKeys } from "@main/level/sublevels/keys"; +import { levelKeys } from "@main/level/sublevels"; import type { Auth, User } from "@types"; import { Crypto } from "./crypto"; diff --git a/src/main/services/user/get-user-data.ts b/src/main/services/user/get-user-data.ts index e6cf1c71..ed07c61e 100644 --- a/src/main/services/user/get-user-data.ts +++ b/src/main/services/user/get-user-data.ts @@ -3,7 +3,7 @@ import { HydraApi } from "../hydra-api"; import { UserNotLoggedInError } from "@shared"; import { logger } from "../logger"; import { db } from "@main/level"; -import { levelKeys } from "@main/level/sublevels/keys"; +import { levelKeys } from "@main/level/sublevels"; export const getUserData = async () => { return HydraApi.get(`/profile/me`) diff --git a/src/renderer/src/components/sidebar/sidebar.tsx b/src/renderer/src/components/sidebar/sidebar.tsx index 355d04b2..ae22f552 100644 --- a/src/renderer/src/components/sidebar/sidebar.tsx +++ b/src/renderer/src/components/sidebar/sidebar.tsx @@ -2,7 +2,7 @@ import { useEffect, useMemo, useRef, useState } from "react"; import { useTranslation } from "react-i18next"; import { useLocation, useNavigate } from "react-router-dom"; -import type { LibraryGame } from "@types"; +import type { Game } from "@types"; import { TextField } from "@renderer/components"; import { @@ -35,7 +35,7 @@ export function Sidebar() { const { library, updateLibrary } = useLibrary(); const navigate = useNavigate(); - const [filteredLibrary, setFilteredLibrary] = useState([]); + const [filteredLibrary, setFilteredLibrary] = useState([]); const [isResizing, setIsResizing] = useState(false); const [sidebarWidth, setSidebarWidth] = useState( @@ -117,7 +117,7 @@ export function Sidebar() { }; }, [isResizing]); - const getGameTitle = (game: LibraryGame) => { + const getGameTitle = (game: Game) => { if (lastPacket?.game.id === game.id) { return t("downloading", { title: game.title, @@ -140,10 +140,7 @@ export function Sidebar() { } }; - const handleSidebarGameClick = ( - event: React.MouseEvent, - game: LibraryGame - ) => { + const handleSidebarGameClick = (event: React.MouseEvent, game: Game) => { const path = buildGameDetailsPath({ ...game, objectId: game.objectID, diff --git a/src/renderer/src/declaration.d.ts b/src/renderer/src/declaration.d.ts index 88f3297f..2ee60347 100644 --- a/src/renderer/src/declaration.d.ts +++ b/src/renderer/src/declaration.d.ts @@ -2,7 +2,6 @@ import type { CatalogueCategory } from "@shared"; import type { AppUpdaterEvent, Game, - LibraryGame, GameShop, HowLongToBeatCategory, ShopDetails, @@ -23,7 +22,6 @@ import type { UserStats, UserDetails, FriendRequestSync, - GameAchievement, GameArtifact, LudusaviBackup, UserAchievement, @@ -77,7 +75,7 @@ declare global { onUpdateAchievements: ( objectId: string, shop: GameShop, - cb: (achievements: GameAchievement[]) => void + cb: (achievements: UserAchievement[]) => void ) => () => Electron.IpcRenderer; getPublishers: () => Promise; getDevelopers: () => Promise; @@ -102,7 +100,7 @@ declare global { winePrefixPath: string | null ) => Promise; verifyExecutablePathInUse: (executablePath: string) => Promise; - getLibrary: () => Promise; + getLibrary: () => Promise; openGameInstaller: (gameId: number) => Promise; openGameInstallerPath: (gameId: number) => Promise; openGameExecutablePath: (gameId: number) => Promise; diff --git a/src/renderer/src/features/library-slice.ts b/src/renderer/src/features/library-slice.ts index 6c95aa79..f536ace7 100644 --- a/src/renderer/src/features/library-slice.ts +++ b/src/renderer/src/features/library-slice.ts @@ -1,10 +1,10 @@ import { createSlice } from "@reduxjs/toolkit"; import type { PayloadAction } from "@reduxjs/toolkit"; -import type { LibraryGame } from "@types"; +import type { Game } from "@types"; export interface LibraryState { - value: LibraryGame[]; + value: Game[]; } const initialState: LibraryState = { diff --git a/src/renderer/src/pages/achievements/achievement-list.tsx b/src/renderer/src/pages/achievements/achievement-list.tsx index ef178b50..6066f241 100644 --- a/src/renderer/src/pages/achievements/achievement-list.tsx +++ b/src/renderer/src/pages/achievements/achievement-list.tsx @@ -47,7 +47,14 @@ export function AchievementList({ achievements }: AchievementListProps) {

{achievement.description}

-
+
{achievement.points != undefined ? (
void; openGameInstaller: (gameId: number) => void; @@ -65,7 +65,7 @@ export function DownloadGroup({ resumeSeeding, } = useDownload(); - const getFinalDownloadSize = (game: LibraryGame) => { + const getFinalDownloadSize = (game: Game) => { const isGameDownloading = lastPacket?.game.id === game.id; if (game.fileSize) return formatBytes(game.fileSize); @@ -86,7 +86,7 @@ export function DownloadGroup({ return map; }, [seedingStatus]); - const getGameInfo = (game: LibraryGame) => { + const getGameInfo = (game: Game) => { const isGameDownloading = lastPacket?.game.id === game.id; const finalDownloadSize = getFinalDownloadSize(game); const seedingStatus = seedingMap.get(game.id); @@ -165,7 +165,7 @@ export function DownloadGroup({ return

{t(game.status as string)}

; }; - const getGameActions = (game: LibraryGame): DropdownMenuItem[] => { + const getGameActions = (game: Game): DropdownMenuItem[] => { const isGameDownloading = lastPacket?.game.id === game.id; const deleting = isGameDeleting(game.id); diff --git a/src/renderer/src/pages/downloads/downloads.tsx b/src/renderer/src/pages/downloads/downloads.tsx index 5c5a121a..41dbae90 100644 --- a/src/renderer/src/pages/downloads/downloads.tsx +++ b/src/renderer/src/pages/downloads/downloads.tsx @@ -7,7 +7,7 @@ import { BinaryNotFoundModal } from "../shared-modals/binary-not-found-modal"; import * as styles from "./downloads.css"; import { DeleteGameModal } from "./delete-game-modal"; import { DownloadGroup } from "./download-group"; -import type { LibraryGame, SeedingStatus } from "@types"; +import type { Game, SeedingStatus } from "@types"; import { orderBy } from "lodash-es"; import { ArrowDownIcon } from "@primer/octicons-react"; @@ -49,8 +49,8 @@ export default function Downloads() { setShowDeleteModal(true); }; - const libraryGroup: Record = useMemo(() => { - const initialValue: Record = { + const libraryGroup: Record = useMemo(() => { + const initialValue: Record = { downloading: [], queued: [], complete: [], diff --git a/src/renderer/src/pages/game-details/sidebar/sidebar.tsx b/src/renderer/src/pages/game-details/sidebar/sidebar.tsx index 7787b22a..d3a65ae5 100644 --- a/src/renderer/src/pages/game-details/sidebar/sidebar.tsx +++ b/src/renderer/src/pages/game-details/sidebar/sidebar.tsx @@ -23,7 +23,7 @@ import { buildGameAchievementPath } from "@renderer/helpers"; import { SPACING_UNIT } from "@renderer/theme.css"; import { useSubscription } from "@renderer/hooks/use-subscription"; -const fakeAchievements: UserAchievement[] = [ +const achievementsPlaceholder: UserAchievement[] = [ { displayName: "Timber!!", name: "", @@ -140,7 +140,7 @@ export function Sidebar() {

{t("sign_in_to_see_achievements")}