Big restructure
This commit is contained in:
parent
1d0ebeb2b7
commit
4ee57ab459
69 changed files with 124 additions and 124 deletions
|
|
@ -18,10 +18,10 @@
|
|||
"@tanstack/react-query": "^5.0.0",
|
||||
"@tanstack/react-router": "^1.0.0",
|
||||
"@tanstack/react-virtual": "^3.0.0",
|
||||
"@tensamin/core-crypto": "workspace:*",
|
||||
"@tensamin/crypto": "workspace:*",
|
||||
"@tensamin/ttp": "workspace:*",
|
||||
"@tensamin/core-storage": "workspace:*",
|
||||
"@tensamin/core-user": "workspace:*",
|
||||
"@tensamin/storage": "workspace:*",
|
||||
"@tensamin/user": "workspace:*",
|
||||
"@tensamin/markdown": "workspace:*",
|
||||
"@tensamin/shared": "workspace:*",
|
||||
"@tensamin/ui": "workspace:*",
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
import Input from "@tensamin/markdown/input";
|
||||
import { Card, CardHeader } from "@tensamin/ui/card";
|
||||
import { useStorage } from "@tensamin/core-storage/context";
|
||||
import { useStorage } from "@tensamin/storage/context";
|
||||
import * as React from "react";
|
||||
import { Button } from "@tensamin/ui/button";
|
||||
|
||||
import { Plus, Laugh, Clapperboard } from "lucide-react";
|
||||
import { useChat } from "../context";
|
||||
import { useSocket } from "@tensamin/ttp/context";
|
||||
import { useCrypto } from "@tensamin/core-crypto/context";
|
||||
import { useCrypto } from "@tensamin/crypto/context";
|
||||
import { log, toast } from "@tensamin/shared/log";
|
||||
|
||||
export default function InputComponent() {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { useCrypto } from "@tensamin/core-crypto/context";
|
||||
import { useCrypto } from "@tensamin/crypto/context";
|
||||
import * as React from "react";
|
||||
import { useChat } from "../context";
|
||||
import type { RawMessage } from "../values";
|
||||
|
|
|
|||
|
|
@ -2,9 +2,9 @@ import * as React from "react";
|
|||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||
import { useRouterState } from "@tanstack/react-router";
|
||||
import type { RawMessage, RawMessages } from "./values";
|
||||
import { useCrypto } from "@tensamin/core-crypto/context";
|
||||
import { useUser } from "@tensamin/core-user/context";
|
||||
import { useStorage } from "@tensamin/core-storage/context";
|
||||
import { useCrypto } from "@tensamin/crypto/context";
|
||||
import { useUser } from "@tensamin/user/context";
|
||||
import { useStorage } from "@tensamin/storage/context";
|
||||
import { useSocket } from "@tensamin/ttp/context";
|
||||
|
||||
export const context = React.createContext<contextType | undefined>(undefined);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "@tensamin/core-crypto",
|
||||
"name": "@tensamin/crypto",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
1
packages/desktop/.gitignore
vendored
1
packages/desktop/.gitignore
vendored
|
|
@ -1 +0,0 @@
|
|||
build
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
import type { ElectrobunConfig } from "electrobun";
|
||||
|
||||
import { version } from "@tensamin/shared/package.json";
|
||||
|
||||
export default {
|
||||
app: {
|
||||
name: "tensamin",
|
||||
identifier: "client.tensamin.net",
|
||||
version: version,
|
||||
},
|
||||
build: {
|
||||
views: {
|
||||
mainview: {
|
||||
entrypoint: "src/mainview/index.ts",
|
||||
},
|
||||
},
|
||||
copy: {
|
||||
"../web/dist/": "views/mainview/",
|
||||
},
|
||||
mac: {
|
||||
defaultRenderer: "cef",
|
||||
bundleCEF: true,
|
||||
},
|
||||
linux: {
|
||||
defaultRenderer: "cef",
|
||||
bundleCEF: true,
|
||||
chromiumFlags: {
|
||||
"enable-features": "UseOzonePlatform",
|
||||
"ozone-platform": "wayland",
|
||||
},
|
||||
},
|
||||
win: {
|
||||
defaultRenderer: "cef",
|
||||
bundleCEF: true,
|
||||
},
|
||||
},
|
||||
} satisfies ElectrobunConfig;
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
# Electrobun Project
|
||||
|
||||
This is an Electrobun desktop application.
|
||||
|
||||
IMPORTANT: Electrobun is NOT Electron. Do not use Electron APIs or patterns.
|
||||
|
||||
## Documentation
|
||||
|
||||
Full API reference: https://blackboard.sh/electrobun/llms.txt
|
||||
Getting started: https://blackboard.sh/electrobun/docs/
|
||||
|
||||
## Quick Reference
|
||||
|
||||
Import patterns:
|
||||
- Main process (Bun): `import { BrowserWindow } from "electrobun/bun"`
|
||||
- Browser context: `import { Electroview } from "electrobun/view"`
|
||||
|
||||
Use `views://` URLs to load bundled assets (e.g., `url: "views://mainview/index.html"`).
|
||||
Views must be configured in `electrobun.config.ts` to be built and copied into the bundle.
|
||||
|
||||
## About
|
||||
|
||||
Electrobun is built by Blackboard (https://blackboard.sh), an innovation lab building
|
||||
tools and funding teams that define the next generation of technology.
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"name": "electrobun-hello-world",
|
||||
"version": "1.0.0",
|
||||
"description": "A simple Electrobun app showcasing core features",
|
||||
"scripts": {
|
||||
"format": "bunx prettier --write .",
|
||||
"lint": "echo desktop lint skipped",
|
||||
"build": "echo desktop build skipped",
|
||||
"start": "electrobun dev",
|
||||
"dev": "electrobun dev --watch"
|
||||
},
|
||||
"dependencies": {
|
||||
"electrobun": "1.15.1",
|
||||
"@tensamin/shared": "workspace:*"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/bun": "latest"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
{pkgs ? import <nixpkgs> {}}: let
|
||||
libs = with pkgs; [
|
||||
nspr
|
||||
nss
|
||||
libxcb
|
||||
libxkbcommon
|
||||
wayland
|
||||
libdecor
|
||||
dbus
|
||||
atk
|
||||
glib
|
||||
gtk3
|
||||
cups
|
||||
libx11
|
||||
libxcomposite
|
||||
libxdamage
|
||||
libxext
|
||||
libxfixes
|
||||
libxrandr
|
||||
libgbm
|
||||
expat
|
||||
cairo
|
||||
pango
|
||||
alsa-lib
|
||||
|
||||
webkitgtk_4_1
|
||||
libsoup_3
|
||||
libayatana-appindicator
|
||||
gdk-pixbuf
|
||||
];
|
||||
in
|
||||
pkgs.mkShell {
|
||||
buildInputs = [pkgs.bun] ++ libs;
|
||||
|
||||
shellHook = ''
|
||||
export LD_LIBRARY_PATH=${pkgs.lib.makeLibraryPath libs}:$LD_LIBRARY_PATH
|
||||
export GDK_BACKEND=wayland
|
||||
export OZONE_PLATFORM=wayland
|
||||
export XDG_SESSION_TYPE=wayland
|
||||
'';
|
||||
}
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
import { BrowserWindow } from "electrobun/bun";
|
||||
|
||||
// Create the main application window
|
||||
const mainWindow = new BrowserWindow({
|
||||
title: "Hello Electrobun!",
|
||||
url: "views://mainview/index.html",
|
||||
renderer: "cef",
|
||||
frame: {
|
||||
width: 800,
|
||||
height: 800,
|
||||
x: 200,
|
||||
y: 200,
|
||||
},
|
||||
});
|
||||
|
||||
mainWindow.url = "views://mainview/index.html";
|
||||
|
||||
console.log("Hello Electrobun app started!");
|
||||
|
|
@ -1,126 +0,0 @@
|
|||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family:
|
||||
-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu,
|
||||
Cantarell, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
color: #333;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: 40px 20px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: white;
|
||||
font-size: 3rem;
|
||||
text-align: center;
|
||||
margin-bottom: 8px;
|
||||
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-size: 1.25rem;
|
||||
text-align: center;
|
||||
margin-top: 0;
|
||||
margin-bottom: 40px;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.welcome-section {
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
padding: 30px;
|
||||
margin: 30px 0;
|
||||
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #2563eb;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 20px 0;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
.links {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
margin: 25px 0;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.doc-link {
|
||||
display: inline-block;
|
||||
background: #2563eb;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
padding: 12px 20px;
|
||||
border-radius: 8px;
|
||||
font-weight: 500;
|
||||
transition: all 0.2s ease;
|
||||
box-shadow: 0 2px 4px rgba(37, 99, 235, 0.2);
|
||||
}
|
||||
|
||||
.doc-link:hover {
|
||||
background: #1d4ed8;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 8px rgba(37, 99, 235, 0.3);
|
||||
}
|
||||
|
||||
code {
|
||||
background: #f1f5f9;
|
||||
color: #475569;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.footer {
|
||||
text-align: center;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
margin-top: 40px;
|
||||
padding: 20px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 8px;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.footer p {
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
/* Dark mode support */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.welcome-section {
|
||||
background: #1f2937;
|
||||
color: #f3f4f6;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #60a5fa;
|
||||
}
|
||||
|
||||
code {
|
||||
background: #374151;
|
||||
color: #d1d5db;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,64 +0,0 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Hello Electrobun!</title>
|
||||
<link rel="stylesheet" href="index.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Hello Electrobun! 🎉</h1>
|
||||
<p class="subtitle">A fast, cross-platform desktop app framework</p>
|
||||
|
||||
<div class="welcome-section">
|
||||
<p>
|
||||
Welcome to your first Electrobun app! This framework combines the
|
||||
power of Bun with native desktop capabilities.
|
||||
</p>
|
||||
|
||||
<h2>What is Electrobun?</h2>
|
||||
<ul>
|
||||
<li>
|
||||
<strong>Fast:</strong> Built on Bun's lightning-fast JavaScript
|
||||
runtime
|
||||
</li>
|
||||
<li>
|
||||
<strong>Native:</strong> Access to system APIs like menus, trays,
|
||||
and file dialogs
|
||||
</li>
|
||||
<li>
|
||||
<strong>Cross-platform:</strong> Works on macOS, Windows, and Linux
|
||||
</li>
|
||||
<li>
|
||||
<strong>Web-based UI:</strong> Use familiar HTML, CSS, and
|
||||
JavaScript for your interface
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h2>Get Started</h2>
|
||||
<p>
|
||||
Ready to build something amazing? Check out the documentation and
|
||||
examples:
|
||||
</p>
|
||||
|
||||
<div class="links">
|
||||
<a href="https://electrobun.dev/" class="doc-link"> 📚 Electrobun </a>
|
||||
<a href="https://github.com/blackboardsh/electrobun" class="doc-link">
|
||||
🐙 GitHub Repository
|
||||
</a>
|
||||
<a href="https://electrobun.dev/docs/apis/bun/" class="doc-link">
|
||||
💡 Api Docs
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<p>
|
||||
Edit <code>src/bun/index.ts</code> and <code>src/mainview/</code> to
|
||||
customize your app
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1 +0,0 @@
|
|||
console.log("Hello Electrobun view loaded!");
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"lib": ["ESNext", "DOM"],
|
||||
"target": "ESNext",
|
||||
"module": "ESNext",
|
||||
"moduleDetection": "force",
|
||||
"jsx": "react-jsx",
|
||||
"allowJs": true,
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"noEmit": true,
|
||||
"strict": true,
|
||||
"skipLibCheck": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noPropertyAccessFromIndexSignature": true
|
||||
},
|
||||
"include": ["src/**/*", "./electrobun.config.ts"],
|
||||
"exclude": ["node_modules", "dist", "build", "../../package/dist"]
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "@tensamin/core-storage",
|
||||
"name": "@tensamin/storage",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
|
|
@ -16,8 +16,8 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@tanstack/react-router": "^1.0.0",
|
||||
"@tensamin/core-crypto": "workspace:*",
|
||||
"@tensamin/core-storage": "workspace:*",
|
||||
"@tensamin/crypto": "workspace:*",
|
||||
"@tensamin/storage": "workspace:*",
|
||||
"@tensamin/shared": "workspace:*",
|
||||
"@tensamin/ui": "workspace:*",
|
||||
"react": "^19.2.0",
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "@tensamin/core-user",
|
||||
"name": "@tensamin/user",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
24
packages/web/.gitignore
vendored
24
packages/web/.gitignore
vendored
|
|
@ -1,24 +0,0 @@
|
|||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Tensamin</title>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
{
|
||||
"name": "@tensamin/web",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"format": "bunx prettier --write .",
|
||||
"lint": "eslint src",
|
||||
"dev": "vite --port 3000",
|
||||
"build": "tsc -b && vite build",
|
||||
"preview": "cd dist && nix-shell -p python3 --run 'python3 -m http.server 3000' && cd .."
|
||||
},
|
||||
"dependencies": {
|
||||
"@tensamin/chat": "workspace:*",
|
||||
"@tensamin/core-crypto": "workspace:*",
|
||||
"@tensamin/ttp": "workspace:*",
|
||||
"@tensamin/core-storage": "workspace:*",
|
||||
"@tensamin/core-user": "workspace:*",
|
||||
"@tensamin/shared": "workspace:*",
|
||||
"@tensamin/ui": "workspace:*",
|
||||
"@noble/curves": "^2.0.1",
|
||||
"@tailwindcss/vite": "^4.2.1",
|
||||
"@tanstack/react-router": "^1.0.0",
|
||||
"@tanstack/react-virtual": "^3.0.0",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"comlink": "^4.4.2",
|
||||
"lucide-react": "^0.564.0",
|
||||
"react": "^19.2.0",
|
||||
"react-dom": "^19.2.0",
|
||||
"sonner": "^1.0.0",
|
||||
"tailwind-merge": "^3.5.0",
|
||||
"tailwind-scrollbar-hide": "^4.0.0",
|
||||
"tailwindcss": "^4.2.1",
|
||||
"tw-animate-css": "^1.4.0",
|
||||
"vite-tsconfig-paths": "^6.1.1",
|
||||
"zod": "^4.3.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^19.2.2",
|
||||
"@types/react-dom": "^19.2.2",
|
||||
"@vitejs/plugin-react": "^5.0.4",
|
||||
"@eslint/js": "^10.0.1",
|
||||
"eslint": "^10.0.3",
|
||||
"globals": "^17.4.0",
|
||||
"typescript": "~5.9.3",
|
||||
"typescript-eslint": "^8.57.0",
|
||||
"vite": "^7.3.1"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
|
|
@ -1,20 +0,0 @@
|
|||
import type { User } from "@tensamin/core-user/context";
|
||||
import Avatar from "@tensamin/ui/avatar";
|
||||
import { reduceDisplay } from "./utils";
|
||||
import { Card, CardHeader } from "@tensamin/ui/card";
|
||||
|
||||
export default function Basic(props: { user: User }) {
|
||||
return (
|
||||
<Card className="animate-in fade-in duration-300 rounded-2xl">
|
||||
<CardHeader className="flex flex-row gap-2.5 items-center justify-start p-2">
|
||||
<Avatar
|
||||
img={props.user.avatar}
|
||||
fallback={reduceDisplay(props.user.display)}
|
||||
/>
|
||||
<div className="flex flex-col gap-1 w-full items-start justify-center text-[15px]">
|
||||
<p>{props.user.display}</p>
|
||||
</div>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
export function reduceDisplay(display: string) {
|
||||
const words = display.split(" ");
|
||||
if (words.length === 1) {
|
||||
return display.slice(0, 2).toUpperCase();
|
||||
} else {
|
||||
return words[0].charAt(0).toUpperCase() + words[1].charAt(0).toUpperCase();
|
||||
}
|
||||
}
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
import { Button } from "@tensamin/ui/button";
|
||||
import { House } from "lucide-react";
|
||||
import { useNavigate, useRouterState } from "@tanstack/react-router";
|
||||
import * as React from "react";
|
||||
import { useUser, type User } from "@tensamin/core-user/context";
|
||||
|
||||
export default function Navbar() {
|
||||
const navigate = useNavigate();
|
||||
const { get } = useUser();
|
||||
const search = useRouterState({ select: (state) => state.location.search });
|
||||
|
||||
const [user, setUser] = React.useState<User | null>(null);
|
||||
|
||||
const currentId = React.useMemo(
|
||||
() => Number((search as Record<string, unknown>).id ?? Number.NaN),
|
||||
[search],
|
||||
);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (Number.isNaN(currentId)) {
|
||||
setUser(null);
|
||||
return;
|
||||
}
|
||||
|
||||
get(currentId)
|
||||
.then(setUser)
|
||||
.catch(() => setUser(null));
|
||||
}, [currentId, get]);
|
||||
|
||||
return (
|
||||
<div className="w-full h-13.5 flex items-center justify-center">
|
||||
<Button
|
||||
onClick={() => {
|
||||
void navigate({ to: "/" });
|
||||
}}
|
||||
className="w-9 h-9 aspect-square p-0 rounded-lg"
|
||||
variant="outline"
|
||||
>
|
||||
<House size={18} />
|
||||
</Button>
|
||||
<p className="font-medium pl-3 text-md">{user?.display}</p>
|
||||
<div className="w-full" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,138 +0,0 @@
|
|||
import { Button } from "@tensamin/ui/button";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@tensamin/ui/card";
|
||||
import { Input } from "@tensamin/ui/input";
|
||||
import { Label } from "@tensamin/ui/label";
|
||||
import { useStorage } from "@tensamin/core-storage/context";
|
||||
import { log, toast } from "@tensamin/shared/log";
|
||||
import { useNavigate } from "@tanstack/react-router";
|
||||
import { Upload } from "lucide-react";
|
||||
import * as React from "react";
|
||||
import { z } from "zod";
|
||||
|
||||
const fetchedUser = z.object({
|
||||
id: z.uuidv4(),
|
||||
type: z.string(),
|
||||
data: z.object({
|
||||
iota_id: z.number(),
|
||||
username: z.string(),
|
||||
sub_level: z.number(),
|
||||
public_key: z.base64(),
|
||||
user_id: z.number(),
|
||||
sub_end: z.number(),
|
||||
}),
|
||||
});
|
||||
|
||||
const formSchema = z.object({
|
||||
username: z.string().min(1).max(15),
|
||||
private_key: z.string().min(1).max(92),
|
||||
});
|
||||
|
||||
export default function Form() {
|
||||
const uploadRef = React.useRef<HTMLInputElement | null>(null);
|
||||
const { save } = useStorage();
|
||||
const navigate = useNavigate();
|
||||
|
||||
return (
|
||||
<div className="flex gap-5">
|
||||
<Card className="w-75 h-80">
|
||||
<CardHeader>
|
||||
<CardTitle>Use .tu file</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="h-full flex items-center justify-center">
|
||||
<div
|
||||
onClick={() => uploadRef.current?.click()}
|
||||
className="cursor-pointer w-60 aspect-square mb-17 bg-input/13 hover:bg-input/30 transition-all duration-300 ease-in-out border-dotted border-input/75 border-3 flex items-center justify-center rounded-lg"
|
||||
>
|
||||
<Upload className="text-input/75" size={34} />
|
||||
</div>
|
||||
<input
|
||||
onChange={async (e) => {
|
||||
try {
|
||||
const file = e.currentTarget.files?.[0];
|
||||
if (file) {
|
||||
const raw = await file.text();
|
||||
if (raw.length !== 92) throw new Error("Invalid file");
|
||||
if (!raw.includes("::")) throw new Error("Invalid file");
|
||||
const [userIdString, privateKey] = raw.split("::");
|
||||
const userId = Number(userIdString);
|
||||
if (!userId || !privateKey) throw new Error("Invalid file");
|
||||
|
||||
save("user_id", userId);
|
||||
save("private_key", privateKey);
|
||||
|
||||
void navigate({ to: "/" });
|
||||
} else {
|
||||
throw new Error("No file selected");
|
||||
}
|
||||
} catch (err) {
|
||||
log(0, "Login", "red", err);
|
||||
toast("error", "Failed to load file");
|
||||
}
|
||||
}}
|
||||
type="file"
|
||||
ref={uploadRef}
|
||||
className="hidden"
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className="w-75 h-auto">
|
||||
<CardHeader>
|
||||
<CardTitle>Use credentials</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form
|
||||
className="flex flex-col gap-5 h-full"
|
||||
onSubmit={async (e) => {
|
||||
e.preventDefault();
|
||||
const formData = new FormData(e.currentTarget);
|
||||
const rawData = Object.fromEntries(formData);
|
||||
const inputParse = formSchema.safeParse(rawData);
|
||||
|
||||
if (!inputParse.success) {
|
||||
toast("error", "Please enter valid data");
|
||||
return;
|
||||
}
|
||||
|
||||
const response = await fetch(
|
||||
"https://omega.tensamin.net/api/get/id/" +
|
||||
inputParse.data.username,
|
||||
);
|
||||
|
||||
response
|
||||
.json()
|
||||
.then((data) => {
|
||||
const parse = fetchedUser.safeParse(data);
|
||||
|
||||
if (parse.success) {
|
||||
const user = parse.data;
|
||||
|
||||
save("user_id", user.data.user_id);
|
||||
save("private_key", inputParse.data.private_key);
|
||||
|
||||
void navigate({ to: "/" });
|
||||
} else {
|
||||
log(0, "Login", "red", "Invalid response from server");
|
||||
toast("error", "Invalid response from server");
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
log(0, "Login", "red", err);
|
||||
toast("error", "Failed to fetch user data");
|
||||
});
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label htmlFor="username">Username</Label>
|
||||
<Input type="text" id="username" name="username" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label htmlFor="private_key">Private Key</Label>
|
||||
<Input type="password" id="private_key" name="private_key" />
|
||||
</div>
|
||||
<Button type="submit">Login</Button>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
import { useStorage } from "@tensamin/core-storage/context";
|
||||
import Wrapper from "@tensamin/core-user/wrapper";
|
||||
import * as React from "react";
|
||||
import Basic from "./modals/basic";
|
||||
import List from "@/features/conversation/list/body";
|
||||
|
||||
export default function Sidebar() {
|
||||
const [userId, setUserId] = React.useState(0);
|
||||
const { load } = useStorage();
|
||||
|
||||
React.useEffect(() => {
|
||||
load("user_id").then(setUserId);
|
||||
}, [load]);
|
||||
|
||||
return (
|
||||
<div className="w-75 h-full flex flex-col gap-3 p-2">
|
||||
{userId !== 0 && (
|
||||
<Wrapper
|
||||
userId={userId}
|
||||
component={(user) => <Basic user={user} />}
|
||||
/>
|
||||
)}
|
||||
<div className="h-full">
|
||||
<List />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,75 +0,0 @@
|
|||
import * as React from "react";
|
||||
import { useSocket } from "@tensamin/ttp/context";
|
||||
|
||||
import { toast } from "@tensamin/shared/log";
|
||||
import type {
|
||||
Community,
|
||||
Conversation,
|
||||
} from "@tensamin/shared/features/conversation/schema";
|
||||
|
||||
interface contextValue {
|
||||
conversations: Conversation[];
|
||||
communities: Community[];
|
||||
}
|
||||
|
||||
const ConversationContext = React.createContext<contextValue | undefined>(
|
||||
undefined,
|
||||
);
|
||||
|
||||
export default function ConversationProvider(props: {
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
const [conversations, setConversations] = React.useState<Conversation[]>([]);
|
||||
const [communities, setCommunities] = React.useState<Community[]>([]);
|
||||
|
||||
const { send } = useSocket();
|
||||
|
||||
React.useEffect(() => {
|
||||
let active = true;
|
||||
|
||||
send("get_chats", {})
|
||||
.then((data) => {
|
||||
if (active) {
|
||||
setConversations(data.data.user_ids);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
toast("error", "Failed to load conversations");
|
||||
});
|
||||
|
||||
send("get_communities", {})
|
||||
.then((data) => {
|
||||
if (active) {
|
||||
setCommunities(data.data.communities);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
toast("error", "Failed to load communities");
|
||||
});
|
||||
|
||||
return () => {
|
||||
active = false;
|
||||
};
|
||||
}, [send]);
|
||||
|
||||
const value = React.useMemo(
|
||||
() => ({ conversations, communities }),
|
||||
[communities, conversations],
|
||||
);
|
||||
|
||||
return (
|
||||
<ConversationContext.Provider value={value}>
|
||||
{props.children}
|
||||
</ConversationContext.Provider>
|
||||
);
|
||||
}
|
||||
|
||||
export function useConversation(): contextValue {
|
||||
const context = React.useContext(ConversationContext);
|
||||
if (!context) {
|
||||
throw new Error(
|
||||
"useConversation must be used within a ConversationProvider",
|
||||
);
|
||||
}
|
||||
return context;
|
||||
}
|
||||
|
|
@ -1,64 +0,0 @@
|
|||
import * as React from "react";
|
||||
import { useVirtualizer } from "@tanstack/react-virtual";
|
||||
import { useConversation } from "../context";
|
||||
|
||||
import Switch from "./switch";
|
||||
import ConversationModal from "../modal/conversation";
|
||||
import CommunityModal from "../modal/community";
|
||||
|
||||
export default function List() {
|
||||
const [category, setCategory] = React.useState<
|
||||
"conversations" | "communities"
|
||||
>("conversations");
|
||||
|
||||
const { conversations, communities } = useConversation();
|
||||
|
||||
const scrollRef = React.useRef<HTMLDivElement | null>(null);
|
||||
|
||||
const virtualizer = useVirtualizer({
|
||||
count: category === "conversations" ? conversations.length : communities.length,
|
||||
estimateSize: () => 80,
|
||||
getScrollElement: () => scrollRef.current,
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-3">
|
||||
<Switch category={category} setCategory={setCategory} />
|
||||
<div ref={scrollRef} id="conversation-list" className="overflow-y-auto flex-1">
|
||||
<div
|
||||
className="relative w-full flex flex-col gap-2"
|
||||
style={{
|
||||
height: `${virtualizer.getTotalSize()}px`,
|
||||
}}
|
||||
>
|
||||
{virtualizer.getVirtualItems().map((virtualItem) => {
|
||||
const itemKey = `${category}-${virtualItem.index}`;
|
||||
|
||||
return (
|
||||
<div
|
||||
key={itemKey}
|
||||
style={{
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
left: 0,
|
||||
width: "100%",
|
||||
transform: `translateY(${virtualItem.start}px)`,
|
||||
}}
|
||||
>
|
||||
{category === "conversations" ? (
|
||||
conversations[virtualItem.index] ? (
|
||||
<ConversationModal
|
||||
userId={conversations[virtualItem.index].user_id}
|
||||
/>
|
||||
) : null
|
||||
) : communities[virtualItem.index] ? (
|
||||
<CommunityModal community={communities[virtualItem.index]} />
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,77 +0,0 @@
|
|||
import * as React from "react";
|
||||
|
||||
type Category = "conversations" | "communities";
|
||||
|
||||
export default function Switch(props: {
|
||||
category: Category;
|
||||
setCategory: (category: Category) => void;
|
||||
}) {
|
||||
const conversationsRef = React.useRef<HTMLButtonElement | null>(null);
|
||||
const communitiesRef = React.useRef<HTMLButtonElement | null>(null);
|
||||
|
||||
const [indicator, setIndicator] = React.useState({ left: 0, width: 0 });
|
||||
|
||||
const updateIndicator = React.useCallback(() => {
|
||||
const active =
|
||||
props.category === "conversations"
|
||||
? conversationsRef.current
|
||||
: communitiesRef.current;
|
||||
if (!active) return;
|
||||
|
||||
setIndicator({
|
||||
left: active.offsetLeft,
|
||||
width: active.offsetWidth,
|
||||
});
|
||||
}, [props.category]);
|
||||
|
||||
React.useLayoutEffect(() => {
|
||||
updateIndicator();
|
||||
}, [updateIndicator]);
|
||||
|
||||
function toggleCategory() {
|
||||
props.setCategory(
|
||||
props.category === "conversations" ? "communities" : "conversations",
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
role="tablist"
|
||||
className="border relative inline-flex rounded-full bg-card p-1 select-none"
|
||||
>
|
||||
<div
|
||||
className="absolute top-1 bottom-1 rounded-full bg-input shadow-sm transition-all duration-300 ease-in-out"
|
||||
style={{
|
||||
left: `${indicator.left}px`,
|
||||
width: `${indicator.width}px`,
|
||||
}}
|
||||
/>
|
||||
<button
|
||||
ref={conversationsRef}
|
||||
role="tab"
|
||||
aria-selected={props.category === "conversations"}
|
||||
className={`relative z-10 cursor-pointer px-2.5 py-1.5 rounded-full text-sm font-medium transition-colors duration-300 ${
|
||||
props.category === "conversations"
|
||||
? "text-foreground"
|
||||
: "text-ring/50 hover:text-ring"
|
||||
}`}
|
||||
onClick={toggleCategory}
|
||||
>
|
||||
Conversations
|
||||
</button>
|
||||
<button
|
||||
ref={communitiesRef}
|
||||
role="tab"
|
||||
aria-selected={props.category === "communities"}
|
||||
className={`relative z-10 cursor-pointer px-2.5 py-1.5 rounded-full text-sm font-medium transition-colors duration-300 ${
|
||||
props.category === "communities"
|
||||
? "text-foreground"
|
||||
: "text-ring/50 hover:text-ring"
|
||||
}`}
|
||||
onClick={toggleCategory}
|
||||
>
|
||||
Communities
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
import type { Community } from "@tensamin/shared/features/conversation/schema";
|
||||
|
||||
export default function CommunityModal(props: { community: Community }) {
|
||||
return <div>{props.community.community_title}</div>;
|
||||
}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
import Basic from "@/components/modals/basic";
|
||||
import Wrapper from "@tensamin/core-user/wrapper";
|
||||
import {
|
||||
ContextMenu,
|
||||
ContextMenuContent,
|
||||
ContextMenuGroup,
|
||||
ContextMenuItem,
|
||||
ContextMenuTrigger,
|
||||
} from "@tensamin/ui/context-menu";
|
||||
import { useNavigate } from "@tanstack/react-router";
|
||||
|
||||
export default function ConversationModal(props: { userId: number }) {
|
||||
const navigate = useNavigate();
|
||||
|
||||
return (
|
||||
<ContextMenu>
|
||||
<ContextMenuTrigger>
|
||||
<div
|
||||
className="select-none cursor-pointer"
|
||||
onClick={() => {
|
||||
void navigate({ to: "/chat", search: { id: props.userId } });
|
||||
}}
|
||||
>
|
||||
<Wrapper
|
||||
userId={props.userId}
|
||||
component={(user) => <Basic user={user} />}
|
||||
/>
|
||||
</div>
|
||||
</ContextMenuTrigger>
|
||||
<ContextMenuContent>
|
||||
<ContextMenuGroup>
|
||||
<ContextMenuItem>Test</ContextMenuItem>
|
||||
</ContextMenuGroup>
|
||||
</ContextMenuContent>
|
||||
</ContextMenu>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,264 +0,0 @@
|
|||
import * as React from "react";
|
||||
import { useStorage } from "@tensamin/core-storage/context";
|
||||
import { Button } from "@tensamin/ui/button";
|
||||
import {
|
||||
Checkbox,
|
||||
CheckboxLabel,
|
||||
CheckboxControl,
|
||||
} from "@tensamin/ui/checkbox";
|
||||
import { z } from "zod";
|
||||
|
||||
import ErrorScreen from "@tensamin/ui/screens/error";
|
||||
|
||||
import { legalDocsSchema } from "@tensamin/shared/features/legal/schema";
|
||||
import { log } from "@tensamin/shared/log";
|
||||
import Link from "@tensamin/ui/link";
|
||||
|
||||
export default function Screen(props: { children: React.ReactNode }) {
|
||||
const { load, save } = useStorage();
|
||||
|
||||
const [error, setError] = React.useState("");
|
||||
const [errorDescription, setErrorDescription] = React.useState("");
|
||||
|
||||
const [remoteDocs, setRemoteDocs] = React.useState<
|
||||
z.infer<typeof legalDocsSchema> | undefined
|
||||
>(undefined);
|
||||
|
||||
const [loading, setLoading] = React.useState(true);
|
||||
|
||||
const [PPandToSDone, setPPandToSDone] = React.useState(false);
|
||||
const [acceptedPP, acceptPP] = React.useState(false);
|
||||
const [acceptedTOS, acceptTOS] = React.useState(false);
|
||||
|
||||
const [doneWithAnalytics, setDoneWithAnalytics] = React.useState(false);
|
||||
const [crashReports, setCrashReports] = React.useState(false);
|
||||
const [usageData, setUsageData] = React.useState(false);
|
||||
|
||||
React.useEffect(() => {
|
||||
let active = true;
|
||||
|
||||
void load("user_id").then(async (id) => {
|
||||
if (!active) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (id === 0) {
|
||||
setPPandToSDone(true);
|
||||
setDoneWithAnalytics(true);
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
|
||||
const current = await fetch("https://legal.tensamin.net/api/current")
|
||||
.then((res) => res.json())
|
||||
.catch((err) => {
|
||||
if (!active) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
setError("Failed to load legal documents");
|
||||
setErrorDescription(
|
||||
"An error occurred while fetching the legal documents from the server. Please try again later.",
|
||||
);
|
||||
log(0, "Legal", "red", "Failed to fetch legal documents", err);
|
||||
return undefined;
|
||||
});
|
||||
|
||||
if (!active || current === undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
const safeCurrent = legalDocsSchema.safeParse(current);
|
||||
if (!safeCurrent.success) {
|
||||
setError("Failed to load legal documents");
|
||||
setErrorDescription(
|
||||
"The legal documents data received from the server is invalid. Please try again later.",
|
||||
);
|
||||
log(0, "Legal", "red", "Invalid legal documents data", safeCurrent.error);
|
||||
return;
|
||||
}
|
||||
|
||||
setRemoteDocs(safeCurrent.data);
|
||||
|
||||
const localDocs = await load("legal_docs");
|
||||
|
||||
const [
|
||||
loadedPPAndTOS,
|
||||
loadedAcceptedPP,
|
||||
loadedAcceptedTOS,
|
||||
loadedAnalyticsDone,
|
||||
loadedCrashReports,
|
||||
loadedUsageData,
|
||||
] = await Promise.all([
|
||||
load("ppandtos_done"),
|
||||
load("accepted_privacy_policy"),
|
||||
load("accepted_terms_of_service"),
|
||||
load("analytics_done"),
|
||||
load("analytics_crash_reports"),
|
||||
load("analytics_usage_data"),
|
||||
]);
|
||||
|
||||
if (!active) {
|
||||
return;
|
||||
}
|
||||
|
||||
setPPandToSDone(loadedPPAndTOS);
|
||||
acceptPP(loadedAcceptedPP);
|
||||
acceptTOS(loadedAcceptedTOS);
|
||||
setDoneWithAnalytics(loadedAnalyticsDone);
|
||||
setCrashReports(loadedCrashReports);
|
||||
setUsageData(loadedUsageData);
|
||||
|
||||
if (localDocs.pp.hash !== safeCurrent.data.pp.hash) {
|
||||
acceptPP(false);
|
||||
setPPandToSDone(false);
|
||||
}
|
||||
|
||||
if (localDocs.tos.hash !== safeCurrent.data.tos.hash) {
|
||||
acceptTOS(false);
|
||||
setPPandToSDone(false);
|
||||
}
|
||||
|
||||
setLoading(false);
|
||||
});
|
||||
|
||||
return () => {
|
||||
active = false;
|
||||
};
|
||||
}, [load]);
|
||||
|
||||
if (error !== "" && errorDescription !== "") {
|
||||
return <ErrorScreen error={error} description={errorDescription} />;
|
||||
}
|
||||
|
||||
if (loading) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (PPandToSDone && doneWithAnalytics) {
|
||||
return <>{props.children}</>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="w-full h-full flex items-center justify-center">
|
||||
<div className="h-full flex flex-col gap-15 p-10 md:p-40 w-full lg:w-2/3">
|
||||
{!PPandToSDone ? (
|
||||
<>
|
||||
<h1 className="text-3xl md:text-4xl font-bold">
|
||||
Privacy Policy & ToS
|
||||
<p className="text-muted-foreground text-[20px] font-normal pt-3">
|
||||
{remoteDocs?.pp.version} / {remoteDocs?.tos.version}
|
||||
</p>
|
||||
</h1>
|
||||
<div className="w-full h-full flex flex-col items-center justify-center gap-5">
|
||||
<div className="justify-start items-start flex flex-col gap-2">
|
||||
<BigCheckbox
|
||||
checked={acceptedPP}
|
||||
onChange={acceptPP}
|
||||
label="I agree to the Privacy Policy"
|
||||
/>
|
||||
<BigCheckbox
|
||||
checked={acceptedTOS}
|
||||
onChange={acceptTOS}
|
||||
label="I agree to the Terms of Service"
|
||||
/>
|
||||
<div className="w-full border-t-2" />
|
||||
<Link
|
||||
label="Privacy Policy"
|
||||
link={`https://legal.tensamin.net/pp/${remoteDocs?.pp.version}`}
|
||||
/>
|
||||
<Link
|
||||
label="Terms of Service"
|
||||
link={`https://legal.tensamin.net/tos/${remoteDocs?.tos.version}`}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<ContinueButton
|
||||
disabled={!acceptedPP || !acceptedTOS}
|
||||
onClick={() => {
|
||||
const currentDocs = remoteDocs;
|
||||
if (!currentDocs) {
|
||||
return;
|
||||
}
|
||||
|
||||
void (async () => {
|
||||
await save("accepted_privacy_policy", true);
|
||||
await save("accepted_terms_of_service", true);
|
||||
await save("ppandtos_done", true);
|
||||
await save("legal_docs", currentDocs);
|
||||
setPPandToSDone(true);
|
||||
})();
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<h1 className="text-3xl md:text-4xl font-bold">Analytics</h1>
|
||||
<div className="w-full h-full flex justify-center items-center">
|
||||
<div className="justify-start flex flex-col gap-2">
|
||||
<BigCheckbox
|
||||
checked={crashReports}
|
||||
onChange={setCrashReports}
|
||||
label="Send anonymous crash reports"
|
||||
/>
|
||||
<BigCheckbox
|
||||
checked={usageData}
|
||||
onChange={setUsageData}
|
||||
label="Send anonymous usage data"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<ContinueButton
|
||||
onClick={() => {
|
||||
const currentCrashReports = crashReports;
|
||||
const currentUsageData = usageData;
|
||||
|
||||
void save("analytics_crash_reports", currentCrashReports).then(() => {
|
||||
setCrashReports(currentCrashReports);
|
||||
});
|
||||
void save("analytics_usage_data", currentUsageData).then(() => {
|
||||
setUsageData(currentUsageData);
|
||||
});
|
||||
void save("analytics_done", true).then(() => {
|
||||
setDoneWithAnalytics(true);
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function ContinueButton(props: { onClick: () => void; disabled?: boolean }) {
|
||||
return (
|
||||
<div className="w-full flex justify-end">
|
||||
<Button
|
||||
size="lg"
|
||||
className="text-lg w-full md:w-auto"
|
||||
onClick={props.onClick}
|
||||
disabled={props.disabled}
|
||||
>
|
||||
Continue
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function BigCheckbox(props: {
|
||||
label: string;
|
||||
checked: boolean;
|
||||
onChange: (checked: boolean) => void;
|
||||
}) {
|
||||
return (
|
||||
<Checkbox
|
||||
checked={props.checked}
|
||||
onChange={props.onChange}
|
||||
className="flex items-center space-x-2"
|
||||
>
|
||||
<CheckboxControl className="size-5.5 rounded-md flex items-center justify-center" />
|
||||
<CheckboxLabel className="text-lg">{props.label}</CheckboxLabel>
|
||||
</Checkbox>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,152 +0,0 @@
|
|||
@import "tailwindcss";
|
||||
@import "tailwind-scrollbar-hide/v4";
|
||||
@import "tw-animate-css";
|
||||
|
||||
@source "./**/*.{ts,tsx}";
|
||||
@source "../../ui/src/**/*.{ts,tsx}";
|
||||
@source "../../core/**/src/**/*.{ts,tsx}";
|
||||
@source "../../chat/src/**/*.{ts,tsx}";
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
@theme inline {
|
||||
--breakpoint-sm: 640px;
|
||||
--breakpoint-md: 768px;
|
||||
--breakpoint-lg: 1024px;
|
||||
--breakpoint-xl: 1280px;
|
||||
--breakpoint-2xl: 1536px;
|
||||
|
||||
--animate-first: moveVertical 30s ease infinite;
|
||||
--animate-second: moveInCircle 20s reverse infinite;
|
||||
--animate-third: moveInCircle 40s linear infinite;
|
||||
--animate-fourth: moveHorizontal 40s ease infinite;
|
||||
--animate-fifth: moveInCircle 20s ease infinite;
|
||||
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-ring: var(--ring);
|
||||
--color-input: var(--input);
|
||||
--color-border: var(--border);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-card: var(--card);
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
}
|
||||
|
||||
:root {
|
||||
--radius: 0.625rem;
|
||||
--background: #f7f7f7;
|
||||
--foreground: #1f1f1f;
|
||||
--card: #ffffff;
|
||||
--card-foreground: #1f1f1f;
|
||||
--popover: #ffffff;
|
||||
--popover-foreground: #1f1f1f;
|
||||
--primary: #babbf1;
|
||||
--primary-foreground: #181a22;
|
||||
--secondary: #efefef;
|
||||
--secondary-foreground: #1f1f1f;
|
||||
--muted: #ececec;
|
||||
--muted-foreground: #666666;
|
||||
--accent: var(--border);
|
||||
--accent-foreground: #1f1f1f;
|
||||
--destructive: #d8d8d8;
|
||||
--destructive-foreground: #1f1f1f;
|
||||
--border: #dadada;
|
||||
--input: #e7e7e7;
|
||||
--ring: #babbf1;
|
||||
--chart-1: #babbf1;
|
||||
--chart-2: #bcbcbc;
|
||||
--chart-3: #969696;
|
||||
--chart-4: #717171;
|
||||
--chart-5: #4f4f4f;
|
||||
--sidebar: #f1f1f1;
|
||||
--sidebar-foreground: #1f1f1f;
|
||||
--sidebar-primary: #babbf1;
|
||||
--sidebar-primary-foreground: #181a22;
|
||||
--sidebar-accent: #e7e7e7;
|
||||
--sidebar-accent-foreground: #1f1f1f;
|
||||
--sidebar-border: #dadada;
|
||||
--sidebar-ring: #babbf1;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: #141414;
|
||||
--foreground: #f5f5f5;
|
||||
--card: #1d1d1d;
|
||||
--card-foreground: #f5f5f5;
|
||||
--popover: #1d1d1d;
|
||||
--popover-foreground: #f5f5f5;
|
||||
--primary: #babbf1;
|
||||
--primary-foreground: #11131a;
|
||||
--secondary: #232323;
|
||||
--secondary-foreground: #f5f5f5;
|
||||
--muted: #262626;
|
||||
--muted-foreground: #c7c7c7;
|
||||
--accent: var(--border);
|
||||
--accent-foreground: #f5f5f5;
|
||||
--destructive: #2c2c2c;
|
||||
--destructive-foreground: #f5f5f5;
|
||||
--border: #343434;
|
||||
--input: #2a2a2a;
|
||||
--ring: #babbf1;
|
||||
--chart-1: #babbf1;
|
||||
--chart-2: #bcbcbc;
|
||||
--chart-3: #969696;
|
||||
--chart-4: #707070;
|
||||
--chart-5: #525252;
|
||||
--sidebar: #171717;
|
||||
--sidebar-foreground: #f5f5f5;
|
||||
--sidebar-primary: #babbf1;
|
||||
--sidebar-primary-foreground: #11131a;
|
||||
--sidebar-accent: #262626;
|
||||
--sidebar-accent-foreground: #f5f5f5;
|
||||
--sidebar-border: #343434;
|
||||
--sidebar-ring: #babbf1;
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border outline-ring/50;
|
||||
}
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
font-family: "Inter", system-ui, sans-serif;
|
||||
}
|
||||
div {
|
||||
@apply text-foreground;
|
||||
}
|
||||
::selection {
|
||||
background: var(--color-primary, var(--primary));
|
||||
color: var(--color-primary-foreground, var(--primary-foreground));
|
||||
}
|
||||
::-moz-selection {
|
||||
background: var(--color-primary, var(--primary));
|
||||
color: var(--color-primary-foreground, var(--primary-foreground));
|
||||
}
|
||||
}
|
||||
|
|
@ -1,132 +0,0 @@
|
|||
import * as React from "react";
|
||||
import { createRoot } from "react-dom/client";
|
||||
import {
|
||||
Outlet,
|
||||
RouterProvider,
|
||||
createRootRoute,
|
||||
createRoute,
|
||||
createRouter,
|
||||
} from "@tanstack/react-router";
|
||||
import "./index.css";
|
||||
|
||||
import NotFound from "@/routes/404";
|
||||
|
||||
import RootLayout from "./routes/layout";
|
||||
import AppLayout from "./routes/app/layout";
|
||||
|
||||
import Home from "@/routes/app/home";
|
||||
import ChatScreen from "@tensamin/chat/screen";
|
||||
import ChatContext from "@tensamin/chat/context";
|
||||
import Login from "@/routes/screens/login";
|
||||
import Signup from "@/routes/screens/signup";
|
||||
|
||||
const wrapper = document.getElementById("root");
|
||||
|
||||
if (!wrapper) {
|
||||
throw new Error("Missing root element");
|
||||
}
|
||||
|
||||
// @ts-expect-error Declare global function
|
||||
window.setLogLevelToMax = () => {
|
||||
localStorage.setItem("log_level", String(1000));
|
||||
location.reload();
|
||||
};
|
||||
|
||||
function RootShell() {
|
||||
React.useEffect(() => {
|
||||
try {
|
||||
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
||||
|
||||
document.documentElement.classList.toggle("dark", mediaQuery.matches);
|
||||
|
||||
const handleChange = (event: MediaQueryListEvent) => {
|
||||
document.documentElement.classList.toggle("dark", event.matches);
|
||||
};
|
||||
|
||||
mediaQuery.addEventListener("change", handleChange);
|
||||
|
||||
return () => {
|
||||
mediaQuery.removeEventListener("change", handleChange);
|
||||
};
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="w-screen h-screen overflow-hidden">
|
||||
<RootLayout>
|
||||
<Outlet />
|
||||
</RootLayout>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function AppShell() {
|
||||
return (
|
||||
<AppLayout>
|
||||
<Outlet />
|
||||
</AppLayout>
|
||||
);
|
||||
}
|
||||
|
||||
function Chat() {
|
||||
return (
|
||||
<ChatContext>
|
||||
<ChatScreen />
|
||||
</ChatContext>
|
||||
);
|
||||
}
|
||||
|
||||
const rootRoute = createRootRoute({
|
||||
component: RootShell,
|
||||
});
|
||||
|
||||
const appRoute = createRoute({
|
||||
getParentRoute: () => rootRoute,
|
||||
id: "app",
|
||||
component: AppShell,
|
||||
});
|
||||
|
||||
const homeRoute = createRoute({
|
||||
getParentRoute: () => appRoute,
|
||||
path: "/",
|
||||
component: Home,
|
||||
});
|
||||
|
||||
const chatRoute = createRoute({
|
||||
getParentRoute: () => appRoute,
|
||||
path: "chat",
|
||||
component: Chat,
|
||||
});
|
||||
|
||||
const loginRoute = createRoute({
|
||||
getParentRoute: () => rootRoute,
|
||||
path: "login",
|
||||
component: Login,
|
||||
});
|
||||
|
||||
const signupRoute = createRoute({
|
||||
getParentRoute: () => rootRoute,
|
||||
path: "signup",
|
||||
component: Signup,
|
||||
});
|
||||
|
||||
const routeTree = rootRoute.addChildren([
|
||||
appRoute.addChildren([homeRoute, chatRoute]),
|
||||
loginRoute,
|
||||
signupRoute,
|
||||
]);
|
||||
|
||||
const router = createRouter({
|
||||
routeTree,
|
||||
defaultNotFoundComponent: NotFound,
|
||||
});
|
||||
|
||||
declare module "@tanstack/react-router" {
|
||||
interface Register {
|
||||
router: typeof router;
|
||||
}
|
||||
}
|
||||
|
||||
createRoot(wrapper).render(<RouterProvider router={router} />);
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
export default function Page() {
|
||||
return (
|
||||
<div className="w-full h-full flex items-center justify-center text-4xl font-bold">
|
||||
Page not found (404)
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
export default function Page() {
|
||||
return <div>Home</div>;
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
import Socket from "@tensamin/ttp/context";
|
||||
import User from "@tensamin/core-user/context";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
import Sidebar from "@/components/sidebar";
|
||||
import Conversation from "@/features/conversation/context";
|
||||
import Navbar from "@/components/navbar";
|
||||
|
||||
export default function Layout(props: { children: ReactNode }) {
|
||||
return (
|
||||
<Socket>
|
||||
<User>
|
||||
<Conversation>
|
||||
<div className="w-full h-full flex bg-sidebar">
|
||||
<Sidebar />
|
||||
<div className="w-full h-full flex flex-col">
|
||||
<Navbar />
|
||||
<div className="bg-background h-full w-full rounded-tl-3xl border-t border-l">
|
||||
{props.children}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Conversation>
|
||||
</User>
|
||||
</Socket>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
import type { ReactNode } from "react";
|
||||
|
||||
import Storage from "@tensamin/core-storage/context";
|
||||
import Crypto from "@tensamin/core-crypto/context";
|
||||
|
||||
import LegalWrapper from "@/features/legal/screen";
|
||||
|
||||
import { Toaster } from "@tensamin/ui/sonner";
|
||||
|
||||
export default function Layout(props: { children: ReactNode }) {
|
||||
return (
|
||||
<>
|
||||
<Toaster />
|
||||
<Storage>
|
||||
<LegalWrapper>
|
||||
<Crypto>{props.children}</Crypto>
|
||||
</LegalWrapper>
|
||||
</Storage>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import Form from "@/components/screens/login/form";
|
||||
import { Button } from "@tensamin/ui/button";
|
||||
import { Link } from "@tanstack/react-router";
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<div className="w-full h-full flex flex-col gap-10 items-center justify-center">
|
||||
<Form />
|
||||
<div className="flex">
|
||||
<Link to="/signup">
|
||||
<Button variant="outline">Sign up</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
export default function Page() {
|
||||
return <div>Signup Page</div>;
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
|
||||
"target": "ES2022",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "ESNext",
|
||||
"lib": ["ES2022", "DOM", "DOM.Iterable"],
|
||||
"types": ["vite/client"],
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"moduleDetection": "force",
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"erasableSyntaxOnly": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"noUncheckedSideEffectImports": true,
|
||||
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"files": [],
|
||||
"references": [
|
||||
{ "path": "./tsconfig.app.json" },
|
||||
{ "path": "./tsconfig.node.json" }
|
||||
]
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
||||
"target": "ES2023",
|
||||
"lib": ["ES2023"],
|
||||
"module": "ESNext",
|
||||
"types": ["node"],
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"moduleDetection": "force",
|
||||
"noEmit": true,
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"erasableSyntaxOnly": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"noUncheckedSideEffectImports": true
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
import { defineConfig } from "vite";
|
||||
import react from "@vitejs/plugin-react";
|
||||
import tsconfigPaths from "vite-tsconfig-paths";
|
||||
import tailwindcss from "@tailwindcss/vite";
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react(), tsconfigPaths(), tailwindcss()],
|
||||
worker: {
|
||||
format: "es",
|
||||
},
|
||||
});
|
||||
Loading…
Reference in a new issue