Merge branch 'main' into feature/seed-completed-downloads

This commit is contained in:
Hachi-R 2024-11-05 15:20:03 -03:00
commit 3a3c0a2b35
74 changed files with 955 additions and 6646 deletions

View file

@ -1,5 +1,4 @@
MAIN_VITE_API_URL=API_URL
MAIN_VITE_AUTH_URL=AUTH_URL
MAIN_VITE_STEAMGRIDDB_API_KEY=YOUR_API_KEY
MAIN_VITE_SENTRY_DSN=YOUR_SENTRY_DSN
SENTRY_AUTH_TOKEN=

View file

@ -17,7 +17,7 @@ jobs:
- name: Install Node.js
uses: actions/setup-node@v4
with:
node-version: 20.11.1
node-version: 20.18.0
- name: Install dependencies
run: yarn
@ -43,8 +43,7 @@ jobs:
MAIN_VITE_API_URL: ${{ vars.MAIN_VITE_STAGING_API_URL }}
MAIN_VITE_AUTH_URL: ${{ vars.MAIN_VITE_STAGING_AUTH_URL }}
MAIN_VITE_CHECKOUT_URL: ${{ vars.MAIN_VITE_STAGING_CHECKOUT_URL }}
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
MAIN_VITE_SENTRY_DSN: ${{ vars.MAIN_VITE_SENTRY_DSN }}
MAIN_VITE_ANALYTICS_API_URL: ${{ vars.MAIN_VITE_ANALYTICS_API_URL }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
- name: Build Windows
@ -54,8 +53,7 @@ jobs:
MAIN_VITE_API_URL: ${{ vars.MAIN_VITE_STAGING_API_URL }}
MAIN_VITE_AUTH_URL: ${{ vars.MAIN_VITE_STAGING_AUTH_URL }}
MAIN_VITE_CHECKOUT_URL: ${{ vars.MAIN_VITE_STAGING_CHECKOUT_URL }}
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
MAIN_VITE_SENTRY_DSN: ${{ vars.MAIN_VITE_SENTRY_DSN }}
MAIN_VITE_ANALYTICS_API_URL: ${{ vars.MAIN_VITE_ANALYTICS_API_URL }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
- name: Create artifact

View file

@ -13,7 +13,7 @@ jobs:
- name: Install Node.js
uses: actions/setup-node@v4
with:
node-version: 20.11.1
node-version: 20.18.0
- name: Install dependencies
run: yarn

View file

@ -19,7 +19,7 @@ jobs:
- name: Install Node.js
uses: actions/setup-node@v4
with:
node-version: 20.11.1
node-version: 20.18.0
- name: Install dependencies
run: yarn
@ -45,8 +45,7 @@ jobs:
MAIN_VITE_API_URL: ${{ vars.MAIN_VITE_API_URL }}
MAIN_VITE_AUTH_URL: ${{ vars.MAIN_VITE_AUTH_URL }}
MAIN_VITE_CHECKOUT_URL: ${{ vars.MAIN_VITE_CHECKOUT_URL }}
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
MAIN_VITE_SENTRY_DSN: ${{ vars.MAIN_VITE_SENTRY_DSN }}
MAIN_VITE_ANALYTICS_API_URL: ${{ vars.MAIN_VITE_ANALYTICS_API_URL }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
- name: Build Windows
@ -56,8 +55,7 @@ jobs:
MAIN_VITE_API_URL: ${{ vars.MAIN_VITE_API_URL }}
MAIN_VITE_AUTH_URL: ${{ vars.MAIN_VITE_AUTH_URL }}
MAIN_VITE_CHECKOUT_URL: ${{ vars.MAIN_VITE_CHECKOUT_URL }}
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
MAIN_VITE_SENTRY_DSN: ${{ vars.MAIN_VITE_SENTRY_DSN }}
MAIN_VITE_ANALYTICS_API_URL: ${{ vars.MAIN_VITE_ANALYTICS_API_URL }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
- name: Create artifact
@ -77,7 +75,7 @@ jobs:
dist/*.pacman
- name: Release
uses: softprops/action-gh-release@v1
uses: softprops/action-gh-release@v2
with:
draft: true
files: |

1
.gitignore vendored
View file

@ -9,5 +9,4 @@ out
*.log*
.env
.vite
sentry.properties
ludusavi/

View file

@ -7,6 +7,7 @@ extraResources:
- hydra-download-manager
- seeds
- from: node_modules/create-desktop-shortcuts/src/windows.vbs
- from: resources/achievement.wav
files:
- "!**/.vscode/*"
- "!src/*"

View file

@ -6,16 +6,9 @@ import {
externalizeDepsPlugin,
} from "electron-vite";
import react from "@vitejs/plugin-react";
import { sentryVitePlugin } from "@sentry/vite-plugin";
import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
import svgr from "vite-plugin-svgr";
const sentryPlugin = sentryVitePlugin({
authToken: process.env.SENTRY_AUTH_TOKEN,
org: "hydra-launcher",
project: "hydra-launcher",
});
export default defineConfig(({ mode }) => {
loadEnv(mode);
@ -35,7 +28,7 @@ export default defineConfig(({ mode }) => {
"@shared": resolve("src/shared"),
},
},
plugins: [externalizeDepsPlugin(), swcPlugin(), sentryPlugin],
plugins: [externalizeDepsPlugin(), swcPlugin()],
},
preload: {
plugins: [externalizeDepsPlugin()],
@ -51,7 +44,7 @@ export default defineConfig(({ mode }) => {
"@shared": resolve("src/shared"),
},
},
plugins: [svgr(), react(), vanillaExtractPlugin(), sentryPlugin],
plugins: [svgr(), react(), vanillaExtractPlugin()],
},
};
});

View file

@ -1,6 +1,6 @@
{
"name": "hydralauncher",
"version": "3.0.4",
"version": "3.0.5",
"description": "Hydra",
"main": "./out/main/index.js",
"author": "Los Broxas",
@ -38,7 +38,6 @@
"@hookform/resolvers": "^3.9.0",
"@primer/octicons-react": "^19.9.0",
"@reduxjs/toolkit": "^2.2.3",
"@sentry/electron": "^5.1.0",
"@vanilla-extract/css": "^1.14.2",
"@vanilla-extract/dynamic": "^2.1.1",
"@vanilla-extract/recipes": "^0.5.2",
@ -51,25 +50,25 @@
"color.js": "^1.2.0",
"create-desktop-shortcuts": "^1.11.0",
"date-fns": "^3.6.0",
"dexie": "^4.0.8",
"dexie": "^4.0.9",
"electron-log": "^5.2.0",
"electron-updater": "^6.3.9",
"file-type": "^19.6.0",
"flexsearch": "^0.7.43",
"i18next": "^23.11.2",
"i18next-browser-languagedetector": "^7.2.1",
"icojs": "^0.19.4",
"jsdom": "^24.0.0",
"jsonwebtoken": "^9.0.2",
"knex": "^3.1.0",
"lodash-es": "^4.17.21",
"lottie-react": "^2.4.0",
"parse-torrent": "^11.0.17",
"piscina": "^4.5.1",
"piscina": "^4.7.0",
"react-hook-form": "^7.53.0",
"react-i18next": "^14.1.0",
"react-loading-skeleton": "^3.4.0",
"react-redux": "^9.1.1",
"react-router-dom": "^6.22.3",
"sound-play": "^1.1.0",
"sudo-prompt": "^9.2.1",
"tar": "^7.4.3",
"typeorm": "^0.3.20",
@ -79,12 +78,11 @@
"zod": "^3.23.8"
},
"devDependencies": {
"@commitlint/cli": "^19.3.0",
"@commitlint/config-conventional": "^19.2.2",
"@commitlint/cli": "^19.5.0",
"@commitlint/config-conventional": "^19.5.0",
"@electron-toolkit/eslint-config-prettier": "^2.0.0",
"@electron-toolkit/eslint-config-ts": "^1.0.1",
"@electron-toolkit/eslint-config-ts": "^2.0.0",
"@electron-toolkit/tsconfig": "^1.0.1",
"@sentry/vite-plugin": "^2.20.1",
"@swc/core": "^1.4.16",
"@types/auto-launch": "^5.0.5",
"@types/color": "^3.0.6",
@ -96,6 +94,7 @@
"@types/parse-torrent": "^5.8.7",
"@types/react": "^18.2.48",
"@types/react-dom": "^18.2.18",
"@types/sound-play": "^1.1.3",
"@types/user-agents": "^1.0.4",
"@vanilla-extract/vite-plugin": "^4.0.7",
"@vitejs/plugin-react": "^4.2.1",
@ -110,6 +109,7 @@
"prettier": "^3.2.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"sass-embedded": "^1.80.6",
"ts-node": "^10.9.2",
"typescript": "^5.3.3",
"vite": "^5.0.12",

View file

@ -1,5 +1,5 @@
libtorrent
cx_Freeze
cx_Freeze == 7.2.3
cx_Logging; sys_platform == 'win32'
pywin32; sys_platform == 'win32'
psutil

Binary file not shown.

File diff suppressed because one or more lines are too long

View file

@ -130,7 +130,7 @@
"download": "Download",
"executable_path_in_use": "Executable already in use by \"{{game}}\"",
"warning": "Warning:",
"hydra_needs_to_remain_open": "for this download, Hydra needs to remain open util its conclusion. In case Hydra closes before the conclusion, you will lose your progress.",
"hydra_needs_to_remain_open": "for this download, Hydra needs to remain open util it's completed. If Hydra closes before completing, you will lose your progress.",
"achievements": "Achievements",
"achievements_count": "Achievements {{unlockedCount}}/{{achievementsCount}}",
"cloud_save": "Cloud save",
@ -215,7 +215,7 @@
"language": "Language",
"real_debrid_api_token": "API Token",
"enable_real_debrid": "Enable Real-Debrid",
"real_debrid_description": "Real-Debrid is an unrestricted downloader that allows you to download files instantly and at the best of your Internet speed.",
"real_debrid_description": "Real-Debrid is an unrestricted downloader that allows you to quickly download files, only limited by your internet speed.",
"real_debrid_invalid_token": "Invalid API token",
"real_debrid_api_token_hint": "You can get your API token <0>here</0>",
"real_debrid_free_account_error": "The account \"{{username}}\" is a free account. Please subscribe to Real-Debrid",
@ -230,7 +230,7 @@
"download_count_one": "{{countFormatted}} download option",
"download_count_other": "{{countFormatted}} download options",
"download_source_url": "Download source URL",
"add_download_source_description": "Insert the URL containing the .json file",
"add_download_source_description": "Insert the URL of the .json file",
"download_source_up_to_date": "Up-to-date",
"download_source_errored": "Errored",
"sync_download_sources": "Sync sources",
@ -249,7 +249,7 @@
"profile_visibility": "Profile visibility",
"profile_visibility_description": "Choose who can see your profile and library",
"required_field": "This field is required",
"source_already_exists": "This source has been already added",
"source_already_exists": "This source has already been added",
"must_be_valid_url": "The source must be a valid URL",
"blocked_users": "Blocked users",
"user_unblocked": "User has been unblocked",
@ -290,7 +290,7 @@
"amount_hours": "{{amount}} hours",
"amount_minutes": "{{amount}} minutes",
"last_time_played": "Last played {{period}}",
"activity": "Recent activity",
"activity": "Recent Activity",
"library": "Library",
"total_play_time": "Total playtime: {{amount}}",
"no_recent_activity_title": "Hmmm… nothing here",
@ -329,7 +329,7 @@
"user_block_modal_text": "This will block {{displayName}}",
"blocked_users": "Blocked users",
"unblock": "Unblock",
"no_friends_added": "You still don't have added friends",
"no_friends_added": "You have no added friends",
"pending": "Pending",
"no_pending_invites": "You have no pending invites",
"no_blocked_users": "You have no blocked users",
@ -363,7 +363,9 @@
"your_achievements": "Your Achievements",
"unlocked_at": "Unlocked at:",
"subscription_needed": "A Hydra Cloud subscription is required to see this content",
"new_achievements_unlocked": "Unlocked {{achievementCount}} new achievements from {{gameCount}} games"
"new_achievements_unlocked": "Unlocked {{achievementCount}} new achievements from {{gameCount}} games",
"achievement_progress": "{{unlockedCount}}/{{totalCount}} achievements",
"achievements_unlocked_for_game": "Unlocked {{achievementCount}} new achievements for {{gameTitle}}"
},
"tour": {
"subscription_tour_title": "Hydra Cloud Subscription",

View file

@ -360,7 +360,9 @@
"user_achievements": "Conquistas de {{displayName}}",
"unlocked_at": "Desbloqueado em:",
"subscription_needed": "Você precisa de uma assinatura Hydra Cloud para visualizar este conteúdo",
"new_achievements_unlocked": "{{achievementCount}} novas conquistas de {{gameCount}} jogos"
"new_achievements_unlocked": "{{achievementCount}} novas conquistas de {{gameCount}} jogos",
"achievement_progress": "{{unlockedCount}}/{{totalCount}} conquistas",
"achievements_unlocked_for_game": "Desbloqueadas {{achievementCount}} novas conquistas em {{gameTitle}}"
},
"tour": {
"subscription_tour_title": "Assinatura Hydra Cloud",

View file

@ -7,7 +7,7 @@
"featured": "Рекомендованное",
"surprise_me": "Удиви меня",
"no_results": "Ничего не найдено",
"hot": "Сейчас жарко",
"hot": "Сейчас в топе",
"start_typing": "Начинаю вводить текст для поиска...",
"weekly": "📅 Лучшие игры недели"
},

View file

@ -19,6 +19,10 @@ export const seedsPath = app.isPackaged
? path.join(process.resourcesPath, "seeds")
: path.join(__dirname, "..", "..", "seeds");
export const achievementSoundPath = app.isPackaged
? path.join(process.resourcesPath, "achievement.wav")
: path.join(__dirname, "..", "..", "resources", "achievement.wav");
export const backupsPath = path.join(app.getPath("userData"), "Backups");
export const appVersion = app.getVersion();

View file

@ -1,5 +1,4 @@
import jwt from "jsonwebtoken";
import * as Sentry from "@sentry/electron/main";
import { userAuthRepository } from "@main/repository";
import { registerEvent } from "../register-event";
@ -10,8 +9,6 @@ const getSessionHash = async (_event: Electron.IpcMainInvokeEvent) => {
if (!auth) return null;
const payload = jwt.decode(auth.accessToken) as jwt.JwtPayload;
Sentry.setContext("sessionId", payload.sessionId);
return payload.sessionId;
};

View file

@ -1,5 +1,4 @@
import { registerEvent } from "../register-event";
import * as Sentry from "@sentry/electron/main";
import {
DownloadManager,
HydraApi,
@ -29,9 +28,6 @@ const signOut = async (_event: Electron.IpcMainInvokeEvent) => {
gamesPlaytime.clear();
});
/* Removes user from Sentry */
Sentry.setUser(null);
/* Cancels any ongoing downloads */
DownloadManager.cancelDownload();

View file

@ -1,5 +1,5 @@
import { registerEvent } from "../register-event";
import parseTorrent from "parse-torrent";
import type { StartGameDownloadPayload } from "@types";
import { DownloadManager, HydraApi, logger } from "@main/services";
@ -9,6 +9,7 @@ import { createGame } from "@main/services/library-sync";
import { steamUrlBuilder } from "@shared";
import { dataSource } from "@main/data-source";
import { DownloadQueue, Game } from "@main/entity";
import { HydraAnalytics } from "@main/services/hydra-analytics";
const startGameDownload = async (
_event: Electron.IpcMainInvokeEvent,
@ -90,6 +91,11 @@ const startGameDownload = async (
logger.error("Failed to create game download", err);
});
const { infoHash } = await parseTorrent(payload.uri);
if (infoHash) {
HydraAnalytics.postDownload(infoHash).catch(() => {});
}
await DownloadManager.cancelDownload(updatedGame!.id);
await DownloadManager.startDownload(updatedGame!);

View file

@ -1,5 +1,4 @@
import { app, BrowserWindow, net, protocol } from "electron";
import { init } from "@sentry/electron/main";
import updater from "electron-updater";
import i18n from "i18next";
import path from "node:path";
@ -26,12 +25,6 @@ autoUpdater.logger = logger;
const gotTheLock = app.requestSingleInstanceLock();
if (!gotTheLock) app.quit();
if (import.meta.env.MAIN_VITE_SENTRY_DSN) {
init({
dsn: import.meta.env.MAIN_VITE_SENTRY_DSN,
});
}
app.commandLine.appendSwitch("--no-sandbox");
i18n.init({
@ -105,7 +98,6 @@ app.whenReady().then(async () => {
WindowManager.createMainWindow();
}
WindowManager.createNotificationWindow();
WindowManager.createSystemTray(userPreferences?.language || "en");
});

View file

@ -13,7 +13,7 @@ import type { AchievementFile, UnlockedAchievement } from "@types";
import { achievementsLogger } from "../logger";
import { Cracker } from "@shared";
import { IsNull, Not } from "typeorm";
import { WindowManager } from "../window-manager";
import { publishCombinedNewAchievementNotification } from "../notifications";
const fileStats: Map<string, number> = new Map();
const fltFiles: Map<string, Set<string>> = new Map();
@ -249,11 +249,12 @@ export class AchievementWatcherManager {
0
);
WindowManager.notificationWindow?.webContents.send(
"on-combined-achievements-unlocked",
totalNewGamesWithAchievements,
totalNewAchievements
);
if (totalNewAchievements > 0) {
publishCombinedNewAchievementNotification(
totalNewAchievements,
totalNewGamesWithAchievements
);
}
this.hasFinishedMergingWithRemote = true;
};

View file

@ -8,11 +8,12 @@ import { HydraApi } from "../hydra-api";
import { getUnlockedAchievements } from "@main/events/user/get-unlocked-achievements";
import { Game } from "@main/entity";
import { achievementsLogger } from "../logger";
import { publishNewAchievementNotification } from "../notifications";
const saveAchievementsOnLocal = async (
objectId: string,
shop: GameShop,
achievements: any[],
achievements: UnlockedAchievement[],
sendUpdateEvent: boolean
) => {
return gameAchievementRepository
@ -82,6 +83,8 @@ export const mergeAchievements = async (
};
});
const mergedLocalAchievements = unlockedAchievements.concat(newAchievements);
if (
newAchievements.length &&
publishNotification &&
@ -107,16 +110,15 @@ export const mergeAchievements = async (
};
});
WindowManager.notificationWindow?.webContents.send(
"on-achievement-unlocked",
game.objectID,
game.shop,
achievementsInfo
);
publishNewAchievementNotification({
achievements: achievementsInfo,
unlockedAchievementCount: mergedLocalAchievements.length,
totalAchievementCount: achievementsData.length,
gameTitle: game.title,
gameIcon: game.iconUrl,
});
}
const mergedLocalAchievements = unlockedAchievements.concat(newAchievements);
if (game.remoteId) {
await HydraApi.put("/profile/games/achievements", {
id: game.remoteId,

View file

@ -0,0 +1,34 @@
import { userSubscriptionRepository } from "@main/repository";
import axios from "axios";
import { appVersion } from "@main/constants";
export class HydraAnalytics {
private static instance = axios.create({
baseURL: import.meta.env.MAIN_VITE_ANALYTICS_API_URL,
headers: { "User-Agent": `Hydra Launcher v${appVersion}` },
});
private static async hasActiveSubscription() {
const userSubscription = await userSubscriptionRepository.findOne({
where: { id: 1 },
});
return (
userSubscription?.expiresAt && userSubscription.expiresAt > new Date()
);
}
static async postDownload(hash: string) {
const hasSubscription = await this.hasActiveSubscription();
return this.instance
.post("/track", {
event: "download",
attributes: {
hash,
hasSubscription,
},
})
.then((response) => response.data);
}
}

View file

@ -24,6 +24,7 @@ export class Ludusavi {
workerData: {
binaryPath: this.binaryPath,
},
maxThreads: 1,
});
static async getConfig() {

View file

@ -1,67 +0,0 @@
import { Notification, nativeImage } from "electron";
import { t } from "i18next";
import { parseICO } from "icojs";
import trayIcon from "@resources/tray-icon.png?asset";
import { Game } from "@main/entity";
import { gameRepository, userPreferencesRepository } from "@main/repository";
const getGameIconNativeImage = async (gameId: number) => {
try {
const game = await gameRepository.findOne({
where: {
id: gameId,
},
});
if (!game?.iconUrl) return undefined;
const images = await parseICO(
Buffer.from(game.iconUrl.split("base64,")[1], "base64")
);
const highResIcon = images.find((image) => image.width >= 128);
if (!highResIcon) return undefined;
return nativeImage.createFromBuffer(Buffer.from(highResIcon.buffer));
} catch (err) {
return undefined;
}
};
export const publishDownloadCompleteNotification = async (game: Game) => {
const userPreferences = await userPreferencesRepository.findOne({
where: { id: 1 },
});
const icon = await getGameIconNativeImage(game.id);
if (userPreferences?.downloadNotificationsEnabled) {
new Notification({
title: t("download_complete", {
ns: "notifications",
}),
body: t("game_ready_to_install", {
ns: "notifications",
title: game.title,
}),
icon,
}).show();
}
};
export const publishNotificationUpdateReadyToInstall = async (
version: string
) => {
new Notification({
title: t("new_update_available", {
ns: "notifications",
version,
}),
body: t("restart_to_install_update", {
ns: "notifications",
}),
icon: trayIcon,
}).show();
};
export const publishNewFriendRequestNotification = async () => {};

View file

@ -0,0 +1,146 @@
import { Notification, app } from "electron";
import { t } from "i18next";
import trayIcon from "@resources/tray-icon.png?asset";
import { Game } from "@main/entity";
import { userPreferencesRepository } from "@main/repository";
import fs from "node:fs";
import axios from "axios";
import path from "node:path";
import sound from "sound-play";
import { achievementSoundPath } from "@main/constants";
import icon from "@resources/icon.png?asset";
import { NotificationOptions, toXmlString } from "./xml";
import { logger } from "../logger";
async function downloadImage(url: string | null) {
if (!url) return undefined;
if (!url.startsWith("http")) return undefined;
const fileName = url.split("/").pop()!;
const outputPath = path.join(app.getPath("temp"), fileName);
const writer = fs.createWriteStream(outputPath);
const response = await axios.get(url, {
responseType: "stream",
});
response.data.pipe(writer);
return new Promise<string | undefined>((resolve) => {
writer.on("finish", () => {
resolve(outputPath);
});
writer.on("error", () => {
logger.error("Failed to download image", { url });
resolve(undefined);
});
});
}
export const publishDownloadCompleteNotification = async (game: Game) => {
const userPreferences = await userPreferencesRepository.findOne({
where: { id: 1 },
});
if (userPreferences?.downloadNotificationsEnabled) {
new Notification({
title: t("download_complete", {
ns: "notifications",
}),
body: t("game_ready_to_install", {
ns: "notifications",
title: game.title,
}),
icon: await downloadImage(game.iconUrl),
}).show();
}
};
export const publishNotificationUpdateReadyToInstall = async (
version: string
) => {
new Notification({
title: t("new_update_available", {
ns: "notifications",
version,
}),
body: t("restart_to_install_update", {
ns: "notifications",
}),
icon: trayIcon,
}).show();
};
export const publishNewFriendRequestNotification = async () => {};
export const publishCombinedNewAchievementNotification = async (
achievementCount,
gameCount
) => {
const options: NotificationOptions = {
title: t("achievement_unlocked", { ns: "achievement" }),
body: t("new_achievements_unlocked", {
ns: "achievement",
gameCount,
achievementCount,
}),
icon,
silent: true,
};
new Notification({
...options,
toastXml: toXmlString(options),
}).show();
if (process.platform !== "linux") {
sound.play(achievementSoundPath);
}
};
export const publishNewAchievementNotification = async (info: {
achievements: { displayName: string; iconUrl: string }[];
unlockedAchievementCount: number;
totalAchievementCount: number;
gameTitle: string;
gameIcon: string | null;
}) => {
const partialOptions =
info.achievements.length > 1
? {
title: t("achievements_unlocked_for_game", {
ns: "achievement",
gameTitle: info.gameTitle,
achievementCount: info.achievements.length,
}),
body: info.achievements.map((a) => a.displayName).join(", "),
icon: (await downloadImage(info.gameIcon)) ?? icon,
}
: {
title: t("achievement_unlocked", { ns: "achievement" }),
body: info.achievements[0].displayName,
icon: (await downloadImage(info.achievements[0].iconUrl)) ?? icon,
};
const options: NotificationOptions = {
...partialOptions,
silent: true,
progress: {
value: info.unlockedAchievementCount / info.totalAchievementCount,
valueOverride: t("achievement_progress", {
ns: "achievement",
unlockedCount: info.unlockedAchievementCount,
totalCount: info.totalAchievementCount,
}),
},
};
new Notification({
...options,
toastXml: toXmlString(options),
}).show();
if (process.platform !== "linux") {
sound.play(achievementSoundPath);
}
};

View file

@ -0,0 +1,79 @@
export interface NotificationOptions {
title: string;
body?: string;
icon: string;
duration?: "short" | "long";
silent?: boolean;
progress?: {
status?: string;
value: number;
valueOverride: string;
};
}
function escape(string: string) {
return string.replace(/[<>&'"]/g, (match) => {
switch (match) {
case "<":
return "&lt;";
case ">":
return "&gt;";
case "&":
return "&amp;";
case "'":
return "&apos;";
case '"':
return "&quot;";
default:
return "";
}
});
}
function addAttributeOrTrim(name: string, value: string) {
return value ? `${name}="${value}" ` : "";
}
export function toXmlString(options: NotificationOptions) {
let template =
"<toast " +
`displayTimestamp="${new Date().toISOString()}" ` +
`scenario="default" ` +
`duration="${options.duration ?? "short"}" ` +
`activationType="protocol" ` +
">";
//Visual
template += `<visual><binding template="ToastGeneric">`;
if (options.icon)
template += `<image placement="appLogoOverride" src="${options.icon}" hint-crop="none"/>`;
template +=
`<text><![CDATA[${options.title}]]></text>` +
`<text><![CDATA[${options.body}]]></text>`;
//Progress bar
if (options.progress) {
template +=
"<progress " +
`value="${options.progress.value}" ` +
`status="" ` +
addAttributeOrTrim(
"valueStringOverride",
escape(options.progress.valueOverride)
) +
"/>";
}
template += "</binding></visual>";
//Actions
template += "<actions>";
template += "</actions>";
//Audio
template += "<audio " + `silent="true" ` + `loop="false" ` + "/>";
//EOF
template += "</toast>";
return template;
}

View file

@ -4,7 +4,6 @@ import {
userAuthRepository,
userSubscriptionRepository,
} from "@main/repository";
import * as Sentry from "@sentry/electron/main";
import { UserNotLoggedInError } from "@shared";
import { logger } from "../logger";
@ -39,8 +38,6 @@ export const getUserData = () => {
await userSubscriptionRepository.delete({ id: 1 });
}
Sentry.setUser({ id: me.id, username: me.username });
return me;
})
.catch(async (err) => {

View file

@ -20,7 +20,6 @@ import UserAgent from "user-agents";
export class WindowManager {
public static mainWindow: Electron.BrowserWindow | null = null;
public static notificationWindow: Electron.BrowserWindow | null = null;
private static loadMainWindowURL(hash = "") {
// HMR for renderer base on electron-vite cli.
@ -39,21 +38,6 @@ export class WindowManager {
}
}
private static loadNotificationWindowURL() {
if (is.dev && process.env["ELECTRON_RENDERER_URL"]) {
this.notificationWindow?.loadURL(
`${process.env["ELECTRON_RENDERER_URL"]}#/achievement-notification`
);
} else {
this.notificationWindow?.loadFile(
path.join(__dirname, "../renderer/index.html"),
{
hash: "achievement-notification",
}
);
}
}
public static createMainWindow() {
if (this.mainWindow) return;
@ -63,7 +47,7 @@ export class WindowManager {
minWidth: 1024,
minHeight: 540,
backgroundColor: "#1c1c1c",
titleBarStyle: process.platform === "win32" ? "hidden" : "default",
titleBarStyle: process.platform === "linux" ? "default" : "hidden",
...(process.platform === "linux" ? { icon } : {}),
trafficLightPosition: { x: 16, y: 16 },
titleBarOverlay: {
@ -151,32 +135,6 @@ export class WindowManager {
});
}
public static createNotificationWindow() {
this.notificationWindow = new BrowserWindow({
transparent: true,
maximizable: false,
autoHideMenuBar: true,
minimizable: false,
focusable: false,
skipTaskbar: true,
frame: false,
width: 350,
height: 104,
x: 0,
y: 0,
webPreferences: {
preload: path.join(__dirname, "../preload/index.mjs"),
sandbox: false,
},
});
this.notificationWindow.setIgnoreMouseEvents(true);
// this.notificationWindow.setVisibleOnAllWorkspaces(true, {
// visibleOnFullScreen: true,
// });
this.notificationWindow.setAlwaysOnTop(true, "screen-saver", 1);
this.loadNotificationWindowURL();
}
public static openAuthWindow() {
if (this.mainWindow) {
const authWindow = new BrowserWindow({

View file

@ -3,8 +3,8 @@
interface ImportMetaEnv {
readonly MAIN_VITE_STEAMGRIDDB_API_KEY: string;
readonly MAIN_VITE_API_URL: string;
readonly MAIN_VITE_ANALYTICS_API_URL: string;
readonly MAIN_VITE_AUTH_URL: string;
readonly MAIN_VITE_SENTRY_DSN: string;
readonly MAIN_VITE_CHECKOUT_URL: string;
}

View file

@ -16,15 +16,25 @@ export const backupGame = ({
preview?: boolean;
winePrefix?: string;
}) => {
const args = ["backup", title, "--api", "--force"];
return new Promise((resolve, reject) => {
const args = ["backup", title, "--api", "--force"];
if (preview) args.push("--preview");
if (backupPath) args.push("--path", backupPath);
if (winePrefix) args.push("--wine-prefix", winePrefix);
if (preview) args.push("--preview");
if (backupPath) args.push("--path", backupPath);
if (winePrefix) args.push("--wine-prefix", winePrefix);
const result = cp.execFileSync(binaryPath, args);
cp.execFile(
binaryPath,
args,
(err: cp.ExecFileException | null, stdout: string) => {
if (err) {
return reject(err);
}
return JSON.parse(result.toString("utf-8")) as LudusaviBackup;
return resolve(JSON.parse(stdout) as LudusaviBackup);
}
);
});
};
export const restoreBackup = (backupPath: string) => {

View file

@ -53,35 +53,6 @@ contextBridge.exposeInMainWorld("electron", {
getGameStats: (objectId: string, shop: GameShop) =>
ipcRenderer.invoke("getGameStats", objectId, shop),
getTrendingGames: () => ipcRenderer.invoke("getTrendingGames"),
onAchievementUnlocked: (
cb: (
objectId: string,
shop: GameShop,
achievements?: { displayName: string; iconUrl: string }[]
) => void
) => {
const listener = (
_event: Electron.IpcRendererEvent,
objectId: string,
shop: GameShop,
achievements?: { displayName: string; iconUrl: string }[]
) => cb(objectId, shop, achievements);
ipcRenderer.on("on-achievement-unlocked", listener);
return () =>
ipcRenderer.removeListener("on-achievement-unlocked", listener);
},
onCombinedAchievementsUnlocked: (
cb: (gameCount: number, achievementsCount: number) => void
) => {
const listener = (
_event: Electron.IpcRendererEvent,
gameCount: number,
achievementCount: number
) => cb(gameCount, achievementCount);
ipcRenderer.on("on-combined-achievements-unlocked", listener);
return () =>
ipcRenderer.removeListener("on-combined-achievements-unlocked", listener);
},
onUpdateAchievements: (
objectId: string,
shop: GameShop,

View file

@ -1,4 +1,4 @@
import { useCallback, useContext, useEffect, useRef, useState } from "react";
import { useCallback, useContext, useEffect, useRef } from "react";
import { Sidebar, BottomPanel, Header, Toast } from "@renderer/components";
@ -29,11 +29,6 @@ import { UserFriendModal } from "./pages/shared-modals/user-friend-modal";
import { downloadSourcesWorker } from "./workers";
import { repacksContext } from "./context";
import { logger } from "./logger";
import { SubscriptionTourModal } from "./pages/shared-modals/subscription-tour-modal";
interface TourModals {
subscriptionModal?: boolean;
}
export interface AppProps {
children: React.ReactNode;
@ -77,9 +72,6 @@ export function App() {
const { showSuccessToast } = useToast();
const [showSubscritionTourModal, setShowSubscritionTourModal] =
useState(false);
useEffect(() => {
Promise.all([window.electron.getUserPreferences(), updateLibrary()]).then(
([preferences]) => {
@ -125,16 +117,6 @@ export function App() {
});
}, [fetchUserDetails, syncFriendRequests, updateUserDetails, dispatch]);
useEffect(() => {
const tourModalsString = window.localStorage.getItem("tourModals") || "{}";
const tourModals = JSON.parse(tourModalsString) as TourModals;
if (!tourModals.subscriptionModal) {
setShowSubscritionTourModal(true);
}
}, []);
const onSignIn = useCallback(() => {
fetchUserDetails().then((response) => {
if (response) {
@ -280,14 +262,6 @@ export function App() {
});
}, [indexRepacks]);
const handleCloseSubscriptionTourModal = () => {
setShowSubscritionTourModal(false);
window.localStorage.setItem(
"tourModals",
JSON.stringify({ subscriptionModal: true } as TourModals)
);
};
const handleToastClose = useCallback(() => {
dispatch(closeToast());
}, [dispatch]);
@ -307,11 +281,6 @@ export function App() {
onClose={handleToastClose}
/>
<SubscriptionTourModal
visible={showSubscritionTourModal && false}
onClose={handleCloseSubscriptionTourModal}
/>
{userDetails && (
<UserFriendModal
visible={isFriendsModalVisible}

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 229 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

View file

@ -1,725 +0,0 @@
{
"v": "5.12.1",
"fr": 30,
"ip": 0,
"op": 60,
"w": 400,
"h": 400,
"nm": "Cloud",
"ddd": 0,
"assets": [],
"layers": [
{
"ddd": 0,
"ind": 2,
"ty": 4,
"nm": "Layer 6",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": {
"a": 1,
"k": [
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 0,
"s": [322.789, 202.565, 0],
"to": [-1.5, -0.167, 0],
"ti": [0, 0, 0]
},
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 30,
"s": [313.789, 201.565, 0],
"to": [0, 0, 0],
"ti": [-1.5, -0.167, 0]
},
{ "t": 60, "s": [322.789, 202.565, 0] }
],
"ix": 2,
"l": 2
},
"a": { "a": 0, "k": [0, 0, 0], "ix": 1, "l": 2 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6, "l": 2 }
},
"ao": 0,
"shapes": [
{
"ty": "gr",
"it": [
{
"ind": 0,
"ty": "sh",
"ix": 1,
"ks": {
"a": 0,
"k": {
"i": [
[0, -38.564],
[38.564, 0],
[0, 38.564],
[-38.564, 0]
],
"o": [
[0, 38.564],
[-38.564, 0],
[0, -38.564],
[38.564, 0]
],
"v": [
[69.827, 0],
[0, 69.827],
[-69.827, 0],
[0, -69.827]
],
"c": true
},
"ix": 2
},
"nm": "Path 1",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ty": "fl",
"c": {
"a": 0,
"k": [0.839215686275, 0.854901960784, 0.933333333333, 1],
"ix": 4
},
"o": { "a": 0, "k": 100, "ix": 5 },
"r": 1,
"bm": 0,
"nm": "Fill 1",
"mn": "ADBE Vector Graphic - Fill",
"hd": false
},
{
"ty": "tr",
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"r": { "a": 0, "k": 0, "ix": 6 },
"o": { "a": 0, "k": 100, "ix": 7 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"nm": "Transform"
}
],
"nm": "Group 1",
"np": 2,
"cix": 2,
"bm": 0,
"ix": 1,
"mn": "ADBE Vector Group",
"hd": false
}
],
"ip": 0,
"op": 270,
"st": 0,
"ct": 1,
"bm": 0
},
{
"ddd": 0,
"ind": 3,
"ty": 4,
"nm": "Layer 5",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": {
"a": 1,
"k": [
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 0,
"s": [243.704, 202.565, 0],
"to": [-1.667, 0, 0],
"ti": [0, 0, 0]
},
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 30,
"s": [233.704, 202.565, 0],
"to": [0, 0, 0],
"ti": [-1.667, 0, 0]
},
{ "t": 60, "s": [243.704, 202.565, 0] }
],
"ix": 2,
"l": 2
},
"a": { "a": 0, "k": [0, 0, 0], "ix": 1, "l": 2 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6, "l": 2 }
},
"ao": 0,
"shapes": [
{
"ty": "gr",
"it": [
{
"ind": 0,
"ty": "sh",
"ix": 1,
"ks": {
"a": 0,
"k": {
"i": [
[0, -38.564],
[38.564, 0],
[0, 38.564],
[-38.564, 0]
],
"o": [
[0, 38.564],
[-38.564, 0],
[0, -38.564],
[38.564, 0]
],
"v": [
[69.827, 0],
[0, 69.827],
[-69.827, 0],
[0, -69.827]
],
"c": true
},
"ix": 2
},
"nm": "Path 1",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ty": "fl",
"c": {
"a": 0,
"k": [0.839215686275, 0.854901960784, 0.933333333333, 1],
"ix": 4
},
"o": { "a": 0, "k": 100, "ix": 5 },
"r": 1,
"bm": 0,
"nm": "Fill 1",
"mn": "ADBE Vector Graphic - Fill",
"hd": false
},
{
"ty": "tr",
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"r": { "a": 0, "k": 0, "ix": 6 },
"o": { "a": 0, "k": 100, "ix": 7 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"nm": "Transform"
}
],
"nm": "Group 1",
"np": 2,
"cix": 2,
"bm": 0,
"ix": 1,
"mn": "ADBE Vector Group",
"hd": false
}
],
"ip": 0,
"op": 270,
"st": 0,
"ct": 1,
"bm": 0
},
{
"ddd": 0,
"ind": 4,
"ty": 4,
"nm": "Layer 4",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": {
"a": 1,
"k": [
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 0,
"s": [260.681, 151.053, 0],
"to": [1.333, -1.333, 0],
"ti": [0, 0, 0]
},
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 30,
"s": [268.681, 143.053, 0],
"to": [0, 0, 0],
"ti": [1.333, -1.333, 0]
},
{ "t": 60, "s": [260.681, 151.053, 0] }
],
"ix": 2,
"l": 2
},
"a": { "a": 0, "k": [0, 0, 0], "ix": 1, "l": 2 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6, "l": 2 }
},
"ao": 0,
"shapes": [
{
"ty": "gr",
"it": [
{
"ind": 0,
"ty": "sh",
"ix": 1,
"ks": {
"a": 0,
"k": {
"i": [
[0, -38.564],
[38.564, 0],
[0, 38.564],
[-38.564, 0]
],
"o": [
[0, 38.564],
[-38.564, 0],
[0, -38.564],
[38.564, 0]
],
"v": [
[69.827, 0],
[0, 69.827],
[-69.827, 0],
[0, -69.827]
],
"c": true
},
"ix": 2
},
"nm": "Path 1",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ty": "fl",
"c": {
"a": 0,
"k": [0.839215686275, 0.854901960784, 0.933333333333, 1],
"ix": 4
},
"o": { "a": 0, "k": 100, "ix": 5 },
"r": 1,
"bm": 0,
"nm": "Fill 1",
"mn": "ADBE Vector Graphic - Fill",
"hd": false
},
{
"ty": "tr",
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"r": { "a": 0, "k": 0, "ix": 6 },
"o": { "a": 0, "k": 100, "ix": 7 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"nm": "Transform"
}
],
"nm": "Group 1",
"np": 2,
"cix": 2,
"bm": 0,
"ix": 1,
"mn": "ADBE Vector Group",
"hd": false
}
],
"ip": 0,
"op": 270,
"st": 0,
"ct": 1,
"bm": 0
},
{
"ddd": 0,
"ind": 5,
"ty": 4,
"nm": "Layer 3",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": {
"a": 1,
"k": [
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 0,
"s": [162.135, 206.563, 0],
"to": [-0.833, -0.167, 0],
"ti": [0, 0, 0]
},
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 30,
"s": [157.135, 205.563, 0],
"to": [0, 0, 0],
"ti": [-0.833, -0.167, 0]
},
{ "t": 60, "s": [162.135, 206.563, 0] }
],
"ix": 2,
"l": 2
},
"a": { "a": 0, "k": [0, 0, 0], "ix": 1, "l": 2 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6, "l": 2 }
},
"ao": 0,
"shapes": [
{
"ty": "gr",
"it": [
{
"ind": 0,
"ty": "sh",
"ix": 1,
"ks": {
"a": 0,
"k": {
"i": [
[0, -36.66],
[36.66, 0],
[0, 36.66],
[-36.66, 0]
],
"o": [
[0, 36.66],
[-36.66, 0],
[0, -36.66],
[36.66, 0]
],
"v": [
[66.378, 0],
[0, 66.378],
[-66.378, 0],
[0, -66.378]
],
"c": true
},
"ix": 2
},
"nm": "Path 1",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ty": "fl",
"c": {
"a": 0,
"k": [0.839215686275, 0.854901960784, 0.933333333333, 1],
"ix": 4
},
"o": { "a": 0, "k": 100, "ix": 5 },
"r": 1,
"bm": 0,
"nm": "Fill 1",
"mn": "ADBE Vector Graphic - Fill",
"hd": false
},
{
"ty": "tr",
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"r": { "a": 0, "k": 0, "ix": 6 },
"o": { "a": 0, "k": 100, "ix": 7 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"nm": "Transform"
}
],
"nm": "Group 1",
"np": 2,
"cix": 2,
"bm": 0,
"ix": 1,
"mn": "ADBE Vector Group",
"hd": false
}
],
"ip": 0,
"op": 270,
"st": 0,
"ct": 1,
"bm": 0
},
{
"ddd": 0,
"ind": 6,
"ty": 4,
"nm": "Layer 2",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": {
"a": 1,
"k": [
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 0,
"s": [180.178, 132.225, 0],
"to": [-0.5, -2.333, 0],
"ti": [0, 0, 0]
},
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 30,
"s": [177.178, 118.225, 0],
"to": [0, 0, 0],
"ti": [-0.5, -2.333, 0]
},
{ "t": 60, "s": [180.178, 132.225, 0] }
],
"ix": 2,
"l": 2
},
"a": { "a": 0, "k": [0, 0, 0], "ix": 1, "l": 2 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6, "l": 2 }
},
"ao": 0,
"shapes": [
{
"ty": "gr",
"it": [
{
"ind": 0,
"ty": "sh",
"ix": 1,
"ks": {
"a": 0,
"k": {
"i": [
[0, -50.068],
[50.068, 0],
[0, 50.068],
[-50.068, 0]
],
"o": [
[0, 50.068],
[-50.068, 0],
[0, -50.068],
[50.068, 0]
],
"v": [
[90.655, 0],
[0, 90.655],
[-90.655, 0],
[0, -90.655]
],
"c": true
},
"ix": 2
},
"nm": "Path 1",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ty": "fl",
"c": {
"a": 0,
"k": [0.839215686275, 0.854901960784, 0.933333333333, 1],
"ix": 4
},
"o": { "a": 0, "k": 100, "ix": 5 },
"r": 1,
"bm": 0,
"nm": "Fill 1",
"mn": "ADBE Vector Graphic - Fill",
"hd": false
},
{
"ty": "tr",
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"r": { "a": 0, "k": 0, "ix": 6 },
"o": { "a": 0, "k": 100, "ix": 7 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"nm": "Transform"
}
],
"nm": "Group 1",
"np": 2,
"cix": 2,
"bm": 0,
"ix": 1,
"mn": "ADBE Vector Group",
"hd": false
}
],
"ip": 0,
"op": 270,
"st": 0,
"ct": 1,
"bm": 0
},
{
"ddd": 0,
"ind": 7,
"ty": 4,
"nm": "Layer 1",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": {
"a": 1,
"k": [
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 0,
"s": [95.756, 208.288, 0],
"to": [-1.167, 0, 0],
"ti": [0, 0, 0]
},
{
"i": { "x": 0.667, "y": 1 },
"o": { "x": 0.333, "y": 0 },
"t": 30,
"s": [88.756, 208.288, 0],
"to": [0, 0, 0],
"ti": [-1.167, 0, 0]
},
{ "t": 60, "s": [95.756, 208.288, 0] }
],
"ix": 2,
"l": 2
},
"a": { "a": 0, "k": [0, 0, 0], "ix": 1, "l": 2 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6, "l": 2 }
},
"ao": 0,
"shapes": [
{
"ty": "gr",
"it": [
{
"ind": 0,
"ty": "sh",
"ix": 1,
"ks": {
"a": 0,
"k": {
"i": [
[0, -35.403],
[35.403, 0],
[0, 35.403],
[-35.403, 0]
],
"o": [
[0, 35.403],
[-35.403, 0],
[0, -35.403],
[35.403, 0]
],
"v": [
[64.103, 0],
[0, 64.103],
[-64.103, 0],
[0, -64.103]
],
"c": true
},
"ix": 2
},
"nm": "Path 1",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ty": "fl",
"c": {
"a": 0,
"k": [0.839215686275, 0.854901960784, 0.933333333333, 1],
"ix": 4
},
"o": { "a": 0, "k": 100, "ix": 5 },
"r": 1,
"bm": 0,
"nm": "Fill 1",
"mn": "ADBE Vector Graphic - Fill",
"hd": false
},
{
"ty": "tr",
"p": { "a": 0, "k": [0, 0], "ix": 2 },
"a": { "a": 0, "k": [0, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100], "ix": 3 },
"r": { "a": 0, "k": 0, "ix": 6 },
"o": { "a": 0, "k": 100, "ix": 7 },
"sk": { "a": 0, "k": 0, "ix": 4 },
"sa": { "a": 0, "k": 0, "ix": 5 },
"nm": "Transform"
}
],
"nm": "Group 1",
"np": 2,
"cix": 2,
"bm": 0,
"ix": 1,
"mn": "ADBE Vector Group",
"hd": false
}
],
"ip": 0,
"op": 270,
"st": 0,
"ct": 1,
"bm": 0
},
{
"ddd": 0,
"ind": 8,
"ty": 3,
"nm": "Null 1",
"parent": 6,
"sr": 1,
"ks": {
"o": { "a": 0, "k": 0, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": { "a": 0, "k": [19.822, 67.775, 0], "ix": 2, "l": 2 },
"a": { "a": 0, "k": [0, 0, 0], "ix": 1, "l": 2 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6, "l": 2 }
},
"ao": 0,
"ip": 0,
"op": 270,
"st": 0,
"bm": 0
}
],
"markers": [],
"props": {}
}

File diff suppressed because it is too large Load diff

File diff suppressed because it is too large Load diff

View file

@ -1,928 +0,0 @@
{
"v": "4.8.0",
"meta": { "g": "LottieFiles AE 3.5.6", "a": "", "k": "", "d": "", "tc": "" },
"fr": 60,
"ip": 0,
"op": 120,
"w": 300,
"h": 300,
"nm": "Comp 1",
"ddd": 0,
"assets": [
{
"id": "comp_0",
"layers": [
{
"ddd": 0,
"ind": 1,
"ty": 5,
"nm": "3",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": {
"a": 1,
"k": [
{
"i": { "x": [0.055], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 0,
"s": [0]
},
{
"i": { "x": [0.055], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 30,
"s": [8]
},
{ "t": 60, "s": [0] }
],
"ix": 10
},
"p": { "a": 0, "k": [930, 525, 0], "ix": 2 },
"a": { "a": 0, "k": [16.605, -23.904, 0], "ix": 1 },
"s": { "a": 0, "k": [170, 170, 100], "ix": 6 }
},
"ao": 0,
"hasMask": true,
"masksProperties": [
{
"inv": false,
"mode": "a",
"pt": {
"a": 0,
"k": {
"i": [
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0]
],
"o": [
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0]
],
"v": [
[14.987, -34.426],
[9.105, -30.309],
[9.987, -22.073],
[17.487, -16.779],
[24.105, -23.544],
[22.193, -30.603]
],
"c": true
},
"ix": 1
},
"o": { "a": 0, "k": 100, "ix": 3 },
"x": { "a": 0, "k": 0, "ix": 4 },
"nm": "Mask 1"
}
],
"ef": [
{
"ty": 21,
"nm": "Fill",
"np": 9,
"mn": "ADBE Fill",
"ix": 1,
"en": 1,
"ef": [
{
"ty": 10,
"nm": "Fill Mask",
"mn": "ADBE Fill-0001",
"ix": 1,
"v": { "a": 0, "k": 0, "ix": 1 }
},
{
"ty": 7,
"nm": "All Masks",
"mn": "ADBE Fill-0007",
"ix": 2,
"v": { "a": 0, "k": 0, "ix": 2 }
},
{
"ty": 2,
"nm": "Color",
"mn": "ADBE Fill-0002",
"ix": 3,
"v": {
"a": 0,
"k": [0.992156863213, 0.880375564098, 0.128396704793, 1],
"ix": 3
}
},
{
"ty": 7,
"nm": "Invert",
"mn": "ADBE Fill-0006",
"ix": 4,
"v": { "a": 0, "k": 0, "ix": 4 }
},
{
"ty": 0,
"nm": "Horizontal Feather",
"mn": "ADBE Fill-0003",
"ix": 5,
"v": { "a": 0, "k": 0, "ix": 5 }
},
{
"ty": 0,
"nm": "Vertical Feather",
"mn": "ADBE Fill-0004",
"ix": 6,
"v": { "a": 0, "k": 0, "ix": 6 }
},
{
"ty": 0,
"nm": "Opacity",
"mn": "ADBE Fill-0005",
"ix": 7,
"v": { "a": 0, "k": 1, "ix": 7 }
}
]
}
],
"t": {
"d": {
"k": [
{
"s": {
"s": 40,
"f": "SegoeUIEmoji",
"t": "✨",
"j": 0,
"tr": 0,
"lh": 48,
"ls": 0,
"fc": [1, 1, 1]
},
"t": 0
}
]
},
"p": {},
"m": { "g": 1, "a": { "a": 0, "k": [0, 0], "ix": 2 } },
"a": []
},
"ip": 0,
"op": 123,
"st": 0,
"bm": 0
},
{
"ddd": 0,
"ind": 2,
"ty": 5,
"nm": "2",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": {
"a": 1,
"k": [
{
"i": { "x": [0.055], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 0,
"s": [0]
},
{
"i": { "x": [0.055], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 30,
"s": [-8]
},
{ "t": 60, "s": [0] }
],
"ix": 10
},
"p": { "a": 0, "k": [960, 540, 0], "ix": 2 },
"a": { "a": 0, "k": [31.912, -13.397, 0], "ix": 1 },
"s": { "a": 0, "k": [170, 170, 100], "ix": 6 }
},
"ao": 0,
"hasMask": true,
"masksProperties": [
{
"inv": false,
"mode": "a",
"pt": {
"a": 0,
"k": {
"i": [
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0]
],
"o": [
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0]
],
"v": [
[31.31, -34.72],
[24.546, -22.514],
[16.605, -16.485],
[17.046, -11.338],
[21.163, -7.073],
[27.487, -0.309],
[33.663, 10.133],
[47.634, -1.926],
[51.31, -12.073]
],
"c": true
},
"ix": 1
},
"o": { "a": 0, "k": 100, "ix": 3 },
"x": { "a": 0, "k": 0, "ix": 4 },
"nm": "Mask 1"
}
],
"ef": [
{
"ty": 21,
"nm": "Fill",
"np": 9,
"mn": "ADBE Fill",
"ix": 1,
"en": 1,
"ef": [
{
"ty": 10,
"nm": "Fill Mask",
"mn": "ADBE Fill-0001",
"ix": 1,
"v": { "a": 0, "k": 0, "ix": 1 }
},
{
"ty": 7,
"nm": "All Masks",
"mn": "ADBE Fill-0007",
"ix": 2,
"v": { "a": 0, "k": 0, "ix": 2 }
},
{
"ty": 2,
"nm": "Color",
"mn": "ADBE Fill-0002",
"ix": 3,
"v": {
"a": 0,
"k": [0.992156863213, 0.880375564098, 0.128396704793, 1],
"ix": 3
}
},
{
"ty": 7,
"nm": "Invert",
"mn": "ADBE Fill-0006",
"ix": 4,
"v": { "a": 0, "k": 0, "ix": 4 }
},
{
"ty": 0,
"nm": "Horizontal Feather",
"mn": "ADBE Fill-0003",
"ix": 5,
"v": { "a": 0, "k": 0, "ix": 5 }
},
{
"ty": 0,
"nm": "Vertical Feather",
"mn": "ADBE Fill-0004",
"ix": 6,
"v": { "a": 0, "k": 0, "ix": 6 }
},
{
"ty": 0,
"nm": "Opacity",
"mn": "ADBE Fill-0005",
"ix": 7,
"v": { "a": 0, "k": 1, "ix": 7 }
}
]
}
],
"t": {
"d": {
"k": [
{
"s": {
"s": 40,
"f": "SegoeUIEmoji",
"t": "✨",
"j": 0,
"tr": 0,
"lh": 48,
"ls": 0,
"fc": [1, 1, 1]
},
"t": 0
}
]
},
"p": {},
"m": { "g": 1, "a": { "a": 0, "k": [0, 0], "ix": 2 } },
"a": []
},
"ip": 0,
"op": 123,
"st": 0,
"bm": 0
},
{
"ddd": 0,
"ind": 3,
"ty": 5,
"nm": "✨",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": {
"a": 1,
"k": [
{
"i": { "x": [0.055], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 0,
"s": [0]
},
{
"i": { "x": [0.055], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 30,
"s": [8]
},
{ "t": 60, "s": [0] }
],
"ix": 10
},
"p": { "a": 0, "k": [935, 560, 0], "ix": 2 },
"a": { "a": 0, "k": [14.973, -6.64, 0], "ix": 1 },
"s": { "a": 0, "k": [170, 170, 100], "ix": 6 }
},
"ao": 0,
"hasMask": true,
"masksProperties": [
{
"inv": false,
"mode": "a",
"pt": {
"a": 0,
"k": {
"i": [
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0]
],
"o": [
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0],
[0, 0]
],
"v": [
[13.957, -17.514],
[2.928, -9.132],
[2.487, 1.603],
[14.105, 7.339],
[21.605, -0.161],
[22.193, -5.161],
[17.34, -10.014]
],
"c": true
},
"ix": 1
},
"o": { "a": 0, "k": 100, "ix": 3 },
"x": { "a": 0, "k": 0, "ix": 4 },
"nm": "Mask 1"
}
],
"ef": [
{
"ty": 21,
"nm": "Fill",
"np": 9,
"mn": "ADBE Fill",
"ix": 1,
"en": 1,
"ef": [
{
"ty": 10,
"nm": "Fill Mask",
"mn": "ADBE Fill-0001",
"ix": 1,
"v": { "a": 0, "k": 0, "ix": 1 }
},
{
"ty": 7,
"nm": "All Masks",
"mn": "ADBE Fill-0007",
"ix": 2,
"v": { "a": 0, "k": 0, "ix": 2 }
},
{
"ty": 2,
"nm": "Color",
"mn": "ADBE Fill-0002",
"ix": 3,
"v": {
"a": 0,
"k": [0.992156863213, 0.880375564098, 0.128396704793, 1],
"ix": 3
}
},
{
"ty": 7,
"nm": "Invert",
"mn": "ADBE Fill-0006",
"ix": 4,
"v": { "a": 0, "k": 0, "ix": 4 }
},
{
"ty": 0,
"nm": "Horizontal Feather",
"mn": "ADBE Fill-0003",
"ix": 5,
"v": { "a": 0, "k": 0, "ix": 5 }
},
{
"ty": 0,
"nm": "Vertical Feather",
"mn": "ADBE Fill-0004",
"ix": 6,
"v": { "a": 0, "k": 0, "ix": 6 }
},
{
"ty": 0,
"nm": "Opacity",
"mn": "ADBE Fill-0005",
"ix": 7,
"v": { "a": 0, "k": 1, "ix": 7 }
}
]
}
],
"t": {
"d": {
"k": [
{
"s": {
"s": 40,
"f": "SegoeUIEmoji",
"t": "✨",
"j": 0,
"tr": 0,
"lh": 48,
"ls": 0,
"fc": [1, 1, 1]
},
"t": 0
}
]
},
"p": {},
"m": { "g": 1, "a": { "a": 0, "k": [0, 0], "ix": 2 } },
"a": []
},
"ip": 0,
"op": 123,
"st": 0,
"bm": 0
}
]
}
],
"fonts": {
"list": [
{
"fName": "SegoeUIEmoji",
"fFamily": "Segoe UI Emoji",
"fStyle": "Regular",
"ascent": 74.0234375
}
]
},
"layers": [
{
"ddd": 0,
"ind": 1,
"ty": 0,
"nm": "botão",
"refId": "comp_0",
"sr": 1,
"ks": {
"o": { "a": 0, "k": 100, "ix": 11 },
"r": { "a": 0, "k": 0, "ix": 10 },
"p": { "a": 0, "k": [155, 154, 0], "ix": 2 },
"a": { "a": 0, "k": [960, 540, 0], "ix": 1 },
"s": { "a": 0, "k": [100, 100, 100], "ix": 6 }
},
"ao": 0,
"ef": [
{
"ty": 25,
"nm": "Drop Shadow",
"np": 8,
"mn": "ADBE Drop Shadow",
"ix": 1,
"en": 1,
"ef": [
{
"ty": 2,
"nm": "Shadow Color",
"mn": "ADBE Drop Shadow-0001",
"ix": 1,
"v": {
"a": 0,
"k": [1, 0.829733371735, 0.414901971817, 1],
"ix": 1
}
},
{
"ty": 0,
"nm": "Opacity",
"mn": "ADBE Drop Shadow-0002",
"ix": 2,
"v": {
"a": 1,
"k": [
{
"i": { "x": [0], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 0,
"s": [127.5]
},
{
"i": { "x": [0], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 15,
"s": [204]
},
{
"i": { "x": [0], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 30,
"s": [127.5]
},
{
"i": { "x": [0], "y": [1] },
"o": { "x": [0.333], "y": [0] },
"t": 45,
"s": [204]
},
{ "t": 70, "s": [76.5] }
],
"ix": 2
}
},
{
"ty": 0,
"nm": "Direction",
"mn": "ADBE Drop Shadow-0003",
"ix": 3,
"v": { "a": 0, "k": 135, "ix": 3 }
},
{
"ty": 0,
"nm": "Distance",
"mn": "ADBE Drop Shadow-0004",
"ix": 4,
"v": { "a": 0, "k": 0, "ix": 4 }
},
{
"ty": 0,
"nm": "Softness",
"mn": "ADBE Drop Shadow-0005",
"ix": 5,
"v": { "a": 0, "k": 40, "ix": 5 }
},
{
"ty": 7,
"nm": "Shadow Only",
"mn": "ADBE Drop Shadow-0006",
"ix": 6,
"v": { "a": 0, "k": 0, "ix": 6 }
}
]
}
],
"w": 1920,
"h": 1080,
"ip": 0,
"op": 120,
"st": 0,
"bm": 0
}
],
"markers": [],
"chars": [
{
"ch": "✨",
"size": 40,
"style": "Regular",
"w": 137.3,
"data": {
"shapes": [
{
"ty": "gr",
"it": [
{
"ind": 0,
"ty": "sh",
"ix": 1,
"ks": {
"a": 0,
"k": {
"i": [
[0.423, 1.042],
[0, 0],
[0.7, 0],
[0.293, -0.618],
[0, 0],
[1.041, -0.488],
[0, 0],
[0, -0.684],
[-0.652, -0.293],
[0, 0],
[-0.423, -1.041],
[0, 0],
[-0.716, 0],
[-0.293, 0.619],
[0, 0],
[-1.042, 0.488],
[0, 0],
[0, 0.684],
[0.618, 0.293],
[0, 0]
],
"o": [
[0, 0],
[-0.326, -0.618],
[-0.7, 0],
[0, 0],
[-0.456, 1.009],
[0, 0],
[-0.652, 0.293],
[0, 0.684],
[0, 0],
[1.074, 0.456],
[0, 0],
[0.293, 0.619],
[0.716, 0],
[0, 0],
[0.455, -1.009],
[0, 0],
[0.618, -0.293],
[0, -0.684],
[0, 0],
[-1.074, -0.455]
],
"v": [
[47.119, -68.994],
[43.799, -76.562],
[42.261, -77.49],
[40.771, -76.562],
[37.402, -68.994],
[35.156, -66.748],
[30.908, -64.893],
[29.932, -63.428],
[30.908, -61.963],
[35.156, -60.107],
[37.402, -57.861],
[40.771, -50.244],
[42.285, -49.316],
[43.799, -50.244],
[47.119, -57.861],
[49.365, -60.107],
[53.662, -61.963],
[54.59, -63.428],
[53.662, -64.893],
[49.365, -66.748]
],
"c": true
},
"ix": 2
},
"nm": "✨",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ind": 1,
"ty": "sh",
"ix": 2,
"ks": {
"a": 0,
"k": {
"i": [
[1.334, 3.223],
[0, 0],
[1.204, 0.423],
[1.204, -0.423],
[0.618, -1.237],
[0, 0],
[3.125, -1.432],
[0, 0],
[0.423, -1.221],
[-0.423, -1.221],
[-1.27, -0.618],
[0, 0],
[-1.335, -3.223],
[0, 0],
[-1.205, -0.407],
[-1.205, 0.407],
[-0.619, 1.27],
[0, 0],
[-3.125, 1.433],
[0, 0],
[-0.423, 1.221],
[0.423, 1.221],
[1.27, 0.619],
[0, 0]
],
"o": [
[0, 0],
[-0.619, -1.237],
[-1.205, -0.423],
[-1.205, 0.423],
[0, 0],
[-1.367, 3.223],
[0, 0],
[-1.27, 0.619],
[-0.423, 1.221],
[0.423, 1.221],
[0, 0],
[3.157, 1.433],
[0, 0],
[0.618, 1.27],
[1.204, 0.407],
[1.204, -0.407],
[0, 0],
[1.367, -3.223],
[0, 0],
[1.27, -0.618],
[0.423, -1.221],
[-0.423, -1.221],
[0, 0],
[-3.158, -1.432]
],
"v": [
[95.605, -50.83],
[85.498, -74.658],
[82.764, -77.148],
[79.15, -77.148],
[76.416, -74.658],
[66.357, -50.83],
[59.619, -43.848],
[46.875, -38.086],
[44.336, -35.327],
[44.336, -31.665],
[46.875, -28.906],
[59.619, -23.145],
[66.357, -16.162],
[76.416, 7.666],
[79.15, 10.181],
[82.764, 10.181],
[85.498, 7.666],
[95.605, -16.162],
[102.344, -23.145],
[115.088, -28.906],
[117.627, -31.665],
[117.627, -35.327],
[115.088, -38.086],
[102.344, -43.848]
],
"c": true
},
"ix": 2
},
"nm": "✨",
"mn": "ADBE Vector Shape - Group",
"hd": false
},
{
"ind": 2,
"ty": "sh",
"ix": 3,
"ks": {
"a": 0,
"k": {
"i": [
[-1.367, -0.651],
[0, 0],
[0, -0.928],
[0.813, -0.423],
[0, 0],
[0.586, -1.399],
[0, 0],
[0.895, 0],
[0.391, 0.846],
[0, 0],
[1.334, 0.652],
[0, 0],
[0, 0.928],
[-0.814, 0.423],
[0, 0],
[-0.586, 1.4],
[0, 0],
[-0.896, 0],
[-0.391, -0.846],
[0, 0]
],
"o": [
[0, 0],
[0.813, 0.423],
[0, 0.928],
[0, 0],
[-1.335, 0.652],
[0, 0],
[-0.391, 0.846],
[-0.896, 0],
[0, 0],
[-0.586, -1.399],
[0, 0],
[-0.814, -0.423],
[0, -0.928],
[0, 0],
[1.334, -0.651],
[0, 0],
[0.391, -0.846],
[0.895, 0],
[0, 0],
[0.553, 1.4]
],
"v": [
[44.385, -16.943],
[49.854, -14.404],
[51.074, -12.378],
[49.854, -10.352],
[44.385, -7.812],
[41.504, -4.736],
[37.158, 5.713],
[35.229, 6.982],
[33.301, 5.713],
[28.955, -4.736],
[26.074, -7.812],
[20.605, -10.352],
[19.385, -12.378],
[20.605, -14.404],
[26.074, -16.943],
[28.955, -20.02],
[33.301, -30.469],
[35.229, -31.738],
[37.158, -30.469],
[41.504, -20.02]
],
"c": true
},
"ix": 2
},
"nm": "✨",
"mn": "ADBE Vector Shape - Group",
"hd": false
}
],
"nm": "✨",
"np": 6,
"cix": 2,
"bm": 0,
"ix": 1,
"mn": "ADBE Vector Group",
"hd": false
}
]
},
"fFamily": "Segoe UI Emoji"
}
]
}

View file

@ -1,23 +0,0 @@
import { style } from "@vanilla-extract/css";
import { vars } from "../../theme.css";
export const profileAvatar = style({
borderRadius: "4px",
display: "flex",
justifyContent: "center",
alignItems: "center",
backgroundColor: vars.color.background,
border: `solid 1px ${vars.color.border}`,
cursor: "pointer",
color: vars.color.muted,
position: "relative",
});
export const profileAvatarImage = style({
height: "100%",
width: "100%",
objectFit: "cover",
overflow: "hidden",
borderRadius: "4px",
});

View file

@ -0,0 +1,21 @@
@use "../../scss/globals.scss";
.profile-avatar {
border-radius: 4px;
display: flex;
justify-content: center;
align-items: center;
background-color: globals.$background-color;
border: solid 1px globals.$border-color;
cursor: pointer;
color: globals.$muted-color;
position: relative;
&__image {
height: 100%;
width: 100%;
object-fit: cover;
overflow: hidden;
border-radius: 4px;
}
}

View file

@ -1,6 +1,6 @@
import { PersonIcon } from "@primer/octicons-react";
import * as styles from "./avatar.css";
import "./avatar.scss";
export interface AvatarProps
extends Omit<
@ -16,14 +16,9 @@ export interface AvatarProps
export function Avatar({ size, alt, src, ...props }: AvatarProps) {
return (
<div className={styles.profileAvatar} style={{ width: size, height: size }}>
<div className="profile-avatar" style={{ width: size, height: size }}>
{src ? (
<img
className={styles.profileAvatarImage}
alt={alt}
src={src}
{...props}
/>
<img className="profile-avatar__image" alt={alt} src={src} {...props} />
) : (
<PersonIcon size={size * 0.7} />
)}

View file

@ -1,13 +0,0 @@
import { style } from "@vanilla-extract/css";
import { SPACING_UNIT } from "../../theme.css";
export const badge = style({
color: "#c0c1c7",
fontSize: "10px",
padding: `${SPACING_UNIT / 2}px ${SPACING_UNIT}px`,
border: "solid 1px #c0c1c7",
borderRadius: "4px",
display: "flex",
alignItems: "center",
});

View file

@ -0,0 +1,11 @@
@use "../../scss/globals.scss";
.badge {
color: globals.$muted-color;
font-size: 10px;
padding: calc(globals.$spacing-unit / 2) globals.$spacing-unit;
border: solid 1px globals.$border-color;
border-radius: 4px;
display: flex;
align-items: center;
}

View file

@ -1,5 +1,6 @@
import React from "react";
import * as styles from "./badge.css";
import "./badge.scss";
export interface BadgeProps {
children: React.ReactNode;
@ -7,7 +8,7 @@ export interface BadgeProps {
export function Badge({ children }: BadgeProps) {
return (
<div className={styles.badge}>
<div className="badge">
<span>{children}</span>
</div>
);

View file

@ -1,25 +0,0 @@
import { style } from "@vanilla-extract/css";
import { SPACING_UNIT, vars } from "../../theme.css";
export const bottomPanel = style({
width: "100%",
borderTop: `solid 1px ${vars.color.border}`,
backgroundColor: vars.color.background,
padding: `${SPACING_UNIT / 2}px ${SPACING_UNIT * 2}px`,
display: "flex",
alignItems: "center",
transition: "all ease 0.2s",
justifyContent: "space-between",
position: "relative",
zIndex: vars.zIndex.bottomPanel,
});
export const downloadsButton = style({
color: vars.color.body,
borderBottom: "1px solid transparent",
":hover": {
borderBottom: `1px solid ${vars.color.body}`,
cursor: "pointer",
},
});

View file

@ -0,0 +1,24 @@
@use "../../scss/globals.scss";
.bottom-panel {
width: "100%";
border-top: solid 1px globals.$border-color;
background-color: globals.$background-color;
padding: calc(globals.$spacing-unit / 2) calc(globals.$spacing-unit * 2);
display: flex;
align-items: center;
transition: all ease 0.2s;
justify-content: space-between;
position: relative;
z-index: globals.$bottom-panel-z-index;
&__downloads-button {
color: globals.$body-color;
border-bottom: solid 1px transparent;
&:hover {
border-bottom: solid 1px globals.$body-color;
cursor: pointer;
}
}
}

View file

@ -3,7 +3,7 @@ import { useTranslation } from "react-i18next";
import { useDownload, useUserDetails } from "@renderer/hooks";
import * as styles from "./bottom-panel.css";
import "./bottom-panel.scss";
import { useNavigate } from "react-router-dom";
import { VERSION_CODENAME } from "@renderer/constants";
@ -72,10 +72,10 @@ export function BottomPanel() {
]);
return (
<footer className={styles.bottomPanel}>
<footer className="bottom-panel">
<button
type="button"
className={styles.downloadsButton}
className="bottom-panel__downloads-button"
onClick={() => navigate("/downloads")}
>
<small>{status}</small>

View file

@ -1,69 +0,0 @@
import { style, styleVariants } from "@vanilla-extract/css";
import { SPACING_UNIT, vars } from "../../theme.css";
const base = style({
padding: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px`,
backgroundColor: vars.color.muted,
borderRadius: "8px",
border: "solid 1px transparent",
transition: "all ease 0.2s",
cursor: "pointer",
minHeight: "40px",
display: "flex",
alignItems: "center",
justifyContent: "center",
gap: `${SPACING_UNIT}px`,
":active": {
opacity: vars.opacity.active,
},
":disabled": {
opacity: vars.opacity.disabled,
cursor: "not-allowed",
},
});
export const button = styleVariants({
primary: [
base,
{
":hover": {
backgroundColor: "#DADBE1",
},
":disabled": {
backgroundColor: vars.color.muted,
},
},
],
outline: [
base,
{
backgroundColor: "transparent",
border: `solid 1px ${vars.color.border}`,
color: vars.color.muted,
":hover": {
backgroundColor: "rgba(255, 255, 255, 0.1)",
},
":disabled": {
backgroundColor: "transparent",
},
},
],
dark: [
base,
{
backgroundColor: vars.color.darkBackground,
color: "#c0c1c7",
},
],
danger: [
base,
{
borderColor: "transparent",
backgroundColor: "#a31533",
color: "#c0c1c7",
":hover": {
backgroundColor: "#b3203f",
},
},
],
});

View file

@ -0,0 +1,63 @@
@use "../../scss/globals.scss";
.button {
padding: globals.$spacing-unit globals.$spacing-unit * 2;
background-color: globals.$muted-color;
border-radius: 8px;
border: solid 1px transparent;
transition: all ease 0.2s;
cursor: pointer;
min-height: 40px;
display: flex;
align-items: center;
justify-content: center;
gap: globals.$spacing-unit;
&:active {
opacity: globals.$active-opacity;
}
&:disabled {
opacity: globals.$disabled-opacity;
cursor: not-allowed;
}
&--primary {
&:hover {
background-color: #dadbe1;
}
&:disabled {
background-color: globals.$muted-color;
}
}
&--outline {
background-color: transparent;
border: solid 1px globals.$border-color;
color: globals.$muted-color;
&:hover {
background-color: rgba(255, 255, 255, 0.1);
}
&:disabled {
background-color: transparent;
}
}
&--dark {
background-color: globals.$dark-background-color;
color: globals.$muted-color;
}
&--danger {
border-color: transparent;
background-color: globals.$danger-color;
color: globals.$muted-color;
&:hover {
background-color: #b3203f;
}
}
}

View file

@ -1,12 +1,13 @@
import cn from "classnames";
import * as styles from "./button.css";
import "./button.scss";
export interface ButtonProps
extends React.DetailedHTMLProps<
React.ButtonHTMLAttributes<HTMLButtonElement>,
HTMLButtonElement
> {
theme?: keyof typeof styles.button;
theme?: "primary" | "outline" | "dark" | "danger";
}
export function Button({
@ -18,7 +19,7 @@ export function Button({
return (
<button
type="button"
className={cn(styles.button[theme], className)}
className={cn("button", `button--${theme}`, className)}
{...props}
>
{children}

View file

@ -1,18 +0,0 @@
import Lottie from "lottie-react";
import downloadingAnimation from "@renderer/assets/lottie/downloading.json";
export interface DownloadIconProps {
isDownloading: boolean;
}
export function DownloadIcon({ isDownloading }: DownloadIconProps) {
return (
<Lottie
animationData={downloadingAnimation}
loop={isDownloading}
autoplay={isDownloading}
style={{ width: 16 }}
/>
);
}

View file

@ -1,6 +1,9 @@
import { AppsIcon, GearIcon, HomeIcon } from "@primer/octicons-react";
import { DownloadIcon } from "./download-icon";
import {
AppsIcon,
DownloadIcon,
GearIcon,
HomeIcon,
} from "@primer/octicons-react";
export const routes = [
{
@ -16,9 +19,7 @@ export const routes = [
{
path: "/downloads",
nameKey: "downloads",
render: (isDownloading: boolean) => (
<DownloadIcon isDownloading={isDownloading} />
),
render: () => <DownloadIcon />,
},
{
path: "/settings",

View file

@ -50,10 +50,6 @@ export function Sidebar() {
updateLibrary();
}, [lastPacket?.game.id, updateLibrary]);
const isDownloading = sortedLibrary.some(
(game) => game.status === "active" && game.progress !== 1
);
const sidebarRef = useRef<HTMLElement>(null);
const cursorPos = useRef({ x: 0 });
@ -187,7 +183,7 @@ export function Sidebar() {
className={styles.menuItemButton}
onClick={() => handleSidebarItemClick(path)}
>
{render(isDownloading)}
{render()}
<span>{t(nameKey)}</span>
</button>
</li>

View file

@ -66,16 +66,6 @@ declare global {
searchGameRepacks: (query: string) => Promise<GameRepack[]>;
getGameStats: (objectId: string, shop: GameShop) => Promise<GameStats>;
getTrendingGames: () => Promise<TrendingGame[]>;
onAchievementUnlocked: (
cb: (
objectId: string,
shop: GameShop,
achievements?: { displayName: string; iconUrl: string }[]
) => void
) => () => Electron.IpcRenderer;
onCombinedAchievementsUnlocked: (
cb: (gameCount: number, achievementCount: number) => void
) => () => Electron.IpcRenderer;
onUpdateAchievements: (
objectId: string,
shop: GameShop,

View file

@ -6,8 +6,6 @@ import { Provider } from "react-redux";
import LanguageDetector from "i18next-browser-languagedetector";
import { HashRouter, Route, Routes } from "react-router-dom";
import * as Sentry from "@sentry/electron/renderer";
import "@fontsource/noto-sans/400.css";
import "@fontsource/noto-sans/500.css";
import "@fontsource/noto-sans/700.css";
@ -19,9 +17,7 @@ import { App } from "./app";
import { store } from "./store";
import resources from "@locales";
import { AchievementNotification } from "./pages/achievements/notification/achievement-notification";
import "./workers";
import { RepacksContextProvider } from "./context";
import { SuspenseWrapper } from "./components";
@ -38,8 +34,6 @@ const Achievements = React.lazy(
() => import("./pages/achievements/achievements")
);
Sentry.init({});
i18n
.use(LanguageDetector)
.use(initReactI18next)
@ -97,10 +91,6 @@ ReactDOM.createRoot(document.getElementById("root")!).render(
element={<SuspenseWrapper Component={Achievements} />}
/>
</Route>
<Route
path="/achievement-notification"
Component={AchievementNotification}
/>
</Routes>
</HashRouter>
</RepacksContextProvider>

View file

@ -273,7 +273,6 @@ export function AchievementsContent({
src={steamUrlBuilder.libraryHero(objectId)}
style={{ display: "none" }}
alt={gameTitle}
className={styles.heroImage}
onLoad={handleHeroLoad}
/>

View file

@ -23,31 +23,6 @@ export const hero = style({
flexDirection: "column",
position: "relative",
transition: "all ease 0.2s",
"@media": {
"(min-width: 1250px)": {
height: "350px",
minHeight: "350px",
},
},
});
export const heroImage = style({
width: "100%",
height: `${HERO_HEIGHT}px`,
minHeight: `${HERO_HEIGHT}px`,
objectFit: "cover",
objectPosition: "top",
transition: "all ease 0.2s",
position: "absolute",
zIndex: "0",
filter: "blur(5px)",
"@media": {
"(min-width: 1250px)": {
objectPosition: "center",
height: "350px",
minHeight: "350px",
},
},
});
export const heroContent = style({

View file

@ -1,44 +0,0 @@
import { recipe } from "@vanilla-extract/recipes";
import { vars } from "../../../theme.css";
import { keyframes, style } from "@vanilla-extract/css";
const animationIn = keyframes({
"0%": { transform: `translateY(-240px)` },
"100%": { transform: "translateY(0)" },
});
const animationOut = keyframes({
"0%": { transform: `translateY(0)` },
"100%": { transform: "translateY(-240px)" },
});
export const container = recipe({
base: {
marginTop: "24px",
marginLeft: "24px",
animationDuration: "1.0s",
height: "60px",
display: "flex",
},
variants: {
closing: {
true: {
animationName: animationOut,
transform: "translateY(-240px)",
},
false: {
animationName: animationIn,
transform: "translateY(0)",
},
},
},
});
export const content = style({
display: "flex",
flexDirection: "row",
gap: "8px",
alignItems: "center",
background: vars.color.background,
paddingRight: "8px",
});

View file

@ -1,141 +0,0 @@
import { useCallback, useEffect, useRef, useState } from "react";
import achievementSound from "@renderer/assets/audio/achievement.wav";
import { useTranslation } from "react-i18next";
import * as styles from "./achievement-notification.css";
interface AchievementInfo {
displayName: string;
iconUrl: string;
}
const NOTIFICATION_TIMEOUT = 4000;
export function AchievementNotification() {
const { t } = useTranslation("achievement");
const [isClosing, setIsClosing] = useState(false);
const [isVisible, setIsVisible] = useState(false);
const [achievements, setAchievements] = useState<AchievementInfo[]>([]);
const [currentAchievement, setCurrentAchievement] =
useState<AchievementInfo | null>(null);
const achievementAnimation = useRef(-1);
const closingAnimation = useRef(-1);
const visibleAnimation = useRef(-1);
const playAudio = useCallback(() => {
const audio = new Audio(achievementSound);
audio.volume = 0.2;
audio.play();
}, []);
useEffect(() => {
const unsubscribe = window.electron.onCombinedAchievementsUnlocked(
(gameCount, achievementCount) => {
if (gameCount === 0 || achievementCount === 0) return;
setAchievements([
{
displayName: t("new_achievements_unlocked", {
gameCount,
achievementCount,
}),
iconUrl:
"https://avatars.githubusercontent.com/u/164102380?s=400&u=01a13a7b4f0c642f7e547b8e1d70440ea06fa750&v=4",
},
]);
playAudio();
}
);
return () => {
unsubscribe();
};
}, [playAudio]);
useEffect(() => {
const unsubscribe = window.electron.onAchievementUnlocked(
(_object, _shop, achievements) => {
if (!achievements || !achievements.length) return;
setAchievements((ach) => ach.concat(achievements));
playAudio();
}
);
return () => {
unsubscribe();
};
}, [playAudio]);
const hasAchievementsPending = achievements.length > 0;
const startAnimateClosing = useCallback(() => {
cancelAnimationFrame(closingAnimation.current);
cancelAnimationFrame(visibleAnimation.current);
cancelAnimationFrame(achievementAnimation.current);
setIsClosing(true);
const zero = performance.now();
closingAnimation.current = requestAnimationFrame(
function animateClosing(time) {
if (time - zero <= 1000) {
closingAnimation.current = requestAnimationFrame(animateClosing);
} else {
setIsVisible(false);
}
}
);
}, []);
useEffect(() => {
if (hasAchievementsPending) {
setIsClosing(false);
setIsVisible(true);
let zero = performance.now();
cancelAnimationFrame(closingAnimation.current);
cancelAnimationFrame(visibleAnimation.current);
cancelAnimationFrame(achievementAnimation.current);
achievementAnimation.current = requestAnimationFrame(
function animateLock(time) {
if (time - zero > NOTIFICATION_TIMEOUT) {
zero = performance.now();
setAchievements((ach) => ach.slice(1));
}
achievementAnimation.current = requestAnimationFrame(animateLock);
}
);
} else {
startAnimateClosing();
}
}, [hasAchievementsPending]);
useEffect(() => {
if (achievements.length) {
setCurrentAchievement(achievements[0]);
}
}, [achievements]);
if (!isVisible || !currentAchievement) return null;
return (
<div className={styles.container({ closing: isClosing })}>
<div className={styles.content}>
<img
src={currentAchievement.iconUrl}
alt={currentAchievement.displayName}
style={{ flex: 1, width: "60px" }}
/>
<div>
<p>{t("achievement_unlocked")}</p>
<p>{currentAchievement.displayName}</p>
</div>
</div>
</div>
);
}

View file

@ -83,8 +83,10 @@ export function CloudSyncModal({ visible, onClose }: CloudSyncModalProps) {
};
useEffect(() => {
getGameBackupPreview();
}, [getGameBackupPreview]);
if (visible) {
getGameBackupPreview();
}
}, [getGameBackupPreview, visible]);
const backupStateLabel = useMemo(() => {
if (uploadingBackup) {

View file

@ -11,9 +11,8 @@ import * as styles from "./game-details.css";
import { useTranslation } from "react-i18next";
import { cloudSyncContext, gameDetailsContext } from "@renderer/context";
import { steamUrlBuilder } from "@shared";
import Lottie from "lottie-react";
import cloudAnimation from "@renderer/assets/lottie/cloud.json";
import cloudIconAnimated from "@renderer/assets/icons/cloud-animated.gif";
import { useUserDetails } from "@renderer/hooks";
const HERO_ANIMATION_THRESHOLD = 25;
@ -165,10 +164,9 @@ export function GameDetailsContent() {
position: "relative",
}}
>
<Lottie
animationData={cloudAnimation}
loop={false}
autoplay
<img
src={cloudIconAnimated}
alt="Cloud icon"
style={{ width: 26, position: "absolute", top: -3 }}
/>
</div>

View file

@ -6,9 +6,8 @@ import type { GameRepack, GameShop, Steam250Game } from "@types";
import { Button, ConfirmationModal } from "@renderer/components";
import { buildGameDetailsPath } from "@renderer/helpers";
import starsAnimation from "@renderer/assets/lottie/stars.json";
import starsIconAnimated from "@renderer/assets/icons/stars-animated.gif";
import Lottie from "lottie-react";
import { useTranslation } from "react-i18next";
import { SkeletonTheme } from "react-loading-skeleton";
import { GameDetailsSkeleton } from "./game-details-skeleton";
@ -194,15 +193,15 @@ export default function GameDetails() {
<div
style={{ width: 16, height: 16, position: "relative" }}
>
<Lottie
animationData={starsAnimation}
<img
src={starsIconAnimated}
alt="Stars animation"
style={{
width: 70,
position: "absolute",
top: -28,
left: -27,
}}
loop={false}
/>
</div>
{t("next_suggestion")}

View file

@ -1,4 +1,9 @@
import { GearIcon, PlayIcon, PlusCircleIcon } from "@primer/octicons-react";
import {
DownloadIcon,
GearIcon,
PlayIcon,
PlusCircleIcon,
} from "@primer/octicons-react";
import { Button } from "@renderer/components";
import { useDownload, useLibrary } from "@renderer/hooks";
import { useContext, useState } from "react";
@ -6,7 +11,6 @@ import { useTranslation } from "react-i18next";
import * as styles from "./hero-panel-actions.css";
import { gameDetailsContext } from "@renderer/context";
import { DownloadIcon } from "@renderer/components/sidebar/download-icon";
export function HeroPanelActions() {
const [toggleLibraryGameDisabled, setToggleLibraryGameDisabled] =
@ -125,7 +129,7 @@ export function HeroPanelActions() {
disabled={isGameDownloading || !repacks.length}
className={styles.heroPanelAction}
>
<DownloadIcon isDownloading={false} />
<DownloadIcon />
{t("download")}
</Button>
);

View file

@ -68,3 +68,10 @@ export const buttonsList = style({
padding: "0",
gap: `${SPACING_UNIT}px`,
});
export const flameIcon = style({
width: "30px",
top: "-10px",
left: "-5px",
position: "absolute",
});

View file

@ -1,4 +1,4 @@
import { useCallback, useEffect, useRef, useState } from "react";
import { useCallback, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
@ -7,12 +7,12 @@ import Skeleton, { SkeletonTheme } from "react-loading-skeleton";
import { Button, GameCard, Hero } from "@renderer/components";
import type { Steam250Game, CatalogueEntry } from "@types";
import starsAnimation from "@renderer/assets/lottie/stars.json";
import flameAnimation from "@renderer/assets/lottie/flame.json";
import flameIconStatic from "@renderer/assets/icons/flame-static.png";
import flameIconAnimated from "@renderer/assets/icons/flame-animated.gif";
import starsIconAnimated from "@renderer/assets/icons/stars-animated.gif";
import * as styles from "./home.css";
import { SPACING_UNIT, vars } from "@renderer/theme.css";
import Lottie, { type LottieRefCurrentProps } from "lottie-react";
import { buildGameDetailsPath } from "@renderer/helpers";
import { CatalogueCategory } from "@shared";
@ -20,8 +20,7 @@ export default function Home() {
const { t } = useTranslation("home");
const navigate = useNavigate();
const flameAnimationRef = useRef<LottieRefCurrentProps>(null);
const [animateFlame, setAnimateFlame] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const [randomGame, setRandomGame] = useState<Steam250Game | null>(null);
@ -88,13 +87,13 @@ export default function Home() {
const handleMouseEnterCategory = (category: CatalogueCategory) => {
if (category === CatalogueCategory.Hot) {
flameAnimationRef?.current?.play();
setAnimateFlame(true);
}
};
const handleMouseLeaveCategory = (category: CatalogueCategory) => {
if (category === CatalogueCategory.Hot) {
flameAnimationRef?.current?.stop();
setAnimateFlame(false);
}
};
@ -123,17 +122,17 @@ export default function Home() {
<div
style={{ width: 16, height: 16, position: "relative" }}
>
<Lottie
lottieRef={flameAnimationRef}
animationData={flameAnimation}
loop={false}
autoplay={false}
style={{
width: 30,
top: -10,
left: -5,
position: "absolute",
}}
<img
src={flameIconStatic}
alt="Flame icon"
className={styles.flameIcon}
style={{ display: animateFlame ? "none" : "block" }}
/>
<img
src={flameIconAnimated}
alt="Flame animation"
className={styles.flameIcon}
style={{ display: animateFlame ? "block" : "none" }}
/>
</div>
)}
@ -150,10 +149,10 @@ export default function Home() {
disabled={!randomGame}
>
<div style={{ width: 16, height: 16, position: "relative" }}>
<Lottie
animationData={starsAnimation}
<img
src={starsIconAnimated}
alt="Stars animation"
style={{ width: 70, position: "absolute", top: -28, left: -27 }}
loop={false}
/>
</div>
{t("surprise_me")}
@ -163,10 +162,9 @@ export default function Home() {
<h2 style={{ display: "flex", gap: SPACING_UNIT }}>
{currentCatalogueCategory === CatalogueCategory.Hot && (
<div style={{ width: 24, height: 24, position: "relative" }}>
<Lottie
animationData={flameAnimation}
loop={false}
autoplay
<img
src={flameIconAnimated}
alt="Flame animation"
style={{
width: 40,
top: -10,

View file

@ -254,6 +254,7 @@ export function ProfileHero() {
if (gameRunning)
return {
...gameRunning,
objectId: gameRunning.objectID,
sessionDurationInSeconds: gameRunning.sessionDurationInMillis / 1000,
};
@ -330,7 +331,7 @@ export function ProfileHero() {
<Link
to={buildGameDetailsPath({
...currentGame,
objectId: currentGame.objectID,
objectId: currentGame.objectId,
})}
>
{currentGame.title}

View file

@ -1,75 +0,0 @@
import { useTranslation } from "react-i18next";
import { Button, Modal } from "../../components";
import { SPACING_UNIT } from "../../theme.css";
export interface UserFriendsModalProps {
visible: boolean;
onClose: () => void;
}
export const SubscriptionTourModal = ({
visible,
onClose,
}: UserFriendsModalProps) => {
const { t } = useTranslation("tour");
const handleSubscribeClick = () => {
window.electron.openCheckout().finally(onClose);
};
return (
<Modal
visible={visible}
title={t("subscription_tour_title")}
onClose={onClose}
>
<div
style={{
display: "flex",
flexDirection: "column",
gap: `${SPACING_UNIT * 2}px`,
}}
>
<div
style={{
display: "flex",
flexDirection: "row",
gap: `${SPACING_UNIT * 2}px`,
justifyContent: "space-around",
}}
>
<div
style={{
display: "flex",
flexDirection: "column",
gap: `${SPACING_UNIT * 2}px`,
}}
>
<h2>Hydra Cloud</h2>
<ul style={{ margin: "0", padding: "0" }}>
<li style={{ margin: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px` }}>
{t("cloud_saving")}
</li>
<li style={{ margin: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px` }}>
{t("cloud_achievements")}
</li>
<li style={{ margin: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px` }}>
{t("show_and_compare_achievements")}
</li>
<li style={{ margin: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px` }}>
{t("animated_profile_banner")}
</li>
<li style={{ margin: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px` }}>
{t("animated_profile_picture")}
</li>
<li style={{ margin: `${SPACING_UNIT}px ${SPACING_UNIT * 2}px` }}>
{t("premium_support")}
</li>
</ul>
</div>
</div>
<Button onClick={handleSubscribeClick}>{t("subscribe_now")}</Button>
</div>
</Modal>
);
};

View file

@ -101,6 +101,7 @@ export const UserFriendModalAddFriend = ({
>
{isAddingFriend ? t("sending") : t("add")}
</Button>
<Button
onClick={handleClickSeeProfile}
disabled={isAddingFriend}

View file

@ -0,0 +1,21 @@
$background-color: #1c1c1c;
$dark-background-color: #151515;
$muted-color: #c0c1c7;
$body-color: #8e919b;
$border-color: #424244;
$success-color: #1c9749;
$danger-color: #e11d48;
$warning-color: #ffc107;
$disabled-opacity: 0.5;
$active-opacity: 0.7;
$spacing-unit: 8px;
$toast-z-index: 5;
$bottom-panel-z-index: 3;
$title-bar-z-index: 4;
$backdrop-z-index: 4;
$modal-z-index: 5;

View file

@ -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<string>(
removeSpecialEditionFromName,
replaceUnderscoreWithSpace,
replaceDotsWithSpace,
replaceNbspWithSpace,
(str) => str.replace(/DIRECTOR'S CUT/g, ""),
removeSymbolsFromName,
removeDuplicateSpaces,

1815
yarn.lock

File diff suppressed because it is too large Load diff