24 |
26 | );
27 | }
28 |
--------------------------------------------------------------------------------
/Frontend/src/Components/AiBadge.tsx:
--------------------------------------------------------------------------------
1 | import { HiOutlineSparkles } from 'react-icons/hi';
2 |
3 | type TooltipSide = 'top' | 'right' | 'bottom' | 'left';
4 |
5 | interface AiBadgeProps {
6 | tip?: string;
7 | side?: TooltipSide;
8 | className?: string;
9 | iconClassName?: string;
10 | }
11 |
12 | export default function AiBadge({
13 | tip = 'Powered by Segra AI',
14 | side = 'top',
15 | className = '',
16 | iconClassName = '',
17 | }: AiBadgeProps) {
18 | return (
19 |
24 |
26 | );
27 | }
28 |
--------------------------------------------------------------------------------
/Frontend/src/App.css:
--------------------------------------------------------------------------------
1 | #root {
2 | max-width: 1280px;
3 | margin: 0 auto;
4 | padding: 2rem;
5 | text-align: center;
6 | }
7 |
8 | .logo {
9 | height: 6em;
10 | padding: 1.5em;
11 | will-change: filter;
12 | transition: filter 300ms;
13 | }
14 | .logo:hover {
15 | filter: drop-shadow(0 0 2em #646cffaa);
16 | }
17 | .logo.react:hover {
18 | filter: drop-shadow(0 0 2em #61dafbaa);
19 | }
20 |
21 | @keyframes logo-spin {
22 | from {
23 | transform: rotate(0deg);
24 | }
25 | to {
26 | transform: rotate(360deg);
27 | }
28 | }
29 |
30 | @media (prefers-reduced-motion: no-preference) {
31 | a:nth-of-type(2) .logo {
32 | animation: logo-spin infinite 20s linear;
33 | }
34 | }
35 |
36 | .card {
37 | padding: 2em;
38 | }
39 |
40 | .read-the-docs {
41 | color: #888;
42 | }
43 |
--------------------------------------------------------------------------------
/Frontend/src/Hooks/useUserProfile.ts:
--------------------------------------------------------------------------------
1 | import { useQuery } from '@tanstack/react-query';
2 | import { supabase } from '../lib/supabase/client';
3 | import { useAuth } from './useAuth.tsx';
4 |
5 | export function useProfile() {
6 | const { user } = useAuth();
7 | return useQuery({
8 | queryKey: ['profile', user?.id],
9 | queryFn: async () => {
10 | if (!user) return null;
11 |
12 | const { data: profile, error } = await supabase
13 | .from('profiles')
14 | .select('username, avatar_url')
15 | .eq('id', user.id)
16 | .single();
17 |
18 | if (error) throw error;
19 | return profile;
20 | },
21 | enabled: !!user,
22 | staleTime: 1000 * 60 * 5,
23 | gcTime: 1000 * 60 * 30,
24 | placeholderData: (previousData) => previousData,
25 | });
26 | }
27 |
--------------------------------------------------------------------------------
/Frontend/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "incremental": true,
4 | "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
5 | "target": "ES2020",
6 | "useDefineForClassFields": true,
7 | "lib": ["ES2020", "DOM", "DOM.Iterable"],
8 | "module": "ESNext",
9 | "skipLibCheck": true,
10 |
11 | /* Bundler mode */
12 | "moduleResolution": "bundler",
13 | "allowImportingTsExtensions": true,
14 | "isolatedModules": true,
15 | "moduleDetection": "force",
16 | "noEmit": true,
17 | "jsx": "react-jsx",
18 |
19 | /* Linting */
20 | "strict": true,
21 | "noUnusedLocals": true,
22 | "noUnusedParameters": true,
23 | "noFallthroughCasesInSwitch": true,
24 | "noUncheckedSideEffectImports": true
25 | },
26 | "include": ["src"]
27 | }
28 |
--------------------------------------------------------------------------------
/Frontend/vite.config.ts:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'vite';
2 | import react from '@vitejs/plugin-react';
3 | import { version } from './package.json';
4 | import tailwindcss from '@tailwindcss/vite';
5 |
6 | // https://vite.dev/config/
7 | export default defineConfig({
8 | plugins: [react(), tailwindcss()],
9 | server: {
10 | port: 2882,
11 | },
12 | define: {
13 | __APP_VERSION__: JSON.stringify(version),
14 | },
15 | build: {
16 | // Add cache busting for assets with content hashing
17 | rollupOptions: {
18 | output: {
19 | entryFileNames: 'assets/[name].[hash].js',
20 | chunkFileNames: 'assets/[name].[hash].js',
21 | assetFileNames: 'assets/[name].[hash].[ext]',
22 | },
23 | },
24 | // Ensure no caching issues by generating proper cache headers
25 | manifest: true,
26 | },
27 | });
28 |
--------------------------------------------------------------------------------
/Backend/Core/Models/KeybindSettings.cs:
--------------------------------------------------------------------------------
1 | using System.Text.Json.Serialization;
2 |
3 | namespace Segra.Backend.Core.Models
4 | {
5 | public class Keybind
6 | {
7 | [JsonPropertyName("action")]
8 | [JsonConverter(typeof(JsonStringEnumConverter))]
9 | public KeybindAction Action { get; set; }
10 |
11 | [JsonPropertyName("enabled")]
12 | public bool Enabled { get; set; }
13 |
14 | [JsonPropertyName("keys")]
15 | public List
25 |
38 | );
39 | }
40 |
--------------------------------------------------------------------------------
/Frontend/src/main.tsx:
--------------------------------------------------------------------------------
1 | import { StrictMode } from 'react';
2 | import { createRoot } from 'react-dom/client';
3 | import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
4 | import { supabase } from './lib/supabase/client';
5 | import './globals.css';
6 | import App from './App.tsx';
7 | import { SelectedVideoProvider } from './Context/SelectedVideoContext.tsx';
8 | import { SelectedMenuProvider } from './Context/SelectedMenuContext';
9 | import { AuthProvider } from './Hooks/useAuth.tsx';
10 |
11 | // Create a React Query client
12 | const queryClient = new QueryClient({
13 | defaultOptions: {
14 | queries: {
15 | staleTime: 1000 * 60 * 5, // 5 minutes
16 | gcTime: 1000 * 60 * 30, // 30 minutes
17 | },
18 | },
19 | });
20 |
21 | // Initialize auth listener
22 | supabase.auth.onAuthStateChange((event) => {
23 | if (event === 'SIGNED_OUT') {
24 | queryClient.clear();
25 | }
26 | });
27 |
28 | createRoot(document.getElementById('root')!).render(
29 |
26 |
37 |
27 | {/* Progress */}
28 |
29 |
30 | {/* Upload Details */}
31 |
36 |
32 |
35 | {getStatusText()}
33 | {upload.title}
34 |
24 |
37 |
38 |
25 |
26 |
30 |
36 | {title}
29 |
39 |
41 |
42 | {/* Footer with buttons */}
43 | {description}
40 |
44 |
50 |
56 |
57 |
58 | );
59 | }
60 |
--------------------------------------------------------------------------------
/Frontend/src/Components/GenericModal.tsx:
--------------------------------------------------------------------------------
1 | import { MdInfo, MdWarning, MdError } from 'react-icons/md';
2 |
3 | export interface ModalProps {
4 | title: string;
5 | subtitle?: string;
6 | description: string;
7 | type: 'info' | 'warning' | 'error';
8 | onClose: () => void;
9 | }
10 |
11 | export default function GenericModal({ title, subtitle, description, type, onClose }: ModalProps) {
12 | // Define icon and colors based on type
13 | const getTypeStyles = () => {
14 | switch (type) {
15 | case 'info':
16 | return {
17 | icon:
44 |
56 |
57 |
45 | {icon}
46 |
48 | {subtitle && {title}
47 |{subtitle}
} 49 | 55 |
58 |
60 |
61 | );
62 | }
63 |
--------------------------------------------------------------------------------
/Frontend/src/Pages/settings.tsx:
--------------------------------------------------------------------------------
1 | import { useSettings, useSettingsUpdater } from '../Context/SettingsContext';
2 | import { useUpdate } from '../Context/UpdateContext';
3 | import AccountSection from '../Components/Settings/AccountSection';
4 | import CaptureModeSection from '../Components/Settings/CaptureModeSection';
5 | import VideoSettingsSection from '../Components/Settings/VideoSettingsSection';
6 | import StorageSettingsSection from '../Components/Settings/StorageSettingsSection';
7 | import ClipSettingsSection from '../Components/Settings/ClipSettingsSection';
8 | import AudioDevicesSection from '../Components/Settings/AudioDevicesSection';
9 | import KeybindingsSection from '../Components/Settings/KeybindingsSection';
10 | import GameDetectionSection from '../Components/Settings/GameDetectionSection';
11 | import UISettingsSection from '../Components/Settings/UISettingsSection';
12 |
13 | export default function Settings() {
14 | const { openReleaseNotesModal, checkForUpdates } = useUpdate();
15 | const settings = useSettings();
16 | const updateSettings = useSettingsUpdater();
17 |
18 | return (
19 | {description}
59 |
20 |
45 | );
46 | }
47 |
--------------------------------------------------------------------------------
/Backend/Services/GameIntegrationService.cs:
--------------------------------------------------------------------------------
1 | using Segra.Backend.Core.Models;
2 | using Segra.Backend.Games;
3 | using Segra.Backend.Games.CounterStrike2;
4 | using Segra.Backend.Games.LeagueOfLegends;
5 | using Segra.Backend.Games.Pubg;
6 | using Segra.Backend.Games.RocketLeague;
7 | using Serilog;
8 |
9 | namespace Segra.Backend.Services
10 | {
11 | public static class GameIntegrationService
12 | {
13 | private const string PUBG = "PLAYERUNKNOWN'S BATTLEGROUNDS";
14 | private const string LOL = "League of Legends";
15 | private const string CS2 = "Counter-Strike 2";
16 | private const string ROCKET_LEAGUE = "Rocket League";
17 | private static Integration? _gameIntegration;
18 | public static Integration? GameIntegration => _gameIntegration;
19 |
20 | public static async Task Start(string gameName)
21 | {
22 | if (_gameIntegration != null)
23 | {
24 | Log.Information("Active game integration already exists! Shutting down before starting");
25 | await _gameIntegration.Shutdown();
26 | }
27 |
28 | _gameIntegration = gameName switch
29 | {
30 | PUBG => new PubgIntegration(),
31 | LOL => new LeagueOfLegendsIntegration(),
32 | CS2 => new CounterStrike2Integration(),
33 | ROCKET_LEAGUE => Settings.Instance.EnableRocketLeagueIntegration ? new RocketLeagueIntegration() : null,
34 | _ => null,
35 | };
36 |
37 | if (_gameIntegration == null)
38 | {
39 | return;
40 | }
41 |
42 | Log.Information($"Starting game integration for: {gameName}");
43 | _ = _gameIntegration.Start();
44 | }
45 |
46 | public static async Task Shutdown()
47 | {
48 | if (_gameIntegration == null)
49 | {
50 | return;
51 | }
52 |
53 | Log.Information("Shutting down game integration");
54 | await _gameIntegration.Shutdown();
55 | _gameIntegration = null;
56 | }
57 | }
58 | }
59 |
--------------------------------------------------------------------------------
/Frontend/src/Context/SelectionsContext.tsx:
--------------------------------------------------------------------------------
1 | import { createContext, useContext, useState, ReactNode } from 'react';
2 | import { Selection } from '../Models/types';
3 |
4 | interface SelectionsContextType {
5 | selections: Selection[];
6 | addSelection: (sel: Selection) => void;
7 | updateSelection: (sel: Selection) => void;
8 | updateSelectionsArray: (sel: Selection[]) => void;
9 | removeSelection: (id: number) => void;
10 | clearSelectionsForVideo: (fileName: string) => void;
11 | clearAllSelections: () => void;
12 | }
13 |
14 | const SelectionsContext = createContextSettings
21 | 22 |
52 |
79 | {showText && (
80 |
81 | {Math.round(displayProgress)}%
82 |
83 | )}
84 |
85 | );
86 | }
87 |
--------------------------------------------------------------------------------
/Backend/Games/GameIconUtils.cs:
--------------------------------------------------------------------------------
1 | using System.Drawing.Imaging;
2 | using System.Runtime.InteropServices;
3 | using Serilog;
4 |
5 | namespace Segra.Backend.Games
6 | {
7 | public static class GameIconUtils
8 | {
9 | [DllImport("Shell32.dll", EntryPoint = "ExtractIconExW", CharSet = CharSet.Unicode, ExactSpelling = true, CallingConvention = CallingConvention.StdCall)]
10 | private static extern int ExtractIconEx(string sFile, int iIndex, out IntPtr piLargeVersion, out IntPtr piSmallVersion, int amountIcons);
11 |
12 | public static string? ExtractIconAsBase64(string executablePath)
13 | {
14 | if (string.IsNullOrEmpty(executablePath) || !File.Exists(executablePath))
15 | {
16 | Log.Warning($"Cannot extract icon: File does not exist at path {executablePath}");
17 | return null;
18 | }
19 |
20 | try
21 | {
22 | IntPtr large;
23 | IntPtr small;
24 |
25 | int iconCount = ExtractIconEx(executablePath, 0, out large, out small, 1);
26 |
27 | // Only extract if there is an icon and it's large
28 | if (iconCount > 0 && large != IntPtr.Zero)
29 | {
30 | using (Icon icon = Icon.FromHandle(large))
31 | {
32 | using (Bitmap bitmap = icon.ToBitmap())
33 | {
34 | using (MemoryStream stream = new MemoryStream())
35 | {
36 | bitmap.Save(stream, ImageFormat.Png);
37 | byte[] imageBytes = stream.ToArray();
38 | string base64String = Convert.ToBase64String(imageBytes);
39 | return base64String;
40 | }
41 | }
42 | }
43 | }
44 | else
45 | {
46 | Log.Warning($"No icons found in executable: {executablePath}");
47 | }
48 |
49 | // Free the icon resources
50 | if (large != IntPtr.Zero)
51 | DestroyIcon(large);
52 | if (small != IntPtr.Zero)
53 | DestroyIcon(small);
54 | }
55 | catch (Exception ex)
56 | {
57 | Log.Error($"Error extracting icon from {executablePath}: {ex.Message}");
58 | }
59 |
60 | return null;
61 | }
62 |
63 | [DllImport("User32.dll")]
64 | private static extern bool DestroyIcon(IntPtr hIcon);
65 | }
66 | }
67 |
--------------------------------------------------------------------------------
/Frontend/src/Models/WebSocketMessages.ts:
--------------------------------------------------------------------------------
1 | import { Settings, Game } from './types';
2 |
3 | export interface ModalMessage {
4 | title: string;
5 | subtitle?: string;
6 | description: string;
7 | type: 'info' | 'warning' | 'error';
8 | }
9 |
10 | export interface UploadProgressMessage {
11 | fileName: string;
12 | progress: number;
13 | status: 'uploading' | 'processing' | 'done' | 'error';
14 | message?: string;
15 | }
16 |
17 | export interface ImportProgressMessage {
18 | id: string;
19 | fileName: string;
20 | progress: number;
21 | status: 'importing' | 'done' | 'error';
22 | totalFiles: number;
23 | currentFileIndex: number;
24 | message?: string;
25 | }
26 |
27 | export interface StorageWarningMessage {
28 | warningId: string;
29 | title: string;
30 | description: string;
31 | confirmText: string;
32 | cancelText: string;
33 | action: 'import';
34 | actionData: any;
35 | }
36 |
37 | export interface SettingsMessage {
38 | settings: Settings;
39 | }
40 |
41 | export interface UpdateProgressMessage {
42 | version: string;
43 | progress: number;
44 | status: 'downloading' | 'downloaded' | 'ready' | 'error';
45 | message: string;
46 | }
47 |
48 | export interface ReleaseNote {
49 | version: string;
50 | base64Markdown: string;
51 | releaseDate: string;
52 | }
53 |
54 | export interface ReleaseNotesMessage {
55 | releaseNotesList: ReleaseNote[];
56 | }
57 |
58 | export interface SelectedGameExecutableMessage {
59 | game: Game;
60 | }
61 |
62 | export interface WebSocketMessage
26 |
32 |
69 | );
70 | }
71 |
--------------------------------------------------------------------------------
/.gitattributes:
--------------------------------------------------------------------------------
1 | ###############################################################################
2 | # Set default behavior to automatically normalize line endings.
3 | ###############################################################################
4 | * text=auto
5 | ###############################################################################
6 | # Set default behavior for command prompt diff.
7 | #
8 | # This is need for earlier builds of msysgit that does not have it on by
9 | # default for csharp files.
10 | # Note: This is only used by command line
11 | ###############################################################################
12 | #*.cs diff=csharp
13 | ###############################################################################
14 | # Set the merge driver for project and solution files
15 | #
16 | # Merging from the command prompt will add diff markers to the files if there
17 | # are conflicts (Merging from VS is not affected by the settings below, in VS
18 | # the diff markers are never inserted). Diff markers may cause the following
19 | # file extensions to fail to load in VS. An alternative would be to treat
20 | # these files as binary and thus will always conflict and require user
21 | # intervention with every merge. To do so, just uncomment the entries below
22 | ###############################################################################
23 | #*.sln merge=binary
24 | #*.csproj merge=binary
25 | #*.vbproj merge=binary
26 | #*.vcxproj merge=binary
27 | #*.vcproj merge=binary
28 | #*.dbproj merge=binary
29 | #*.fsproj merge=binary
30 | #*.lsproj merge=binary
31 | #*.wixproj merge=binary
32 | #*.modelproj merge=binary
33 | #*.sqlproj merge=binary
34 | #*.wwaproj merge=binary
35 | ###############################################################################
36 | # behavior for image files
37 | #
38 | # image files are treated as binary by default.
39 | ###############################################################################
40 | #*.jpg binary
41 | #*.png binary
42 | #*.gif binary
43 | ###############################################################################
44 | # diff behavior for common document formats
45 | #
46 | # Convert binary document formats to text before diffing them. This feature
47 | # is only available from the command line. Turn it on by uncommenting the
48 | # entries below.
49 | ###############################################################################
50 | #*.doc diff=astextplain
51 | #*.DOC diff=astextplain
52 | #*.docx diff=astextplain
53 | #*.DOCX diff=astextplain
54 | #*.dot diff=astextplain
55 | #*.DOT diff=astextplain
56 | #*.pdf diff=astextplain
57 | #*.PDF diff=astextplain
58 | #*.rtf diff=astextplain
59 | #*.RTF diff=astextplain
60 | obs.zip filter=lfs diff=lfs merge=lfs -text
61 | Obs/*.zip filter=lfs diff=lfs merge=lfs -text
62 |
--------------------------------------------------------------------------------
/Frontend/src/Components/SelectionCard.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { SelectionCardProps } from '../Models/types';
3 | import { useDrag, useDrop } from 'react-dnd';
4 |
5 | const DRAG_TYPE = 'SELECTION_CARD';
6 |
7 | const SelectionCard: React.FC
33 |
68 |
36 | {isAllowed ? 'ALLOWED' : isBlocked ? 'BLOCKED' : '\u00A0'}
37 |
38 | {game.name}
39 | {(() => {
40 | const paths = allPaths || game.paths || [];
41 | if (paths.length === 0) return null;
42 |
43 | const truncatePath = (path: string) => {
44 | const parts = path.replace(/\\/g, '/').split('/');
45 | return parts.slice(-2).join('\\');
46 | };
47 |
48 | const displayPaths = paths.map(truncatePath).join(', ');
49 | return {displayPaths}
;
50 | })()}
51 |
52 |
59 |
66 |
67 | setHoveredSelectionId(selection.id)}
53 | onMouseLeave={() => setHoveredSelectionId(null)}
54 | onContextMenu={(e) => {
55 | e.preventDefault();
56 | removeSelection(selection.id);
57 | }}
58 | >
59 | {isLoading ? (
60 |
68 | 
69 |
73 | ) : (
74 |
79 | );
80 | };
81 |
82 | export { DRAG_TYPE };
83 | export default SelectionCard;
84 |
--------------------------------------------------------------------------------
/Backend/App/StartupService.cs:
--------------------------------------------------------------------------------
1 | using System.Reflection;
2 | using Serilog;
3 |
4 | namespace Segra.Backend.App
5 | {
6 | internal static class StartupService
7 | {
8 | public static void SetStartupStatus(bool enable)
9 | {
10 | try
11 | {
12 | string exePath = Path.ChangeExtension(Assembly.GetExecutingAssembly().Location, ".exe");
13 | if (exePath == null)
14 | {
15 | Log.Error("Failed to get executable path");
16 | return;
17 | }
18 | string startupFolder = Environment.GetFolderPath(Environment.SpecialFolder.Startup);
19 | string linkPath = Path.Combine(startupFolder, "Segra.lnk");
20 | if (enable && !File.Exists(linkPath))
21 | {
22 | Type shellType = Type.GetTypeFromProgID("WScript.Shell")!;
23 | object shell = Activator.CreateInstance(shellType)!;
24 | object shortcut = shellType.InvokeMember("CreateShortcut", BindingFlags.InvokeMethod, null, shell, new object[] { linkPath })!;
25 | shortcut.GetType().InvokeMember("TargetPath", BindingFlags.SetProperty, null, shortcut, new object[] { exePath });
26 | shortcut.GetType().InvokeMember("Arguments", BindingFlags.SetProperty, null, shortcut, new object[] { "--from-startup" });
27 | string? workingDir = Path.GetDirectoryName(exePath);
28 | if (workingDir == null)
29 | {
30 | Log.Error("Failed to get working directory");
31 | return;
32 | }
33 | shortcut.GetType().InvokeMember("WorkingDirectory", BindingFlags.SetProperty, null, shortcut, new object[] { workingDir });
34 | shortcut.GetType().InvokeMember("Save", BindingFlags.InvokeMethod, null, shortcut, null);
35 | Log.Information("Added Segra to startup");
36 | }
37 | else if (!enable && File.Exists(linkPath))
38 | {
39 | File.Delete(linkPath);
40 | Log.Information("Removed Segra from startup");
41 | }
42 | }
43 | catch (Exception ex)
44 | {
45 | Log.Error(ex.Message);
46 | }
47 | }
48 |
49 | public static bool GetStartupStatus()
50 | {
51 | try
52 | {
53 | string linkPath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.Startup), "Segra.lnk");
54 | return File.Exists(linkPath);
55 | }
56 | catch (Exception ex)
57 | {
58 | Log.Error(ex.Message);
59 | return false;
60 | }
61 | }
62 | }
63 | }
64 |
--------------------------------------------------------------------------------
/Frontend/src/Context/ModalContext.tsx:
--------------------------------------------------------------------------------
1 | import React, { createContext, useContext, useRef, useState, ReactNode } from 'react';
2 |
3 | interface ModalContextType {
4 | openModal: (content: ReactNode) => void;
5 | closeModal: () => void;
6 | }
7 |
8 | const ModalContext = createContext
61 |
62 |
66 | ) : thumbnailDataUrl ? (
67 |
63 | {formatTime(startTime)} - {formatTime(endTime)}
64 |
65 |
70 | {formatTime(startTime)} - {formatTime(endTime)}
71 |
72 |
75 | No thumbnail
76 |
77 | )}
78 |
34 |
70 | );
71 | }
72 |
--------------------------------------------------------------------------------
/Backend/Services/AiService.cs:
--------------------------------------------------------------------------------
1 | using Serilog;
2 | using Segra.Backend.Core.Models;
3 | using Segra.Backend.Media;
4 | using Segra.Backend.App;
5 |
6 | namespace Segra.Backend.Services
7 | {
8 | internal class AiService
9 | {
10 | public static async Task CreateHighlight(string fileName)
11 | {
12 | string highlightId = Guid.NewGuid().ToString();
13 | Content? content = null;
14 |
15 | try
16 | {
17 | Log.Information($"Starting highlight creation for: {fileName}");
18 |
19 | content = Settings.Instance.State.Content.FirstOrDefault(x => x.FileName == fileName);
20 | if (content == null)
21 | {
22 | Log.Warning($"No content found matching fileName: {fileName}");
23 | return;
24 | }
25 |
26 | int momentCount = content.Bookmarks.Count(b => b.Type.IncludeInHighlight());
27 | if (momentCount == 0)
28 | {
29 | Log.Information($"No highlight bookmarks found for: {fileName}");
30 | await SendProgress(highlightId, -1, "error", "No highlight moments found in this session", content);
31 | return;
32 | }
33 |
34 | await SendProgress(highlightId, 0, "processing", $"Found {momentCount} moments", content);
35 |
36 | await HighlightService.CreateHighlightFromBookmarks(fileName, async (progress, message) =>
37 | {
38 | string status = progress < 0 ? "error" : progress >= 100 ? "done" : "processing";
39 | await SendProgress(highlightId, progress, status, message, content);
40 | });
41 | }
42 | catch (Exception ex)
43 | {
44 | Log.Error(ex, $"Error creating highlight for {fileName}");
45 | if (content != null)
46 | {
47 | await SendProgress(highlightId, -1, "error", $"Error: {ex.Message}", content);
48 | }
49 | }
50 | }
51 |
52 | private static async Task SendProgress(string id, int progress, string status, string message, Content content)
53 | {
54 | var progressMessage = new HighlightProgressMessage
55 | {
56 | Id = id,
57 | Progress = progress,
58 | Status = status,
59 | Message = message,
60 | Content = content
61 | };
62 |
63 | await MessageService.SendFrontendMessage("AiProgress", progressMessage);
64 | }
65 | }
66 |
67 | public class HighlightProgressMessage
68 | {
69 | public required string Id { get; set; }
70 | public required int Progress { get; set; }
71 | public required string Status { get; set; }
72 | public required string Message { get; set; }
73 | public required Content Content { get; set; }
74 | }
75 | }
76 |
--------------------------------------------------------------------------------
/Frontend/src/Components/ClippingCard.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from 'react';
2 | import { useClipping } from '../Hooks/useClipping';
3 | import { MdClose } from 'react-icons/md';
4 | import CircularProgress from './CircularProgress';
5 |
6 | import { ClippingProgress } from '../Context/ClippingContext';
7 |
8 | interface ClippingCardProps {
9 | clipping: ClippingProgress;
10 | }
11 |
12 | const ClippingCard: React.FC
35 | {/* Header with status and version */}
36 |
69 |
37 |
49 |
50 | {/* Action Buttons */}
51 |
38 |
48 |
39 | {getStatusIcon()}
40 |
41 |
42 |
47 | 43 | {updateInfo.status === 'downloading' ? 'Update in Progress' : 'Update Available'} 44 |
45 |Version {updateInfo.version}
46 |
52 |
60 |
67 |
68 |
43 |
80 | );
81 | };
82 |
83 | export default ClippingCard;
84 |
--------------------------------------------------------------------------------
/CONTRIBUTING.md:
--------------------------------------------------------------------------------
1 | # Contributing to Segra
2 |
3 | A quick, practical guide to get you developing on both the backend (C#/.NET) and the frontend (React/Vite).
4 |
5 | ## Requirements
6 | - Windows 10 (build 17763 / 1809) or newer
7 | - .NET SDK 9.0.x (Windows targeting)
8 | - Git
9 | - Bun v1.1+ (for frontend tooling and git hooks)
10 | - Node.js 18+ (only if you want the backend to auto-start the frontend dev server via `npm run dev`)
11 | - IDEs (pick what you like):
12 | - Visual Studio 2022 (17.12+) or VS Code + C# Dev Kit
13 |
14 | ## Repo Layout
15 | - `Segra.sln` — solution root
16 | - `Backend/` — app services, models, utils
17 | - `Frontend/` — React + Vite app (TypeScript, Tailwind, DaisyUI)
18 | - `libobs-sharp/` — vendored OBS interop
19 |
20 | ## First-Time Setup
21 | 1. Clone the repo
22 | - `git clone
46 |
79 |
47 | {/* Progress */}
48 | {isError ? (
49 |
50 | ) : clipping.progress < 100 ? (
51 |
78 |
58 | {clipping.progress >= 0 && clipping.progress < 100 && (
59 |
67 | )}
68 |
77 |
71 | {isError ? 'Clip Failed' : 'Creating Clip'}
72 |
73 |
74 | {isError ? clipping.error || 'Unknown error' : `${Math.round(displayProgress)}%`}
75 |
76 |
27 |
79 | );
80 | }
81 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
28 |
78 |
29 | {/* Progress Spinner */}
30 | {importItem.status === 'importing' && (
31 |
32 | )}
33 | {importItem.status === 'done' && (
34 |
77 |
35 |
42 |
43 | )}
44 | {importItem.status === 'error' && (
45 |
46 |
53 |
54 | )}
55 |
56 | {/* Import Details */}
57 |
58 |
76 | {getStatusText()}
59 | {importItem.fileName}
60 | {/* Progress Bar */}
61 |
62 |
72 |
73 | {/* Progress Percentage */}
74 | {getProgressPercentage().toFixed(0)}%
75 | 
2 |
3 | **Segra** is a powerful recording software built on Open Broadcaster Software (OBS), designed for gamers and content creators. Record, clip, and upload gameplay highlights effortlessly, with smart automation and deep game integration.
4 |
5 | ### ✂️ Clip Editor
6 |
7 | 
8 |
9 | ### 🔥 Highlights
10 |
11 | 
12 |
13 |
14 | ### ⚙️ Settings
15 |
16 | 
17 |
18 |
19 | ---
20 |
21 | ## ✨ Features
22 | - **Auto-Start Recording**: Begin recording automatically when your game launches.
23 | - **Instant Clipping**: Save key moments with a hotkey.
24 | - **Direct Upload**: Share clips to **[Segra.tv](https://segra.tv)** instantly.
25 | - **Game Integration**: Tracks in-game stats (kills, deaths, assists) to auto-generate highlights, powered by AI.
26 | - **Lightweight & Fast**: Built on OBS for 4K with 144 FPS capture with minimal performance impact.
27 | - **Customizable Settings**: Adjust recording quality (NVENC/AMD VCE), hotkeys, storage paths, etc.
28 |
29 | ---
30 |
31 | ## Why "Segra"?
32 | **Segra** (pronounced *"say-grah"*) means **"to win"** in Swedish. We built Segra to help you **preserve those moments**: the chaotic fun with friends, the clutch plays, and the wins (*segra!*) that deserve their own highlight reel.
33 |
34 | ---
35 |
36 | ## 🛠 Installation
37 | 1. **Download**: Get `Segra-win-Setup.exe` from [[latest release](https://github.com/Segergren/Segra/releases/latest)].
38 | 2. **Install**: Run the setup.
39 | 3. **Configure**:
40 | - Set recording directory and video quality.
41 | - Assign hotkeys for clipping/uploading.
42 | - Connect your Segra.tv account.
43 |
44 | ## 🔄 Uninstallation
45 | 1. Open `Windows Settings`
46 | 2. Go to `Apps` -> `Installed apps`
47 | 3. Search for `Segra`
48 | 4. Click `Uninstall`
49 |
50 | ## 🤝 Contributing
51 | See [CONTRIBUTING.md](CONTRIBUTING.md) for setup, dependencies, and dev workflow.
52 | Help improve Segra by:
53 | - Report bugs or suggest features
54 | - Submit pull requests
55 |
56 | ---
57 |
58 | ## 📜 License
59 | Segra is **GPLv2 licensed**.
60 |
61 | ---
62 |
63 | ## 🔐 Code Signing Policy
64 | Free code signing provided by **[SignPath.io](https://signpath.io)**, certificate by **[SignPath Foundation](https://signpath.org)**.
65 |
66 | **Team roles**
67 |
68 | | Role | Person |
69 | |-----------|--------|
70 | | Authors | @Segergren |
71 | | Reviewers | @Segergren |
72 | | Approvers | @Segergren |
73 |
74 | See our [Privacy Policy](https://segra.tv/privacy).
75 |
76 | ## Star History
77 |
78 |
79 |
29 |
88 | );
89 | };
90 |
91 | export default GameListManager;
92 |
--------------------------------------------------------------------------------
/Frontend/src/globals.css:
--------------------------------------------------------------------------------
1 | @import 'tailwindcss';
2 | @plugin "daisyui" {
3 | themes: false;
4 | }
5 |
6 | @plugin "daisyui/theme" {
7 | name: 'segra';
8 | default: true;
9 | color-scheme: dark;
10 | /* Dina färger (oförändrade) */
11 | --color-primary: #fecb00;
12 | --color-secondary: #171f2a;
13 | --color-accent: #fecb00;
14 | --color-neutral: #142638;
15 | --color-base-100: #132733;
16 | --color-base-200: #15232f;
17 | --color-base-300: #171f2a;
18 | --color-base-content: #ffffff;
19 | --color-info: #005293;
20 | --color-success: #36d399;
21 | --color-warning: #ffd481;
22 | --color-error: #f87272;
23 | --color-primary-content: var(--color-base-100);
24 | --card-p: 1rem;
25 | /* DaisyUI v5 tokens – matcha v4-defaults */
26 | --radius-box: 1rem; /* v4: --rounded-box: 1rem */
27 | --radius-field: 0.5rem; /* v4: --rounded-btn: 0.5rem */
28 | --radius-selector: 0.45rem; /* v4: --rounded-badge: 1.9rem */
29 | /* Storleksskala (px, skriv som siffra utan enhet) – rimlig v4-känsla */
30 | --size-selector: 0.25rem;
31 | --size-field: 0.3rem;
32 | /* Kantlinje & effekter */
33 | --border: 1px; /* v4 hade 1px på knappar/flikar */
34 | --depth: 0; /* v4 hade inget djup */
35 | --noise: 0; /* v4 hade ingen noise */
36 | }
37 |
38 | @layer components {
39 | .checkbox {
40 | color: var(--color-base-300) !important;
41 | }
42 | .tooltip[data-tip]::before {
43 | color: var(--color-base-300) !important;
44 | }
45 | .btn:is(:disabled, [disabled], .btn-disabled):not(.btn-link, .btn-ghost) {
46 | background-color: var(--btn-bg) !important;
47 | box-shadow: var(--btn-shadow) !important;
48 | }
49 | @media (hover: hover) {
50 | .btn:is(:disabled, [disabled], .btn-disabled):hover {
51 | background-color: var(--btn-bg) !important;
52 | }
53 | }
54 | }
55 |
56 | @theme {
57 | --color-base-400: #49515b;
58 | --color-custom: #2e3640;
59 | --color-primary-yellow: #fecb00;
60 | }
61 |
62 | :root {
63 | --foreground-rgb: 0, 0, 0;
64 | --background-start-rgb: 214, 219, 220;
65 | --background-end-rgb: 255, 255, 255;
66 | }
67 |
68 | @media (prefers-color-scheme: dark) {
69 | :root {
70 | --foreground-rgb: 255, 255, 255;
71 | --background-start-rgb: 0, 0, 0;
72 | --background-end-rgb: 0, 0, 0;
73 | }
74 | }
75 |
76 | @layer utilities {
77 | .text-balance {
78 | text-wrap: balance;
79 | }
80 | }
81 |
82 | /* Highlight card gradient border animation */
83 | @keyframes highlightBorderAnimation {
84 | 0% {
85 | background-position: 0% 50%;
86 | }
87 | 50% {
88 | background-position: 200% 50%;
89 | }
90 | 100% {
91 | background-position: 0% 50%;
92 | }
93 | }
94 |
95 | .highlight-card {
96 | overflow: hidden;
97 | }
98 |
99 | .highlight-border {
100 | background: linear-gradient(-450deg, #7928ca, #ff0080, #1c64f2, #00d4ff, #7928ca);
101 | background-size: 300% 300%;
102 | animation: highlightBorderAnimation 8s ease infinite;
103 | z-index: 1;
104 | }
105 |
106 | /* Shockwave animation for bookmark creation */
107 | @keyframes shockwave {
108 | 0% {
109 | width: 0;
110 | height: 0;
111 | opacity: 0.6;
112 | }
113 | 100% {
114 | width: 400px;
115 | height: 400px;
116 | opacity: 0;
117 | }
118 | }
119 |
120 | .animate-shockwave {
121 | animation: shockwave 0.6s ease-out forwards;
122 | }
123 |
124 | /* Remove all focus rings globally */
125 | *,
126 | *:focus,
127 | *:focus-visible,
128 | *:focus-within,
129 | dialog,
130 | dialog:focus,
131 | .modal,
132 | .modal-box {
133 | outline: none !important;
134 | outline-width: 0 !important;
135 | outline-style: none !important;
136 | outline-color: transparent !important;
137 | outline-offset: 0 !important;
138 | --tw-ring-offset-width: 0px !important;
139 | --tw-ring-width: 0px !important;
140 | --tw-ring-color: transparent !important;
141 | --tw-ring-offset-color: transparent !important;
142 | box-shadow: none !important;
143 | }
144 |
--------------------------------------------------------------------------------
/Properties/Resources.Designer.cs:
--------------------------------------------------------------------------------
1 | //------------------------------------------------------------------------------
2 | //
30 |
33 |
34 | {listTitle}
31 |{listDescription}
32 |
35 |
87 |
36 |
37 |
38 |
85 |
86 | | Game | 40 |Executable Path | 41 |42 | |
|---|---|---|
| 51 | No games in {emptyListLabel} 52 | | 53 |||
| {game.name} | 58 |
59 | {game.paths && game.paths.length > 1 ? (
60 |
61 |
68 | ) : (
69 | {game.paths.length} executables
62 | {game.paths.map((path, idx) => (
63 |
64 | • {path}
65 |
66 | ))}
67 | {game.paths?.[0] || ''}
70 | )}
71 | |
72 | 73 | 79 | | 80 |
13 |
79 | );
80 | }
81 |
--------------------------------------------------------------------------------
/Frontend/src/Context/ClippingContext.tsx:
--------------------------------------------------------------------------------
1 | import { createContext, useContext, useState, useEffect, useRef, type ReactNode } from 'react';
2 | import { sendMessageToBackend } from '../Utils/MessageUtils';
3 | import { useSelections } from './SelectionsContext';
4 | import { useSettings } from './SettingsContext';
5 | import { Selection } from '../Models/types';
6 |
7 | export interface ClippingProgress {
8 | id: number;
9 | progress: number;
10 | selections: Selection[];
11 | error?: string;
12 | }
13 |
14 | export interface ClippingContextType {
15 | clippingProgress: RecordCapture Mode
14 |
15 |
36 | !isRecording && updateSettings({ recordingMode: 'Hybrid' })}
18 | >
19 |
35 |
20 |
22 | Hybrid (Session + Buffer)
21 |
23 |
34 | 24 | Record the full session while keeping a replay buffer. Save short highlights with a 25 | hotkey without stopping the session. 26 |
27 |
28 | • Clip without ending the session recording
29 |
• Full game integration features 30 |
• Access to AI-generated highlights 31 |
• Access to Bookmarks 32 |
33 | • Full game integration features 30 |
• Access to AI-generated highlights 31 |
• Access to Bookmarks 32 |
37 |
78 | !isRecording && updateSettings({ recordingMode: 'Session' })}
40 | >
41 |
57 | Session Recording
42 |
43 |
56 | 44 | Records your entire gaming session from start to finish. Ideal for content creators 45 | who want complete gameplay recordings. 46 |
47 |
48 | • Uses more storage space
49 |
50 | • Full game integration features 51 |
52 | • Access to AI-generated highlights 53 |
• Access to Bookmarks 54 |
55 | 50 | • Full game integration features 51 |
52 | • Access to AI-generated highlights 53 |
• Access to Bookmarks 54 |
!isRecording && updateSettings({ recordingMode: 'Buffer' })}
60 | >
61 |
77 |
62 |
64 | Replay Buffer
63 |
65 |
76 | 66 | Continuously records in the background. Save only your best moments with a hotkey 67 | press. 68 |
69 |
70 | • Efficient storage usage
71 |
72 | • No game integration 73 |
• No bookmarks 74 |
75 | 72 | • No game integration 73 |
• No bookmarks 74 |
57 |
114 |
115 | );
116 | }
117 |
--------------------------------------------------------------------------------
/Frontend/src/App.tsx:
--------------------------------------------------------------------------------
1 | import { useEffect, useState, createContext } from 'react';
2 | import Settings from './Pages/settings';
3 | import Menu from './menu';
4 | import Sessions from './Pages/sessions';
5 | import Clips from './Pages/clips';
6 | import ReplayBuffer from './Pages/replay-buffer';
7 | import Highlights from './Pages/highlights';
8 | import { SettingsProvider } from './Context/SettingsContext';
9 | import Video from './Pages/video';
10 | import { useSelectedVideo } from './Context/SelectedVideoContext';
11 | import { useSelectedMenu } from './Context/SelectedMenuContext';
12 | import { themeChange } from 'theme-change';
13 | import { HTML5Backend } from 'react-dnd-html5-backend';
14 | import { DndProvider } from 'react-dnd';
15 | import { SelectionsProvider } from './Context/SelectionsContext';
16 | import { UploadProvider } from './Context/UploadContext';
17 | import { ImportProvider } from './Context/ImportContext';
18 | import { WebSocketProvider } from './Context/WebSocketContext';
19 | import { ClippingProvider } from './Context/ClippingContext';
20 | import { AiHighlightsProvider } from './Context/AiHighlightsContext';
21 | import { CompressionProvider } from './Context/CompressionContext';
22 | import { UpdateProvider } from './Context/UpdateContext';
23 | import { ReleaseNote } from './Models/WebSocketMessages';
24 | import { ScrollProvider } from './Context/ScrollContext';
25 | import { ModalProvider } from './Context/ModalContext';
26 |
27 | // Create a context for release notes that can be accessed globally
28 | export const ReleaseNotesContext = createContext<{
29 | releaseNotes: ReleaseNote[];
30 | setReleaseNotes: (notes: ReleaseNote[]) => void;
31 | }>({
32 | releaseNotes: [],
33 | setReleaseNotes: () => {},
34 | });
35 |
36 | function App() {
37 | useEffect(() => {
38 | themeChange(false);
39 | }, []);
40 |
41 | const { selectedVideo, setSelectedVideo } = useSelectedVideo();
42 | const { selectedMenu, setSelectedMenu } = useSelectedMenu();
43 |
44 | const handleMenuSelection = (menu: any) => {
45 | setSelectedVideo(null);
46 | setSelectedMenu(menu);
47 | };
48 |
49 | const renderContent = () => {
50 | if (selectedVideo) {
51 | return (
52 |
58 |
64 |
65 |
66 |
98 |
67 |
75 |
76 |
69 |
74 | Rename
70 |71 | Enter a new title for this {content.type.toLowerCase()} 72 |
73 |
77 | {
82 | setNewName(e.target.value);
83 | setNameError(false);
84 | }}
85 | onKeyDown={handleKeyPress}
86 | className={`input input-bordered bg-base-300 w-full ${nameError ? 'input-error' : ''}`}
87 | placeholder={displayedTitle}
88 | />
89 | {nameError && (
90 |
95 | )}
96 |
97 |
99 |
105 |
112 |
113 |
76 |
81 | );
82 | }
83 |
84 | export default function AppWrapper() {
85 | const [releaseNotes, setReleaseNotes] = useState
77 |
78 |
79 | {renderContent()}
80 |
62 |
108 | );
109 | }
110 |
--------------------------------------------------------------------------------
/Frontend/src/Context/WebSocketContext.tsx:
--------------------------------------------------------------------------------
1 | import { createContext, useContext, ReactNode, useCallback, useEffect, useRef } from 'react';
2 | import useWebSocket, { ReadyState } from 'react-use-websocket';
3 | import { sendMessageToBackend } from '../Utils/MessageUtils';
4 | import { useAuth } from '../Hooks/useAuth.tsx';
5 |
6 | interface WebSocketContextType {
7 | sendMessage: (message: string) => void;
8 | isConnected: boolean;
9 | connectionState: ReadyState;
10 | }
11 |
12 | const WebSocketContext = createContextStorage Settings
63 |
64 | {/* Recording Path */}
65 |
107 |
66 |
69 |
88 |
89 | {/* Storage Limit */}
90 |
70 |
87 |
71 | updateSettings({ contentFolder: e.target.value })}
76 | placeholder="Enter or select folder path"
77 | className="input input-bordered flex-1 bg-base-200 join-item"
78 | />
79 |
85 |
86 |
91 |
94 |
95 | setLocalStorageLimit(e.target.value)}
100 | onBlur={handleStorageLimitBlur}
101 | placeholder="Set maximum storage in GB"
102 | min="1"
103 | className="input input-bordered bg-base-200 w-full block outline-none focus:border-base-400"
104 | />
105 |
106 |
59 |
123 |
124 | );
125 | }
126 |
--------------------------------------------------------------------------------
/Segra.csproj:
--------------------------------------------------------------------------------
1 |
60 |
66 |
67 |
68 |
112 |
69 |
76 |
77 |
78 |
79 |
82 | {
87 | setTitle(e.target.value);
88 | setTitleError(false);
89 | }}
90 | onKeyDown={handleKeyPress}
91 | className={`input input-bordered bg-base-300 w-full focus:outline-none ${titleError ? 'input-error' : ''}`}
92 | />
93 | {titleError && (
94 |
97 | )}
98 |
99 |
100 |
101 |
110 |
111 |
113 |
121 |
122 |
63 |
131 |
132 | );
133 | }
134 |
--------------------------------------------------------------------------------
/Frontend/src/Components/Settings/KeybindingsSection.tsx:
--------------------------------------------------------------------------------
1 | import { useState, useEffect } from 'react';
2 | import { Settings as SettingsType, KeybindAction } from '../../Models/types';
3 | interface KeybindingsSectionProps {
4 | settings: SettingsType;
5 | updateSettings: (updates: Partial
64 |
70 |
71 |
72 |
120 | Add Custom Game
73 | 74 |
75 |
78 | setCustomGameName(e.target.value)}
84 | />
85 |
86 |
87 |
88 |
91 |
99 |
100 | {customGamePaths.length > 0 && (
101 |
119 |
102 | {customGamePaths.map((path, idx) => (
103 |
117 | )}
118 |
107 | {path}
108 |
114 |
115 | ))}
116 |
121 |
129 |
130 |
114 |
153 | );
154 | }
155 |
--------------------------------------------------------------------------------
/Frontend/src/Hooks/useAuth.tsx:
--------------------------------------------------------------------------------
1 | import { useState, useEffect, createContext, useContext, ReactNode } from 'react';
2 | import { Session, User } from '@supabase/supabase-js';
3 | import { supabase } from '../lib/supabase/client';
4 | import { sendMessageToBackend } from '../Utils/MessageUtils';
5 |
6 | // Create a context to store authentication state
7 | interface AuthContextType {
8 | user: User | null;
9 | session: Session | null;
10 | authError: string | null;
11 | isAuthenticating: boolean;
12 | clearAuthError: () => void;
13 | signOut: () => PromiseKeybindings
115 |
116 | {settings.keybindings.map((keybind, index) => (
117 |
152 |
121 |
137 |
138 |
149 |
150 | ))}
151 |
97 | {/* Trigger */}
98 |
127 |
128 | {/* Menu (DaisyUI v5 structure) */}
129 |
156 | );
157 | }
158 |
--------------------------------------------------------------------------------
/Backend/Services/PresetsService.cs:
--------------------------------------------------------------------------------
1 | using Segra.Backend.App;
2 | using Segra.Backend.Core.Models;
3 | using Segra.Backend.Windows.Display;
4 | using Serilog;
5 |
6 | namespace Segra.Backend.Services
7 | {
8 | public static class PresetsService
9 | {
10 | /// -
134 | {items.map((item) => {
135 | const isActive = item.value === value;
136 | return (
137 |
- 138 | 151 | 152 | ); 153 | })} 154 |