mirror of
https://github.com/luminous-devs/lume.git
synced 2024-10-02 09:50:47 +00:00
wip
This commit is contained in:
parent
cef6b9aca9
commit
1240353e30
@ -4,8 +4,8 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Lume</title>
|
||||
</head>
|
||||
<body class="relative cursor-default select-none overflow-hidden font-sans antialiased h-screen w-screen text-white">
|
||||
<body class="relative cursor-default bg-black select-none overflow-hidden font-sans antialiased h-screen w-screen text-white">
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
<script type="module" src="/src/main.jsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -19,6 +19,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@dnd-kit/core": "^6.0.8",
|
||||
"@fontsource-variable/inter": "^5.0.12",
|
||||
"@getalby/sdk": "^2.4.0",
|
||||
"@nostr-dev-kit/ndk": "^1.3.1",
|
||||
"@nostr-dev-kit/ndk-cache-dexie": "^1.3.0",
|
||||
|
@ -8,6 +8,9 @@ dependencies:
|
||||
'@dnd-kit/core':
|
||||
specifier: ^6.0.8
|
||||
version: 6.0.8(react-dom@18.2.0)(react@18.2.0)
|
||||
'@fontsource-variable/inter':
|
||||
specifier: ^5.0.12
|
||||
version: 5.0.12
|
||||
'@getalby/sdk':
|
||||
specifier: ^2.4.0
|
||||
version: 2.4.0
|
||||
@ -675,6 +678,10 @@ packages:
|
||||
resolution: {integrity: sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A==}
|
||||
dev: false
|
||||
|
||||
/@fontsource-variable/inter@5.0.12:
|
||||
resolution: {integrity: sha512-BuYkYLsvqLnWlXeyUvo6HpcAAgiOpIeQeVXWuxTNrJWr3NpuY5mWzizCxHnHD2gWLZOSOx0GkBqhQl7Oh6zTUQ==}
|
||||
dev: false
|
||||
|
||||
/@getalby/sdk@2.4.0:
|
||||
resolution: {integrity: sha512-aIGNwLRF9coj6koxfq7P4GtFZbFjQbnIheix39x9176PwFw4dXOdGXHPXnqioJTmeq80y+vX1yd+u/f03YGoeg==}
|
||||
engines: {node: '>=14'}
|
||||
|
12
src-tauri/Cargo.lock
generated
12
src-tauri/Cargo.lock
generated
@ -2626,6 +2626,7 @@ dependencies = [
|
||||
"tauri-plugin-stronghold",
|
||||
"tauri-plugin-upload",
|
||||
"webpage",
|
||||
"window-shadows",
|
||||
"window-vibrancy",
|
||||
]
|
||||
|
||||
@ -5949,6 +5950,17 @@ version = "0.4.0"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f"
|
||||
|
||||
[[package]]
|
||||
name = "window-shadows"
|
||||
version = "0.2.1"
|
||||
source = "git+https://github.com/tauri-apps/window-shadows?branch=dev#a9f5f1f7725609c71404539befca1f1a98095cd2"
|
||||
dependencies = [
|
||||
"cocoa 0.25.0",
|
||||
"objc",
|
||||
"raw-window-handle",
|
||||
"windows-sys 0.48.0",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "window-vibrancy"
|
||||
version = "0.4.1"
|
||||
|
@ -49,6 +49,7 @@ tauri-plugin-stronghold = { git = "https://github.com/tauri-apps/plugins-workspa
|
||||
tauri-plugin-store = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v1" }
|
||||
tauri-plugin-upload = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "v1" }
|
||||
window-vibrancy = { git = "https://github.com/tauri-apps/window-vibrancy", branch = "dev" }
|
||||
window-shadows = { git = "https://github.com/tauri-apps/window-shadows", branch = "dev" }
|
||||
sqlx-cli = { version = "0.7.0", default-features = false, features = [
|
||||
"sqlite",
|
||||
] }
|
||||
|
@ -12,9 +12,8 @@ use tauri::{Manager, WindowEvent};
|
||||
use tauri_plugin_autostart::MacosLauncher;
|
||||
use tauri_plugin_sql::{Migration, MigrationKind};
|
||||
use webpage::{Webpage, WebpageOptions};
|
||||
|
||||
#[cfg(target_os = "macos")]
|
||||
use window_vibrancy::{apply_vibrancy, NSVisualEffectMaterial};
|
||||
use window_vibrancy::{apply_mica, apply_vibrancy, NSVisualEffectMaterial};
|
||||
use window_shadows::set_shadow;
|
||||
|
||||
#[cfg(target_os = "macos")]
|
||||
use traffic_light::TrafficLight;
|
||||
@ -107,6 +106,12 @@ fn main() {
|
||||
tauri::Builder::default()
|
||||
.setup(|app| {
|
||||
let window = app.get_window("main").unwrap();
|
||||
let splashscreen = app.get_window("splashscreen").unwrap();
|
||||
|
||||
#[cfg(target_os = "windows")]
|
||||
set_shadow(&window, true).expect("Unsupported platform!");
|
||||
#[cfg(target_os = "windows")]
|
||||
set_shadow(&splashscreen, true).expect("Unsupported platform!");
|
||||
|
||||
#[cfg(target_os = "macos")]
|
||||
apply_vibrancy(&window, NSVisualEffectMaterial::HudWindow, None, None)
|
||||
|
@ -17,6 +17,7 @@
|
||||
"height": 800,
|
||||
"minWidth": 1080,
|
||||
"minHeight": 800,
|
||||
"decorations": false,
|
||||
"resizable": true,
|
||||
"theme": "Dark",
|
||||
"title": "Lume",
|
||||
|
@ -1,3 +1,4 @@
|
||||
import '@fontsource-variable/inter/slnt.css';
|
||||
import { message } from '@tauri-apps/api/dialog';
|
||||
import { fetch } from '@tauri-apps/api/http';
|
||||
import { RouterProvider, createBrowserRouter, defer, redirect } from 'react-router-dom';
|
||||
@ -12,14 +13,13 @@ import { ExploreScreen } from '@app/explore';
|
||||
|
||||
import { useStorage } from '@libs/storage/provider';
|
||||
|
||||
import { Frame } from '@shared/frame';
|
||||
import { LoaderIcon } from '@shared/icons';
|
||||
import { AppLayout } from '@shared/layouts/app';
|
||||
import { AuthLayout } from '@shared/layouts/auth';
|
||||
import { NoteLayout } from '@shared/layouts/note';
|
||||
import { SettingsLayout } from '@shared/layouts/settings';
|
||||
|
||||
import './index.css';
|
||||
import './app.css';
|
||||
|
||||
export default function App() {
|
||||
const { db } = useStorage();
|
||||
@ -331,9 +331,9 @@ export default function App() {
|
||||
<RouterProvider
|
||||
router={router}
|
||||
fallbackElement={
|
||||
<Frame className="flex h-full w-full items-center justify-center">
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<LoaderIcon className="h-6 w-6 animate-spin text-white" />
|
||||
</Frame>
|
||||
</div>
|
||||
}
|
||||
future={{ v7_startTransition: true }}
|
||||
/>
|
||||
|
@ -1,8 +1,6 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useLocation, useRouteError } from 'react-router-dom';
|
||||
|
||||
import { Frame } from '@shared/frame';
|
||||
|
||||
interface RouteError {
|
||||
statusText: string;
|
||||
message: string;
|
||||
@ -46,7 +44,7 @@ export function ErrorScreen() {
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Frame className="flex h-full items-center justify-center">
|
||||
<div className="flex h-full items-center justify-center">
|
||||
<div className="flex w-full flex-col gap-4 px-4 md:max-w-lg md:px-0">
|
||||
<div className="flex flex-col">
|
||||
<h1 className="mb-1 text-2xl font-semibold text-white">
|
||||
@ -88,6 +86,6 @@ export function ErrorScreen() {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</Frame>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -68,12 +68,12 @@ export function ActiveAccount() {
|
||||
className="h-9 w-9 shrink-0 rounded-lg object-cover"
|
||||
/>
|
||||
<div className="flex flex-col items-start">
|
||||
<p className="max-w-[10rem] truncate text-base font-semibold leading-none text-white">
|
||||
<div className="max-w-[10rem] truncate text-sm font-semibold text-white">
|
||||
{user?.name || user?.display_name || user?.displayName}
|
||||
</p>
|
||||
<span className="max-w-[7rem] truncate text-sm leading-none text-white/50">
|
||||
</div>
|
||||
<div className="max-w-[7rem] truncate text-sm text-white/50">
|
||||
{user?.nip05 || displayNpub(db.account.pubkey, 12)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<div className="inline-flex divide-x divide-white/5 rounded-lg border-t border-white/5 bg-white/10">
|
||||
|
@ -1,28 +0,0 @@
|
||||
import { HTMLProps, ReactNode, useCallback } from 'react';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
import { useStorage } from '@libs/storage/provider';
|
||||
|
||||
export function Frame({
|
||||
children,
|
||||
className,
|
||||
lighter,
|
||||
}: {
|
||||
children: ReactNode;
|
||||
className: HTMLProps<HTMLElement>['className'];
|
||||
lighter?: boolean;
|
||||
}) {
|
||||
const { db } = useStorage();
|
||||
|
||||
const platformStyles = useCallback(() => {
|
||||
switch (db.platform) {
|
||||
case 'darwin':
|
||||
if (lighter) return 'bg-black/80';
|
||||
return 'bg-black/90';
|
||||
default:
|
||||
return 'bg-black';
|
||||
}
|
||||
}, []);
|
||||
|
||||
return <div className={twMerge(className, platformStyles())}>{children}</div>;
|
||||
}
|
@ -1,6 +1,5 @@
|
||||
import { Outlet, ScrollRestoration } from 'react-router-dom';
|
||||
|
||||
import { Frame } from '@shared/frame';
|
||||
import { Navigation } from '@shared/navigation';
|
||||
|
||||
export function AppLayout() {
|
||||
@ -9,14 +8,14 @@ export function AppLayout() {
|
||||
<div className="shrink-0">
|
||||
<Navigation />
|
||||
</div>
|
||||
<Frame className="h-full w-full flex-1">
|
||||
<div className="h-full w-full flex-1">
|
||||
<Outlet />
|
||||
<ScrollRestoration
|
||||
getKey={(location) => {
|
||||
return location.pathname;
|
||||
}}
|
||||
/>
|
||||
</Frame>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,12 +1,10 @@
|
||||
import { Outlet } from 'react-router-dom';
|
||||
|
||||
import { Frame } from '@shared/frame';
|
||||
|
||||
export function AuthLayout() {
|
||||
return (
|
||||
<Frame className="relative h-screen w-screen">
|
||||
<div className="relative h-screen w-screen">
|
||||
<div className="absolute left-0 top-0 z-50 h-16 w-full" data-tauri-drag-region />
|
||||
<Outlet />
|
||||
</Frame>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,12 +1,10 @@
|
||||
import { Outlet } from 'react-router-dom';
|
||||
|
||||
import { Frame } from '@shared/frame';
|
||||
|
||||
export function NoteLayout() {
|
||||
return (
|
||||
<Frame className="relative h-screen w-screen">
|
||||
<div className="relative h-screen w-screen">
|
||||
<div className="absolute left-0 top-0 z-50 h-16 w-full" data-tauri-drag-region />
|
||||
<Outlet />
|
||||
</Frame>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,13 +1,12 @@
|
||||
import { Link, NavLink, Outlet, ScrollRestoration } from 'react-router-dom';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
import { Frame } from '@shared/frame';
|
||||
import { ArrowLeftIcon, SecureIcon, SettingsIcon } from '@shared/icons';
|
||||
|
||||
export function SettingsLayout() {
|
||||
return (
|
||||
<div className="flex h-screen w-screen">
|
||||
<Frame className="relative flex h-full w-[232px] flex-col" lighter>
|
||||
<div className="relative flex h-full w-[232px] flex-col">
|
||||
<div data-tauri-drag-region className="h-11 w-full shrink-0" />
|
||||
<div className="scrollbar-hide flex h-full flex-1 flex-col gap-2 overflow-y-auto pb-32">
|
||||
<div className="inline-flex items-center gap-2 border-l-2 border-transparent pl-4">
|
||||
@ -56,7 +55,7 @@ export function SettingsLayout() {
|
||||
</NavLink>
|
||||
</div>
|
||||
</div>
|
||||
</Frame>
|
||||
</div>
|
||||
<div className="h-full w-full flex-1 bg-black/90 backdrop-blur-xl">
|
||||
<Outlet />
|
||||
<ScrollRestoration
|
||||
|
@ -5,7 +5,6 @@ import { useStorage } from '@libs/storage/provider';
|
||||
|
||||
import { ActiveAccount } from '@shared/accounts/active';
|
||||
import { ComposerModal } from '@shared/composer';
|
||||
import { Frame } from '@shared/frame';
|
||||
import {
|
||||
ArrowLeftIcon,
|
||||
ArrowRightIcon,
|
||||
@ -21,10 +20,7 @@ export function Navigation() {
|
||||
const navigate = useNavigate();
|
||||
|
||||
return (
|
||||
<Frame
|
||||
className="relative flex h-full w-[232px] flex-col border-r border-white/5"
|
||||
lighter
|
||||
>
|
||||
<div className="relative flex h-full w-[232px] flex-col border-r border-white/5">
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="inline-flex h-16 w-full items-center justify-between px-3"
|
||||
@ -147,6 +143,6 @@ export function Navigation() {
|
||||
<div className="relative shrink-0">
|
||||
<ActiveAccount />
|
||||
</div>
|
||||
</Frame>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,10 +1,15 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
|
||||
const defaultTheme = require('tailwindcss/defaultTheme')
|
||||
|
||||
module.exports = {
|
||||
content: ['./src/**/*.{js,ts,jsx,tsx}', 'index.html'],
|
||||
darkMode: 'class',
|
||||
theme: {
|
||||
extend: {
|
||||
fontFamily: {
|
||||
sans: ['Inter Variable', ...defaultTheme.fontFamily.sans],
|
||||
},
|
||||
typography: ({ theme }) => ({
|
||||
white: {
|
||||
css: {
|
||||
|
@ -24,6 +24,6 @@
|
||||
"jsx": "preserve",
|
||||
"strictNullChecks": false
|
||||
},
|
||||
"include": ["**/*.ts", "**/*.tsx"],
|
||||
"include": ["**/*.ts", "**/*.tsx", "src/main.jsx"],
|
||||
"exclude": ["node_modules", "dist", "src-tauri"]
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user