This commit is contained in:
Possible
2025-02-28 20:42:24 +01:00
parent de3a3a8ce4
commit ff0b919d62
932 changed files with 127824 additions and 4703 deletions
-3
View File
@@ -1,3 +0,0 @@
{
"template": "bolt-vite-react-ts"
}
-8
View File
@@ -1,8 +0,0 @@
For all designs I ask you to make, have them be beautiful, not cookie cutter. Make webpages that are fully featured and worthy for production.
By default, this template supports JSX syntax with Tailwind CSS classes, React hooks, and Lucide React for icons. Do not install other packages for UI themes, icons, etc unless absolutely necessary or I request them.
Use icons from lucide-react for logos.
Use stock photos from unsplash where appropriate, only valid URLs you know exist. Do not download the images, only link to them in image tags.
+6 -3
View File
@@ -1,3 +1,4 @@
# Logs # Logs
logs logs
*.log *.log
@@ -8,10 +9,11 @@ pnpm-debug.log*
lerna-debug.log* lerna-debug.log*
node_modules node_modules
dist dev-dist
dist-ssr
*.local
*.local
release
config.php
# Editor directories and files # Editor directories and files
.vscode/* .vscode/*
!.vscode/extensions.json !.vscode/extensions.json
@@ -22,3 +24,4 @@ dist-ssr
*.njsproj *.njsproj
*.sln *.sln
*.sw? *.sw?
+5
View File
@@ -0,0 +1,5 @@
{
"tabWidth": 2,
"useTabs": false
}
View File
+218
View File
@@ -0,0 +1,218 @@
$typesContent = @'
export type PlatformType = "ANDROID" | "IOS";
export interface ComponentNode {
id: string;
name: string;
type: string;
icon?: string;
order?: number;
props: ComponentProps;
children?: ComponentNode[];
pageId?: {
id: string;
name: string;
};
}
export interface ComponentProps {
identifier: string;
developer_notes?: string;
api?: string;
state?: string;
api_action?: string;
className?: string;
dataVariable?: string;
}
export interface GlobalState {
leftPanel: ComponentNode[];
middlePanel: ComponentNode[];
rightPanel: ComponentNode | null;
selectedComponent: number;
rightComponentId: string;
selectedPageComponent: string;
copiedComponent: ComponentNode | null;
copiedPage: ComponentNode[];
selectedPageId: SelectedPageId;
disabledComponent: boolean;
}
export interface SelectedPageId {
id: string;
name: string;
}
'@
if (-not (Test-Path ".\src\types\global.ts")) {
New-Item -Path ".\src\types" -ItemType Directory -Force
Set-Content -Path ".\src\types\global.ts" -Value $typesContent -NoNewline
}
$patterns = @(
# Pattern 1: Add interface for components without props
@{
'Match' = '(?<!interface\s+\w+Props\s*{[\s\S]*?}\s*\n\s*)(?<!type\s+\w+Props\s*=\s*{[\s\S]*?}\s*\n\s*)const\s+(\w+)\s*=\s*\(\s*\)\s*=>'
'Replace' = "interface `$1Props {}`n`nconst `$1: React.FC<`$1Props> = () =>"
},
# Pattern 2: Add interface for components with destructured props
@{
'Match' = '(?<!interface\s+\w+Props\s*{[\s\S]*?}\s*\n\s*)(?<!type\s+\w+Props\s*=\s*{[\s\S]*?}\s*\n\s*)const\s+(\w+)\s*=\s*\(\s*{\s*([^}]*)\s*}\s*\)\s*=>'
'Replace' = {
param($matches)
$componentName = $matches[1]
$propsText = $matches[2]
$props = $propsText -split ',\s*' | Where-Object { $_ -match '\S' } | ForEach-Object {
$prop = $_ -replace '=.*$', '' -replace '//.*$', '' -replace '\s+$', '' -replace '^\s+', ''
if ($prop -match 'children') {
" $prop: ReactNode;"
}
elseif ($prop -match 'type') {
" $prop: PlatformType;"
}
elseif ($prop -match 'dispatch') {
" $prop: React.Dispatch<any>;"
}
elseif ($prop -match 'state') {
" $prop: GlobalState;"
}
elseif ($prop -match 'ref') {
" $prop?: React.RefObject<any>;"
}
elseif ($prop -match 'style') {
" $prop?: React.CSSProperties;"
}
elseif ($prop -match 'className') {
" $prop?: string;"
}
elseif ($prop -match 'onClick|onSubmit|onChange|onBlur|onFocus') {
" $prop?: (event: any) => void;"
}
elseif ($prop -match 'component') {
" $prop?: ComponentNode;"
}
elseif ($prop -match 'components|leftPanel|middlePanel') {
" $prop?: ComponentNode[];"
}
elseif ($prop -match 'componentId') {
" $prop?: string;"
}
elseif ($prop -match '\[\]$') {
" $prop?: ${prop};"
}
else {
" $prop?: any;"
}
}
$propsInterface = $props -join "`n"
@"
import { PlatformType, ComponentNode, GlobalState } from '@/types/global';
interface ${componentName}Props {
$propsInterface
}
const $componentName: React.FC<${componentName}Props> = ({
$propsText
}) =>
"@
}
},
# Pattern 3: Add React.FC type to memo wrapped components
@{
'Match' = 'export\s+default\s+memo\((\w+)\)'
'Replace' = 'export default memo($1) as React.FC<$1Props>'
},
# Pattern 4: Add return type to useEffect
@{
'Match' = 'useEffect\(\(\)\s*=>'
'Replace' = 'useEffect((): void =>'
},
# Pattern 5: Add type for state variables
@{
'Match' = 'useState\(([^)]+)\)'
'Replace' = {
param($matches)
$initialValue = $matches[1].Trim()
if ($initialValue -match '^\[\s*\]\s*$') {
'useState<ComponentNode[]>([])'
}
elseif ($initialValue -match '^\{\s*\}\s*$') {
'useState<Record<string, any>>({})'
}
elseif ($initialValue -match '^".*"$') {
'useState<string>(' + $initialValue + ')'
}
elseif ($initialValue -match '^\d+(\.\d+)?$') {
'useState<number>(' + $initialValue + ')'
}
elseif ($initialValue -match '^(true|false)$') {
'useState<boolean>(' + $initialValue + ')'
}
elseif ($initialValue -match '^null$') {
'useState<ComponentNode | null>(null)'
}
elseif ($initialValue -match '^undefined$') {
'useState<undefined>(undefined)'
}
else {
'useState<any>(' + $initialValue + ')'
}
}
}
)
$srcPath = ".\src"
$files = Get-ChildItem -Path $srcPath -Recurse -Include "*.tsx"
foreach ($file in $files) {
$content = Get-Content $file.FullName -Raw
$modified = $false
# Add necessary React imports if not present
$reactImports = @()
if (-not ($content -match '\bFC\b')) {
$reactImports += "FC"
}
if (-not ($content -match '\bReactNode\b')) {
$reactImports += "ReactNode"
}
if (-not ($content -match '\bCSSProperties\b') -and $content -match 'style\s*[?:]') {
$reactImports += "CSSProperties"
}
if ($reactImports.Count -gt 0) {
if ($content -match 'import\s+React,\s*{([^}]*?)}\s+from\s+[''"]react[''"]') {
$existingImports = $matches[1]
$newImports = ($reactImports | Where-Object { $existingImports -notmatch "\b$_\b" }) -join ", "
if ($newImports) {
$content = $content -replace 'import\s+React,\s*{([^}]*?)}\s+from\s+[''"]react[''"]', "import React, { `$1, $newImports } from 'react'"
$modified = $true
}
}
elseif ($content -match 'import\s+React\s+from\s+[''"]react[''"]') {
$content = $content -replace 'import\s+React\s+from\s+[''"]react[''"]', "import React, { $($reactImports -join ', ') } from 'react'"
$modified = $true
}
}
foreach ($pattern in $patterns) {
if ($content -match $pattern.Match) {
if ($pattern.Replace -is [scriptblock]) {
$content = [regex]::Replace($content, $pattern.Match, $pattern.Replace)
}
else {
$content = $content -replace $pattern.Match, $pattern.Replace
}
$modified = $true
}
}
if ($modified) {
Write-Host "Adding types to: $($file.FullName)"
$content | Set-Content $file.FullName -NoNewline
}
}
Write-Host "Done adding types to components and pages."
+26
View File
@@ -0,0 +1,26 @@
[core]
repositoryformatversion = 0
filemode = false
bare = false
logallrefupdates = true
symlinks = false
ignorecase = true
[remote "origin"]
url = http://23.29.118.76:3000/mkdlabs/baas_wireframe.git
fetch = +refs/heads/*:refs/remotes/origin/*
[branch "master"]
remote = origin
merge = refs/heads/master
vscode-merge-base = origin/master
[branch "wireframe"]
vscode-merge-base = master
[remote "origin2"]
url = https://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@github.com/manaknightdev/baas_wireframe.git/
fetch = +refs/heads/*:refs/remotes/origin2/*
[branch "revert"]
vscode-merge-base = origin/master
[branch "pws"]
vscode-merge-base = origin/master
[remote "git-origin"]
url = https://github.com/mytechpassport/wireframetool.git
fetch = +refs/heads/*:refs/remotes/git-origin/*
-83
View File
@@ -1,83 +0,0 @@
#!/bin/bash
# Exit on any error
set -e
echo "🚀 Starting deployment process..."
# Configuration
DEPLOY_PATH="/var/www/wireframev5.manaknightdigital.com"
NGINX_CONFIG="/etc/nginx/sites-available/wireframev5.manaknightdigital.com"
# Build the application
echo "📦 Building application..."
npm install
npm run build
# Ensure deploy directory exists
echo "📁 Setting up deployment directory..."
sudo mkdir -p $DEPLOY_PATH
# Copy build files to deployment directory
echo "📋 Copying files to deployment directory..."
sudo cp -r dist/* $DEPLOY_PATH/
# Set proper permissions
echo "🔒 Setting permissions..."
sudo chown -R www-data:www-data $DEPLOY_PATH
sudo chmod -R 755 $DEPLOY_PATH
# Create Nginx configuration if it doesn't exist
if [ ! -f "$NGINX_CONFIG" ]; then
echo "📝 Creating Nginx configuration..."
sudo tee $NGINX_CONFIG > /dev/null <<EOF
server {
listen 80;
server_name wireframev5.manaknightdigital.com;
root $DEPLOY_PATH;
index index.html;
location / {
try_files \$uri \$uri/ /index.html;
}
# Add security headers
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
# Enable gzip compression
gzip on;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
}
EOF
# Create symlink to enable the site
sudo ln -s $NGINX_CONFIG /etc/nginx/sites-enabled/
fi
# Test Nginx configuration
echo "🔍 Testing Nginx configuration..."
sudo nginx -t
# Reload Nginx to apply changes
echo "🔄 Reloading Nginx..."
sudo systemctl reload nginx
# Setup SSL with Certbot if not already configured
if [ ! -f "/etc/letsencrypt/live/wireframev5.manaknightdigital.com/fullchain.pem" ]; then
echo "🔒 Setting up SSL with Let's Encrypt..."
sudo certbot --nginx \
--non-interactive \
--agree-tos \
--redirect \
--staple-ocsp \
--must-staple \
--email ryan@manaknight.com \
-d wireframev5.manaknightdigital.com
# Reload Nginx again after SSL configuration
sudo systemctl reload nginx
fi
echo "✅ Deployment completed successfully!"
-28
View File
@@ -1,28 +0,0 @@
import js from '@eslint/js';
import globals from 'globals';
import reactHooks from 'eslint-plugin-react-hooks';
import reactRefresh from 'eslint-plugin-react-refresh';
import tseslint from 'typescript-eslint';
export default tseslint.config(
{ ignores: ['dist'] },
{
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ['**/*.{ts,tsx}'],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
plugins: {
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
},
rules: {
...reactHooks.configs.recommended.rules,
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
}
);
+274
View File
@@ -0,0 +1,274 @@
const { exec } = require("child_process");
const getNonNullValue = (value) => {
if (value != "") {
return value;
} else {
return undefined;
}
};
const commandConfigMap = {
init: {
requireArgument: false,
requirements: {
arguments: [],
message: "",
},
action() {
return [null, "git init"];
},
},
branch: {
requireArgument: true,
requirements: {
arguments: ["branch name"],
message: "branch=<branch name> \n eg. branch=pws",
},
action(value) {
return [null, `git branch ${value}`];
},
},
checkout: {
requireArgument: true,
requirements: {
arguments: ["branch name"],
message: "checkout=<branch name> \n eg. checkout=pws",
},
action(value) {
return [null, `git checkout ${value}`];
},
},
merge: {
requireArgument: true,
requirements: {
arguments: ["branch name"],
message: "merge=<branch name> \n eg. merge=pws",
},
action(value) {
return [null, `git merge ${value}`];
},
},
"add-remote": {
requireArgument: true,
requirements: {
arguments: ["remote name", "remote url"],
message:
'add-remote=<remote name> <remote url> \n eg. add-remote="remotename https://github.com/username/reponame.git"',
},
action(remoteName, remoteUrl) {
return [null, `git remote add ${remoteName} ${remoteUrl}`];
},
},
"rm-remote": {
requireArgument: true,
requirements: {
arguments: ["remote name"],
message: "rm-remote=<remote name> \n eg. rm-remote=pws",
},
action(remoteName) {
return [null, `git remote remove ${remoteName}`];
},
},
add: {
requireArgument: true,
requirements: {
arguments: ["file path"],
message: "add=<file path> \n eg. add=.",
},
action(filePath) {
return [null, `git add ${filePath}`];
},
},
commit: {
requireArgument: true,
requirements: {
arguments: ["commit message"],
message: 'commit=<commit message> \n eg. commit="commit message"',
},
action(commitMessage) {
return [null, `git commit -m "${commitMessage}"`];
},
},
pull: {
requireArgument: false,
requirements: {
arguments: ["remote name", "branch name"],
message: 'pull=<remote name> <branch name> \n eg. pull="origin main"',
},
action(remoteName = null, branchName = null) {
if (getNonNullValue(remoteName) && !getNonNullValue(branchName)) {
return [`${this.requirements.message} : branch name is missing`, null];
}
if (!getNonNullValue(remoteName) && getNonNullValue(branchName)) {
return [`${this.requirements.message} : remote name is missing`, null];
}
return [
null,
`git pull ${remoteName ? `${remoteName}` : ""} ${
branchName ? `${branchName}` : ""
}`,
];
},
},
push: {
requireArgument: false,
requirements: {
arguments: ["remote name", "branch name"],
message: 'push=<remote name> <branch name> \n eg. push="origin main"',
},
action(remoteName = null, branchName = null) {
if (getNonNullValue(remoteName) && !getNonNullValue(branchName)) {
return [`${this.requirements.message} : branch name is missing`, null];
}
if (!getNonNullValue(remoteName) && getNonNullValue(branchName)) {
return [`${this.requirements.message} : remote name is missing`, null];
}
return [
null,
`git push ${remoteName ? `${remoteName}` : ""} ${
branchName ? `${branchName}` : ""
}`,
];
},
},
};
// const allowedCommands = [
// "init",
// "branch",
// "checkout",
// "add-remote",
// "rm-remote",
// "add",
// "commit",
// "pull",
// "push",
// ];
const computeCommand = (commandConfig, values) => {
const arguments =
commandConfig?.requirements?.arguments?.length > 1
? values
: [values?.join(" ")];
const [error, command] = commandConfig?.action(...arguments);
if (error) {
return [error, null];
}
return [null, command];
};
const runCommands = (commands, i) => {
return new Promise((resolve, reject) => {
return commandProcess(commands, i, resolve, reject);
});
};
const commandProcess = (commands, i, resolve, reject) => {
if (i >= commands.length) {
return resolve([null, "All commands executed successfully"]);
}
const command = commands[i];
exec(command, (error, stdout, stderr) => {
console.log(`\n$Git >> ${command}`);
if (!error) {
console.log(`$Git >> ${command} command output: ${stdout}`);
commandProcess(commands, i + 1, resolve, reject);
} else {
console.error(`$Git >> Error executing Git command: ${stderr}`);
}
});
};
const argvs = process.argv.splice(2);
const startGitProcess = async () => {
return new Promise(async (resolve, reject) => {
let commands = [];
for (const commandEntry of argvs) {
const [key, value] = commandEntry.split("=");
const commandConfig = commandConfigMap[key];
const values = value?.trim()?.replace(/\s+/g, " ")?.split(" ");
// console.log("values >>", values);
if (!commandConfig) {
return reject(`Command ${key} is not recognised as internal command`);
}
if (commandConfig.requireArgument) {
if (!value) {
return reject(
`Argument is required: ${commandConfig.requirements.message}`
);
}
if (commandConfig.requirements.arguments.length > 1) {
if (values.length !== commandConfig.requirements.arguments.length) {
return reject(
`Invalid number of arguments: ${commandConfig.requirements.message}`
);
}
}
}
const [error, command] = computeCommand(commandConfig, values);
if (error) {
return reject(error);
}
commands = commands.concat(command);
}
// console.log("$Git >> commands:", commands);
if (!commands?.length) {
return reject("No command to execute");
}
const [error, message] = await runCommands(commands, 0);
if (error) {
return reject(error);
}
return resolve(message);
});
};
const main = async () => {
try {
const result = await startGitProcess();
console.log("\n$Git >>", result);
} catch (error) {
console.error("\n$Git >> Error:", error);
}
};
main();
// git checkout master && git pull origin master && yarn build && git add . && git commit -m "Build Master" && git push origin master && git checkout wireframe && git merge master && git push origin wireframe
// const operations = argvs.map((argv) => argv.split("=")[0]?.toLowerCase())
// const allowedCommands = Object.keys(commandConfigMap);
// const commandValidation = operations.map((command) => {
// if (!allowedCommands.includes(command.trim())) {
// return {
// command,
// isValid: false,
// };
// }
// return {
// command,
// isValid: true,
// };
// });
// const invalidCommands = commandValidation.filter((command) => !command.isValid);
// if (invalidCommands.length) {
// const errorMessage = invalidCommands
// .map((command) => `${command.command} is not recognised as internal command`)
// .join(", ");
// return [errorMessage, null];
// }
// "commit:script": "node git-script add=. commit="Update" push="origin pws" checkout=master merge=pws push="origin master" checkout=pws"
+35 -5
View File
@@ -1,13 +1,43 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/png" href="/src/favicon.png" /> <link
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> rel="icon"
<title>Wireframe V5</title> type="image/png"
href="/icons/maskable-icon-512x512.png"
/>
<meta
name="viewport"
content="width=device-width, initial-scale=1.0"
/>
<title>Wireframe Tool | Manaknight Digital</title>
<!-- <script>window.global = window;</script>
<meta http-equiv="Content-Security-Policy"
content="script-src 'sha256-pQY0fuQAnnVQH5nQfjo80rzGkQzeN3JeAtAJ+1KcD4k=' 'self' blob: https://cdnjs.cloudflare.com;"> -->
<!-- <meta http-equiv="Content-Security-Policy"
content="script-src 'sha256-/AO8vAagk08SqUGxY96ci/dGyTDsuoetPOJYMn7sc+E=' 'self' blob:"> -->
<!-- Hotjar Tracking Code for Site 5128711 (name missing) -->
<script>
(function(h,o,t,j,a,r){
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
h._hjSettings={hjid:5128711,hjsv:6};
a=o.getElementsByTagName('head')[0];
r=o.createElement('script');r.async=1;
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
a.appendChild(r);
})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
</script>
</head> </head>
<body> <body style="width:100% !important;">
<div id="root"></div> <div id="root"></div>
<script type="module" src="/src/main.tsx"></script> <!-- <div id="portal"></div> -->
<script
type="module"
src="/src/index.tsx"
></script>
</body> </body>
</html> </html>
+16
View File
@@ -0,0 +1,16 @@
{
"compilerOptions": {
"jsx": "react",
"baseUrl": ".",
"paths": {
"Components/*": ["src/components/*"],
"Pages/*": ["src/pages/*"],
"Utils/*": ["src/utils/*"],
"Assets/*": ["src/assets/*"],
"Context/*": ["src/context/*"],
"Routes/*": ["src/routes/*"],
"Hooks/*": ["src/hooks/*"],
"Src/*": ["src/*"]
}
}
}
+4
View File
@@ -0,0 +1,4 @@
[[redirects]]
from = "/*"
to = "/"
status = 200
-4051
View File
File diff suppressed because it is too large Load Diff
+136 -22
View File
@@ -1,33 +1,147 @@
{ {
"name": "vite-react-typescript-starter", "name": "adminportal",
"private": true, "private": true,
"version": "0.0.0", "version": "0.0.0",
"type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build", "preinstall": "npm install --force",
"lint": "eslint .", "tw": "npx tailwindcss -i ./src/index.css -o ./src/output.css --watch",
"preview": "vite preview" "build": "tsc && vite build",
"typecheck": "tsc --noEmit",
"preview": "vite preview",
"generate-pwa-assets": "pwa-assets-generator --preset minimal public/mkd_logo.png",
"commit": "git add . && git commit -m \"Update | test fixes\" && git pull && git push origin android",
"push": "yarn build && yarn commit:script",
"commit:script": "node git-script add,commit,pull,push message=\"UPDATE | merge wireframe \" origin=master"
}, },
"dependencies": { "dependencies": {
"lucide-react": "^0.344.0", "@craftjs/core": "^0.2.0-beta.11",
"react": "^18.3.1", "@fontsource/inter": "^5.0.15",
"react-dom": "^18.3.1" "@fontsource/roboto-mono": "^5.0.16",
"@fortawesome/fontawesome-svg-core": "^6.4.0",
"@fortawesome/free-brands-svg-icons": "^6.4.0",
"@fortawesome/free-regular-svg-icons": "^6.4.0",
"@fortawesome/free-solid-svg-icons": "^6.4.0",
"@fortawesome/react-fontawesome": "^0.2.0",
"@fullcalendar/core": "^5.11.3",
"@fullcalendar/daygrid": "^5.11.3",
"@fullcalendar/interaction": "^5.11.3",
"@fullcalendar/list": "^5.11.3",
"@fullcalendar/react": "^5.11.2",
"@fullcalendar/timegrid": "^5.11.3",
"@headlessui/react": "^1.7.14",
"@heroicons/react": "^2.0.18",
"@hookform/resolvers": "^3.1.0",
"@hotjar/browser": "^1.0.9",
"@mantine/core": "^6.0.19",
"@mantine/hooks": "^6.0.19",
"@react-google-maps/api": "^2.19.2",
"@stripe/react-stripe-js": "^2.1.0",
"@stripe/stripe-js": "^1.52.1",
"@tailwindcss/forms": "^0.5.3",
"@tippyjs/react": "^4.2.6",
"@types/react-toggle": "^4.0.5",
"@uppy/core": "^3.7.1",
"@uppy/dashboard": "^3.4.1",
"@uppy/drag-drop": "^3.0.2",
"@uppy/facebook": "^3.1.3",
"@uppy/file-input": "^3.0.3",
"@uppy/golden-retriever": "^3.1.0",
"@uppy/google-drive": "^3.1.1",
"@uppy/image-editor": "^2.1.2",
"@uppy/instagram": "^3.1.3",
"@uppy/onedrive": "^3.1.1",
"@uppy/progress-bar": "^3.0.3",
"@uppy/react": "^3.1.2",
"@uppy/tus": "^3.4.0",
"@uppy/webcam": "^3.3.1",
"@uppy/xhr-upload": "^3.5.0",
"ace-builds": "^1.4.12",
"apexcharts": "^3.40.0",
"axios": "^1.5.0",
"bootstrap": "^5.2.3",
"codemirror": "^5.65.16",
"file-saver": "^2.0.5",
"framer-motion": "^10.16.4",
"fullcalendar": "^5.11.3",
"html-to-image": "^1.11.11",
"jszip": "^3.10.1",
"lucide-react": "^0.475.0",
"moment": "^2.29.4",
"openai": "^4.24.1",
"papaparse": "^5.4.1",
"pdfjs-dist": "^3.4.120",
"pluralize": "^8.0.0",
"pretty-rating-react": "^2.2.0",
"qr-scanner": "^1.4.2",
"qrcode": "^1.5.3",
"react": "^18.2.0",
"react-ace": "^10.1.0",
"react-addons-update": "^15.6.3",
"react-apexcharts": "^1.4.0",
"react-calendar": "^4.2.1",
"react-codemirror2": "^7.3.0",
"react-contenteditable": "^3.3.7",
"react-dnd": "^10.0.2",
"react-dnd-html5-backend": "^16.0.1",
"react-dom": "^18.2.0",
"react-google-maps": "^9.4.5",
"react-hook-form": "^7.46.1",
"react-icons": "^4.11.0",
"react-input-emoji": "^5.4.1",
"react-loading-skeleton": "^3.3.1",
"react-modal": "^3.16.1",
"react-modern-calendar-datepicker": "^3.1.6",
"react-outside-click-handler": "^1.3.0",
"react-pdf": "^7.7.0",
"react-quill": "^2.0.0",
"react-router": "^6.15.0",
"react-router-dom": "^6.11.1",
"react-select": "^5.8.0",
"react-speech-recognition": "^3.10.0",
"react-spinners": "^0.13.8",
"react-timeago": "^7.2.0",
"react-toggle": "^4.1.3",
"react-tooltip": "^5.25.2",
"redux": "^4.2.1",
"regenerator-runtime": "^0.14.1",
"slick-carousel": "^1.8.1",
"swiper": "^9.3.1",
"tw-elements": "^1.0.0-beta2",
"twilio-video": "^2.27.0",
"uppy": "^3.20.0",
"use-debounce": "^9.0.4",
"uuid": "^9.0.1",
"xlsx": "^0.18.5",
"yup": "^1.2.0"
}, },
"devDependencies": { "devDependencies": {
"@eslint/js": "^9.9.1", "@types/node": "^22.13.1",
"@types/react": "^18.3.5", "@types/prettier": "^3.0.0",
"@types/react-dom": "^18.3.0", "@types/react": "^18.3.18",
"@vitejs/plugin-react": "^4.3.1", "@types/react-dom": "^18.3.5",
"autoprefixer": "^10.4.18", "@typescript-eslint/eslint-plugin": "^8.24.0",
"eslint": "^9.9.1", "@typescript-eslint/parser": "^8.24.0",
"eslint-plugin-react-hooks": "^5.1.0-rc.0", "@vite-pwa/assets-generator": "^0.0.8",
"eslint-plugin-react-refresh": "^0.4.11", "@vitejs/plugin-react": "^4.0.0",
"globals": "^15.9.0", "@vitejs/plugin-react-refresh": "^1.3.6",
"postcss": "^8.4.35", "@vitejs/plugin-react-swc": "^3.8.0",
"tailwindcss": "^3.4.1", "autoprefixer": "^10.4.14",
"typescript": "^5.5.3", "eslint": "^8.40.0",
"typescript-eslint": "^8.3.0", "eslint-config-react-app": "^7.0.1",
"vite": "^5.4.2" "eslint-plugin-react": "^7.32.2",
"eslint-plugin-react-hooks": "^4.6.0",
"husky": "^8.0.3",
"lint-staged": "^13.2.2",
"postcss": "^8.4.23",
"prettier": "^2.8.8",
"prettier-plugin-tailwindcss": "^0.2.8",
"tailwindcss": "^3.3.2",
"ts-node": "^10.9.2",
"typescript": "^5.7.3",
"vite": "^4.3.5",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-eslint": "^1.8.1",
"vite-plugin-pwa": "^0.16.4"
} }
} }
+28118
View File
File diff suppressed because it is too large Load Diff
+1 -1
View File
@@ -1,4 +1,4 @@
export default { module.exports = {
plugins: { plugins: {
tailwindcss: {}, tailwindcss: {},
autoprefixer: {}, autoprefixer: {},
+1
View File
@@ -0,0 +1 @@
/* /index.html 200
+1
View File
@@ -0,0 +1 @@
/* /index.html 200
Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

+6
View File
@@ -0,0 +1,6 @@
export { default as AppTouchIconPath } from "./apple-touch-icon-180x180.png";
export { default as FavIconPath } from "./favicon.ico";
export { default as MaskableIconPath } from "./maskable-icon-512x512.png";
export { default as Pwa64x64IconPath } from "./pwa-64x64.png";
export { default as Pwa192x192IconPath } from "./pwa-192x192.png";
export { default as Pwa512x512IconPath } from "./pwa-512x512.png";

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 842 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 702 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 615 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 367 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 212 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

+11
View File
@@ -0,0 +1,11 @@
@import "tailwindcss";
@layer theme, base, components, utilities;
@import "tailwindcss/theme" layer(theme);
@import "tailwindcss/utilities" layer(utilities);
/* @config "../tailwind.config.js"; */
@theme {
--color-primaryBlue: #4f46e5;
--color-primary-light: #4f46e550;
}
+35 -103
View File
@@ -1,113 +1,45 @@
import React, { useState } from 'react'; import { AuthProvider } from "@/context/Auth";
import { Sparkles } from 'lucide-react'; import { GlobalProvider } from "@/context/Global";
import { ImageUpload } from './components/ImageUpload'; // rcovery
import { CharacterSelect } from './components/CharacterSelect'; import Main from "@/routes/Routes";
import { Preview } from './components/Preview'; import "@uppy/core/dist/style.css";
import { Character, TransformedImage } from './types'; import "@uppy/dashboard/dist/style.css";
import { BrowserRouter as Router } from "react-router-dom";
import "react-loading-skeleton/dist/skeleton.css";
import { loadStripe } from "@stripe/stripe-js";
import { Elements } from "@stripe/react-stripe-js";
function App() { import "@fontsource/inter"; // Defaults to weight 400
const [selectedImage, setSelectedImage] = useState<File | null>(null); import "@fontsource/roboto-mono"; // Defaults to weight 400
const [selectedCharacter, setSelectedCharacter] = useState<Character | null>(null); import { ErrorBoundary } from "@/components/ErrorBoundary";
const [transformedImage, setTransformedImage] = useState<TransformedImage | null>(null);
const [isLoading, setIsLoading] = useState(false);
const handleImageSelect = (file: File) => { import Hotjar from "@hotjar/browser";
setSelectedImage(file); import { LazyLoad } from "@/components/LazyLoad";
setTransformedImage(null);
};
const handleCharacterSelect = (character: Character) => { const siteId = 5128711;
setSelectedCharacter(character); const hotjarVersion = 6;
};
const handleTransform = async () => { Hotjar.init(siteId, hotjarVersion);
if (!selectedImage || !selectedCharacter) return;
setIsLoading(true); const stripePromise = loadStripe(
"pk_test_51Ll5ukBgOlWo0lDUrBhA2W7EX2MwUH9AR5Y3KQoujf7PTQagZAJylWP1UOFbtH4UwxoufZbInwehQppWAq53kmNC00UIKSmebO"
// Simulate transformation with a delay );
setTimeout(() => {
const fakeTransformed: TransformedImage = {
original: URL.createObjectURL(selectedImage),
transformed: selectedCharacter.image,
character: selectedCharacter,
timestamp: new Date()
};
setTransformedImage(fakeTransformed);
setIsLoading(false);
}, 2000);
};
function App(): JSX.Element {
return ( return (
<div className="min-h-screen bg-gray-50"> <LazyLoad brand>
{/* Header */} <AuthProvider>
<header className="bg-white shadow-sm"> <GlobalProvider>
<div className="max-w-7xl mx-auto px-4 py-4 sm:px-6 lg:px-8"> <ErrorBoundary fallback={<div>Error</div>}>
<div className="flex items-center justify-between"> <Router>
<div className="flex items-center"> <Elements stripe={stripePromise}>
<Sparkles className="h-8 w-8 text-blue-500" /> <Main />
<h1 className="ml-2 text-2xl font-bold text-gray-900"> </Elements>
Naruto Character Generator </Router>
</h1> </ErrorBoundary>
</div> </GlobalProvider>
</div> </AuthProvider>
</div> </LazyLoad>
</header>
{/* Main Content */}
<main className="max-w-7xl mx-auto px-4 py-8 sm:px-6 lg:px-8">
<div className="space-y-8">
{/* Step 1: Upload Image */}
<section>
<h2 className="text-lg font-semibold text-gray-900 mb-4">
1. Upload Your Photo
</h2>
<ImageUpload onImageSelect={handleImageSelect} />
</section>
{/* Step 2: Select Character */}
{selectedImage && (
<section>
<h2 className="text-lg font-semibold text-gray-900 mb-4">
2. Choose Your Character
</h2>
<CharacterSelect
selectedCharacter={selectedCharacter}
onSelect={handleCharacterSelect}
/>
</section>
)}
{/* Transform Button */}
{selectedImage && selectedCharacter && (
<section className="text-center">
<button
onClick={handleTransform}
disabled={isLoading}
className={`
px-8 py-3 rounded-full text-white font-medium
${isLoading
? 'bg-gray-400 cursor-not-allowed'
: 'bg-blue-500 hover:bg-blue-600'
}
transition-colors
`}
>
{isLoading ? 'Transforming...' : 'Transform Image'}
</button>
</section>
)}
{/* Preview */}
{transformedImage && (
<section>
<Preview transformedImage={transformedImage} />
</section>
)}
</div>
</main>
</div>
); );
} }
File diff suppressed because it is too large Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.

After

Width:  |  Height:  |  Size: 441 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

+8
View File
@@ -0,0 +1,8 @@
export { default as LoginBg } from "./login-bg.jpg";
export { default as LoginBgNew } from "./login-new-bg.png";
export { default as EmptyPageImg } from "./empty-page.png";
export { default as MapView } from "./mapview.png";
export { default as ScannerCode } from "./scannercode.png";
export { default as NoDbConfigIllustration } from "./no-db-config.png";
export { default as DbSyncedGif } from "./db-synced.gif";
export { default as MKDLOGO } from "./mkd_logo.png";
Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 669 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 190 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 220 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

+27
View File
@@ -0,0 +1,27 @@
import React from "react";
const AlertCircle = ({ className = "", stroke = "#334564" }) => {
return (
<svg
className={`${className}`}
width="16"
height="17"
viewBox="0 0 16 17"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g id="alert-circle">
<path
id="Icon"
d="M7.9987 5.8335V8.50016M7.9987 11.1668H8.00536M14.6654 8.50016C14.6654 12.1821 11.6806 15.1668 7.9987 15.1668C4.3168 15.1668 1.33203 12.1821 1.33203 8.50016C1.33203 4.81826 4.3168 1.8335 7.9987 1.8335C11.6806 1.8335 14.6654 4.81826 14.6654 8.50016Z"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</g>
</svg>
);
};
export default AlertCircle;
+9
View File
@@ -0,0 +1,9 @@
import React from "react";
const AudioFileIcon = ({ className = "", fill = "#4f46e5", onClick = () => { } }) => {
return (
<svg className={className} onClick={onClick} xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill={fill} viewBox="0 0 256 256"><path d="M152,180a40.55,40.55,0,0,1-20,34.91A8,8,0,0,1,124,201.09a24.49,24.49,0,0,0,0-42.18A8,8,0,0,1,132,145.09,40.55,40.55,0,0,1,152,180ZM99.06,128.61a8,8,0,0,0-8.72,1.73L68.69,152H48a8,8,0,0,0-8,8v40a8,8,0,0,0,8,8H68.69l21.65,21.66A8,8,0,0,0,104,224V136A8,8,0,0,0,99.06,128.61ZM216,88V216a16,16,0,0,1-16,16H168a8,8,0,0,1,0-16h32V96H152a8,8,0,0,1-8-8V40H56v80a8,8,0,0,1-16,0V40A16,16,0,0,1,56,24h96a8,8,0,0,1,5.66,2.34l56,56A8,8,0,0,1,216,88Zm-56-8h28.69L160,51.31Z"></path></svg>
);
};
export default AudioFileIcon;
+102
View File
@@ -0,0 +1,102 @@
interface CalendarIconProps {
onClick?: () => void;
className?: string;
fill?: string;
stroke?: string;
pathFill?: string;
}
const CalendarIcon = ({
onClick,
className,
fill = "none",
stroke = "#1F1D1A",
pathFill = "none",
}: CalendarIconProps) => (
<svg
onClick={onClick && onClick}
className={className}
width="18"
height="18"
viewBox="0 0 18 18"
fill={fill}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M6 1.5V3.75"
stroke={stroke}
strokeWidth="1.125"
strokeMiterlimit="10"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M12 1.5V3.75"
stroke={stroke}
strokeWidth="1.125"
strokeMiterlimit="10"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M2.625 6.8175H15.375"
stroke={stroke}
strokeWidth="1.125"
strokeMiterlimit="10"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M15.75 6.375V12.75C15.75 15 14.625 16.5 12 16.5H6C3.375 16.5 2.25 15 2.25 12.75V6.375C2.25 4.125 3.375 2.625 6 2.625H12C14.625 2.625 15.75 4.125 15.75 6.375Z"
stroke={stroke}
strokeWidth="1.125"
strokeMiterlimit="10"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M11.7693 10.275H11.7761"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M11.7693 12.525H11.7761"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M8.99588 10.275H9.00262"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M8.99588 12.525H9.00262"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M6.22244 10.275H6.22918"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M6.22244 12.525H6.22918"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
export default CalendarIcon;
+17
View File
@@ -0,0 +1,17 @@
import React from 'react';
const CaptureSpatialIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path d="M9.27277 1.15563C9.72294 0.896692 10.2768 0.896692 10.727 1.15563L14.0417 3.06223L7.08205 7.0804V2.41572L9.27277 1.15563Z" fill={fill} />
<path d="M5.83205 3.13472L2.6811 4.94713C2.22874 5.20733 1.94989 5.68941 1.94989 6.21126V8.9293L5.83205 11.1707V3.13472Z" fill={fill} />
<path d="M1.94989 10.3727V13.7889C1.94989 14.3107 2.22874 14.7928 2.6811 15.053L5.06487 16.4241L8.74811 14.2976L1.94989 10.3727Z" fill={fill} />
<path d="M6.3172 17.1445L9.27277 18.8445C9.72294 19.1035 10.2768 19.1035 10.727 18.8445L12.9154 17.5858V13.335L6.3172 17.1445Z" fill={fill} />
<path d="M14.1654 16.8668L17.3187 15.053C17.771 14.7928 18.0499 14.3107 18.0499 13.7889V11.4889L14.1654 9.24617V16.8668Z" fill={fill} />
<path d="M18.0499 10.0455V6.21126C18.0499 5.68941 17.771 5.20733 17.3187 4.94713L15.2941 3.78257L11.2481 6.1185L18.0499 10.0455Z" fill={fill} />
<path d="M9.99811 13.5759L7.08205 11.8924V8.52377L9.99811 6.84019L12.9154 8.52448V11.8916L9.99811 13.5759Z" fill={fill} />
</svg>
);
};
export default CaptureSpatialIcon;
+22
View File
@@ -0,0 +1,22 @@
import React from "react";
export const CaretLeft = ({ className = "" }) => {
return (
<svg
className={`${className}`}
width="8"
height="14"
viewBox="0 0 8 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7 13L1 7L7 1"
stroke="black"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
};
+18
View File
@@ -0,0 +1,18 @@
export const CheckIcon = () => (
<>
<svg
width="15"
height="14"
viewBox="0 0 15 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M14.6929 0.394753C15.0272 0.63933 15.0999 1.1086 14.8553 1.4429L6.07592 13.4429C5.95542 13.6076 5.77301 13.7161 5.57076 13.7433C5.36852 13.7706 5.1639 13.7142 5.00411 13.5873L0.283519 9.83731C-0.040813 9.57966 -0.0948719 9.10787 0.162775 8.78354C0.420421 8.45921 0.892208 8.40515 1.21654 8.6628L5.3261 11.9274L13.6447 0.557204C13.8893 0.222907 14.3586 0.150175 14.6929 0.394753Z"
fill="#6366F1"
/>
</svg>
</>
);
+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8 10.5L12 14.5L16 10.5" stroke="#6E7C87"/>
</svg>

After

Width:  |  Height:  |  Size: 156 B

+28
View File
@@ -0,0 +1,28 @@
import React from "react";
const ChevronUpIcon = ({ className = "", stroke = "black", onClick = () => { } }) => {
return (
<svg
className={`${className}`}
onClick={onClick}
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g id="chevron-up">
<path
id="Icon"
d="M18 15L12 9L6 15"
stroke={stroke}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
</g>
</svg>
);
};
export default ChevronUpIcon;
+20
View File
@@ -0,0 +1,20 @@
import React from "react";
export const CloseIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg
className={`${className}`}
onClick={onClick}
width="20"
height="20"
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M19.4059 16.6337C20.198 17.4257 20.198 18.6139 19.4059 19.4059C19.0099 19.802 18.5149 20 18.0198 20C17.5248 20 17.0297 19.802 16.6337 19.4059L10 12.7723L3.36634 19.4059C2.9703 19.802 2.47525 20 1.9802 20C1.48515 20 0.990099 19.802 0.594059 19.4059C-0.19802 18.6139 -0.19802 17.4257 0.594059 16.6337L7.22772 10L0.594059 3.36634C-0.19802 2.57426 -0.19802 1.38614 0.594059 0.594059C1.38614 -0.19802 2.57426 -0.19802 3.36634 0.594059L10 7.22772L16.6337 0.594059C17.4257 -0.19802 18.6139 -0.19802 19.4059 0.594059C20.198 1.38614 20.198 2.57426 19.4059 3.36634L12.7723 10L19.4059 16.6337Z"
fill={fill}
/>
</svg>
);
};
+34
View File
@@ -0,0 +1,34 @@
import React from "react";
const ControlIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg
className={`${className}`}
onClick={onClick}
xmlns="http://www.w3.org/2000/svg"
width="18"
height="18"
viewBox="0 0 18 18"
fill="none"
>
<path
d="M7.125 1.5C6.50368 1.5 6 2.00368 6 2.625V4.8295C6 5.12787 6.11853 5.41402 6.3295 5.625L8.33709 7.63258C8.7032 7.9987 9.2968 7.9987 9.66291 7.63258L11.6705 5.625C11.8815 5.41402 12 5.12787 12 4.8295V2.625C12 2.00368 11.4963 1.5 10.875 1.5H7.125Z"
fill={fill}
/>
<path
d="M16.5 7.125C16.5 6.50368 15.9963 6 15.375 6H13.1705C12.8721 6 12.586 6.11853 12.375 6.3295L10.3674 8.33709C10.0013 8.7032 10.0013 9.2968 10.3674 9.66291L12.375 11.6705C12.586 11.8815 12.8721 12 13.1705 12H15.375C15.9963 12 16.5 11.4963 16.5 10.875V7.125Z"
fill={fill}
/>
<path
d="M10.875 16.5C11.4963 16.5 12 15.9963 12 15.375V13.1705C12 12.8721 11.8815 12.586 11.6705 12.375L9.66291 10.3674C9.2968 10.0013 8.7032 10.0013 8.33709 10.3674L6.3295 12.375C6.11853 12.586 6 12.8721 6 13.1705V15.375C6 15.9963 6.50368 16.5 7.125 16.5H10.875Z"
fill={fill}
/>
<path
d="M1.5 10.875C1.5 11.4963 2.00368 12 2.625 12H4.8295C5.12787 12 5.41402 11.8815 5.625 11.6705L7.63258 9.66291C7.9987 9.2968 7.9987 8.7032 7.63258 8.33709L5.625 6.3295C5.41402 6.11853 5.12787 6 4.8295 6H2.625C2.00368 6 1.5 6.50368 1.5 7.125V10.875Z"
fill={fill}
/>
</svg>
);
};
export default ControlIcon;
+16
View File
@@ -0,0 +1,16 @@
import React from "react";
export const CopyIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<g clipPath="url(#clip0_1405_8594)">
<path d="M13.3332 13.3332V15.6665C13.3332 16.5999 13.3332 17.0666 13.1515 17.4232C12.9917 17.7368 12.7368 17.9917 12.4232 18.1515C12.0666 18.3332 11.5999 18.3332 10.6665 18.3332H4.33317C3.39975 18.3332 2.93304 18.3332 2.57652 18.1515C2.26292 17.9917 2.00795 17.7368 1.84816 17.4232C1.6665 17.0666 1.6665 16.5999 1.6665 15.6665V9.33317C1.6665 8.39975 1.6665 7.93304 1.84816 7.57652C2.00795 7.26292 2.26292 7.00795 2.57652 6.84816C2.93304 6.6665 3.39975 6.6665 4.33317 6.6665H6.6665M9.33317 13.3332H15.6665C16.5999 13.3332 17.0666 13.3332 17.4232 13.1515C17.7368 12.9917 17.9917 12.7368 18.1515 12.4232C18.3332 12.0666 18.3332 11.5999 18.3332 10.6665V4.33317C18.3332 3.39975 18.3332 2.93304 18.1515 2.57652C17.9917 2.26292 17.7368 2.00795 17.4232 1.84816C17.0666 1.6665 16.5999 1.6665 15.6665 1.6665H9.33317C8.39975 1.6665 7.93304 1.6665 7.57652 1.84816C7.26292 2.00795 7.00795 2.26292 6.84816 2.57652C6.6665 2.93304 6.6665 3.39975 6.6665 4.33317V10.6665C6.6665 11.5999 6.6665 12.0666 6.84816 12.4232C7.00795 12.7368 7.26292 12.9917 7.57652 13.1515C7.93304 13.3332 8.39975 13.3332 9.33317 13.3332Z" stroke="#A8A8A8" stroke-width="1.5" strokeLinecap="round" strokeLinejoin="round" />
</g>
<defs>
<clipPath id="clip0_1405_8594">
<rect width="20" height="20" fill="white" />
</clipPath>
</defs>
</svg>
);
};
+10
View File
@@ -0,0 +1,10 @@
import React from 'react'
export const DangerIcon = ( { className } ) => {
return (
<svg className={ `${ className }` } width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fillRule="evenodd" clipRule="evenodd" d="M40 80C62.1333 80 80 62.1333 80 40C80 17.8667 62.1333 0 40 0C17.8667 0 0 17.8667 0 40C0 62.1333 17.8667 80 40 80ZM36.1932 46.9993V18.1818H43.9169V46.9993H36.1932ZM44.3697 54.4567C44.3697 55.6108 43.9879 56.5607 43.2244 57.3065C42.4432 58.0522 41.3867 58.4251 40.055 58.4251C38.7411 58.4251 37.6935 58.0522 36.9123 57.3065C36.131 56.5607 35.7404 55.6108 35.7404 54.4567C35.7404 53.2848 36.1399 52.326 36.9389 51.5803C37.7202 50.8345 38.7589 50.4616 40.055 50.4616C41.3512 50.4616 42.3988 50.8345 43.1978 51.5803C43.979 52.326 44.3697 53.2848 44.3697 54.4567Z" fill="#CF2A2A" />
</svg>
)
}
+9
View File
@@ -0,0 +1,9 @@
import React from "react";
const DatabaseIcon = ({ className = "", fill = "#6f6f6f", onClick = () => { } }) => {
return (
<svg className={className} onClick={onClick} xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill={fill} viewBox="0 0 256 256"><path d="M128,24C74.17,24,32,48.6,32,80v96c0,31.4,42.17,56,96,56s96-24.6,96-56V80C224,48.6,181.83,24,128,24Zm80,104c0,9.62-7.88,19.43-21.61,26.92C170.93,163.35,150.19,168,128,168s-42.93-4.65-58.39-13.08C55.88,147.43,48,137.62,48,128V111.36c17.06,15,46.23,24.64,80,24.64s62.94-9.68,80-24.64Zm-21.61,74.92C170.93,211.35,150.19,216,128,216s-42.93-4.65-58.39-13.08C55.88,195.43,48,185.62,48,176V159.36c17.06,15,46.23,24.64,80,24.64s62.94-9.68,80-24.64V176C208,185.62,200.12,195.43,186.39,202.92Z"></path></svg>
)
};
export default DatabaseIcon;
+11
View File
@@ -0,0 +1,11 @@
import React from 'react';
const DownloadIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path d="M17.5 12.5V13.5C17.5 14.9001 17.5 15.6002 17.2275 16.135C16.9878 16.6054 16.6054 16.9878 16.135 17.2275C15.6002 17.5 14.9001 17.5 13.5 17.5H6.5C5.09987 17.5 4.3998 17.5 3.86502 17.2275C3.39462 16.9878 3.01217 16.6054 2.77248 16.135C2.5 15.6002 2.5 14.9001 2.5 13.5V12.5M14.1667 8.33333L10 12.5M10 12.5L5.83333 8.33333M10 12.5V2.5" stroke="#A8A8A8" stroke-width="1.5" strokeLinecap="round" strokeLinejoin="round" />
</svg>
);
};
export default DownloadIcon;
+26
View File
@@ -0,0 +1,26 @@
import React from "react";
const EditIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg
className={`${className}`}
onClick={onClick}
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 20 20"
fill="none"
>
<path
d="M13.1355 2.43886C13.705 1.86934 14.6284 1.86934 15.1979 2.43885L16.7277 3.96868C17.2972 4.53819 17.2972 5.46156 16.7277 6.03107L5.68604 17.0727C5.41255 17.3462 5.04162 17.4999 4.65484 17.4999H2.29169C1.94651 17.4999 1.66669 17.2201 1.66669 16.8749V14.5117C1.66669 14.1249 1.82033 13.754 2.09382 13.4805L13.1355 2.43886Z"
fill={fill}
/>
<path
d="M17.9086 14.527C17.6474 14.3015 17.2529 14.3302 17.0272 14.5912L17.0218 14.5974C17.016 14.6038 17.0063 14.6145 16.9929 14.6289C16.966 14.6577 16.9246 14.7009 16.8705 14.7536C16.7616 14.8597 16.6051 15.0011 16.4158 15.1414C16.0191 15.4354 15.5626 15.662 15.1384 15.662C14.6955 15.662 14.27 15.4518 13.6815 15.1394L13.6246 15.1091C13.1021 14.8313 12.4244 14.4709 11.6555 14.4709C10.1719 14.4709 9.30596 15.1795 8.50384 16.0293C8.26691 16.2804 8.27834 16.6759 8.52936 16.9129C8.78038 17.1498 9.17595 17.1384 9.41288 16.8873C10.1272 16.1306 10.6846 15.7209 11.6555 15.7209C12.0857 15.7209 12.5031 15.9291 13.0954 16.2435L13.1398 16.267C13.6676 16.5475 14.3535 16.912 15.1384 16.912C15.9642 16.912 16.6885 16.4951 17.1601 16.1456C17.405 15.9642 17.6045 15.7838 17.7431 15.6486C17.8128 15.5807 17.868 15.5233 17.9068 15.4817C17.9262 15.4609 17.9416 15.444 17.9527 15.4316L17.9661 15.4164L17.9704 15.4116L17.9719 15.4098L17.973 15.4086C17.973 15.4086 17.973 15.4086 17.5 15L17.973 15.4086C18.1986 15.1473 18.1698 14.7527 17.9086 14.527Z"
fill={fill}
/>
</svg>
);
};
export default EditIcon;
+9
View File
@@ -0,0 +1,9 @@
import React from "react";
const FileAudioIcon = ({ className = "", fill = "#6f6f6f", onClick = () => { } }) => {
return (
<svg className={className} xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill={fill} viewBox="0 0 256 256"><path d="M152,180a40.55,40.55,0,0,1-20,34.91A8,8,0,0,1,124,201.09a24.49,24.49,0,0,0,0-42.18A8,8,0,0,1,132,145.09,40.55,40.55,0,0,1,152,180ZM99.06,128.61a8,8,0,0,0-8.72,1.73L68.69,152H48a8,8,0,0,0-8,8v40a8,8,0,0,0,8,8H68.69l21.65,21.66A8,8,0,0,0,104,224V136A8,8,0,0,0,99.06,128.61ZM216,88V216a16,16,0,0,1-16,16H168a8,8,0,0,1,0-16h32V96H152a8,8,0,0,1-8-8V40H56v80a8,8,0,0,1-16,0V40A16,16,0,0,1,56,24h96a8,8,0,0,1,5.66,2.34l56,56A8,8,0,0,1,216,88Zm-56-8h28.69L160,51.31Z"></path></svg>
)
};
export default FileAudioIcon;
+12
View File
@@ -0,0 +1,12 @@
import React from 'react';
const FileLineIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path fillRule="evenodd" clipRule="evenodd" d="M9.99998 1.66675H4.79165C3.98623 1.66675 3.33331 2.31967 3.33331 3.12508V16.8751C3.33331 17.6805 3.98623 18.3334 4.79165 18.3334H15.2083C16.0137 18.3334 16.6666 17.6805 16.6666 16.8751V8.33342H11.4583C10.6529 8.33342 9.99998 7.6805 9.99998 6.87508V1.66675ZM6.66665 11.8751C6.66665 11.5299 6.94647 11.2501 7.29165 11.2501H10.2083C10.5535 11.2501 10.8333 11.5299 10.8333 11.8751C10.8333 12.2203 10.5535 12.5001 10.2083 12.5001H7.29165C6.94647 12.5001 6.66665 12.2203 6.66665 11.8751ZM7.29165 14.5834C6.94647 14.5834 6.66665 14.8632 6.66665 15.2084C6.66665 15.5536 6.94647 15.8334 7.29165 15.8334H12.7083C13.0535 15.8334 13.3333 15.5536 13.3333 15.2084C13.3333 14.8632 13.0535 14.5834 12.7083 14.5834H7.29165Z" fill={fill} />
<path d="M16.2971 7.08342C16.2786 7.06258 16.2593 7.04223 16.2395 7.0224L11.311 2.09388C11.2912 2.07405 11.2708 2.05484 11.25 2.03628V6.87508C11.25 6.99014 11.3433 7.08342 11.4583 7.08342H16.2971Z" fill={fill} />
</svg>
);
};
export default FileLineIcon;
+11
View File
@@ -0,0 +1,11 @@
import React from 'react';
const FileMemoIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path fillRule="evenodd" clipRule="evenodd" d="M3.33331 3.12508C3.33331 2.31967 3.98623 1.66675 4.79165 1.66675H15.2083C16.0137 1.66675 16.6666 2.31967 16.6666 3.12508V16.8751C16.6666 17.6805 16.0137 18.3334 15.2083 18.3334H4.79165C3.98623 18.3334 3.33331 17.6805 3.33331 16.8751V3.12508ZM7.29165 5.00008C6.94647 5.00008 6.66665 5.2799 6.66665 5.62508C6.66665 5.97026 6.94647 6.25008 7.29165 6.25008H12.7083C13.0535 6.25008 13.3333 5.97026 13.3333 5.62508C13.3333 5.2799 13.0535 5.00008 12.7083 5.00008H7.29165ZM7.29165 8.33342C6.94647 8.33342 6.66665 8.61324 6.66665 8.95842C6.66665 9.30359 6.94647 9.58342 7.29165 9.58342H12.7083C13.0535 9.58342 13.3333 9.30359 13.3333 8.95842C13.3333 8.61324 13.0535 8.33342 12.7083 8.33342H7.29165ZM7.29165 11.6667C6.94647 11.6667 6.66665 11.9466 6.66665 12.2917C6.66665 12.6369 6.94647 12.9167 7.29165 12.9167H9.37498C9.72016 12.9167 9.99998 12.6369 9.99998 12.2917C9.99998 11.9466 9.72016 11.6667 9.37498 11.6667H7.29165Z" fill={fill} />
</svg>
);
};
export default FileMemoIcon;
+12
View File
@@ -0,0 +1,12 @@
import React from 'react';
const FileVerticalLineIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path fillRule="evenodd" clipRule="evenodd" d="M4.79165 1.66675H9.99998V6.87508C9.99998 7.6805 10.6529 8.33342 11.4583 8.33342H16.6666V16.8751C16.6666 17.6805 16.0137 18.3334 15.2083 18.3334H4.79165C3.98623 18.3334 3.33331 17.6805 3.33331 16.8751V3.12508C3.33331 2.31967 3.98623 1.66675 4.79165 1.66675ZM7.70831 13.9584C7.70831 13.6132 7.42849 13.3334 7.08331 13.3334C6.73813 13.3334 6.45831 13.6132 6.45831 13.9584V15.2084C6.45831 15.5536 6.73813 15.8334 7.08331 15.8334C7.42849 15.8334 7.70831 15.5536 7.70831 15.2084V13.9584ZM9.99998 10.8334C10.3452 10.8334 10.625 11.1132 10.625 11.4584V15.2084C10.625 15.5536 10.3452 15.8334 9.99998 15.8334C9.6548 15.8334 9.37498 15.5536 9.37498 15.2084V11.4584C9.37498 11.1132 9.6548 10.8334 9.99998 10.8334ZM13.5416 13.1251C13.5416 12.7799 13.2618 12.5001 12.9166 12.5001C12.5715 12.5001 12.2916 12.7799 12.2916 13.1251V15.2084C12.2916 15.5536 12.5715 15.8334 12.9166 15.8334C13.2618 15.8334 13.5416 15.5536 13.5416 15.2084V13.1251Z" fill={fill} />
<path d="M16.2395 7.0224C16.2593 7.04223 16.2786 7.06258 16.2971 7.08342H11.4583C11.3433 7.08342 11.25 6.99014 11.25 6.87508V2.03628C11.2708 2.05484 11.2912 2.07405 11.311 2.09388L16.2395 7.0224Z" fill={fill} />
</svg>
);
};
export default FileVerticalLineIcon;
+11
View File
@@ -0,0 +1,11 @@
import React from 'react';
const FolderIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path d="M3.12502 2.5C2.31961 2.5 1.66669 3.15292 1.66669 3.95833V15.2083C1.66669 16.0137 2.31961 16.6667 3.12502 16.6667H16.875C17.6804 16.6667 18.3334 16.0137 18.3334 15.2083V6.45833C18.3334 5.65292 17.6804 5 16.875 5H10.446C10.3764 5 10.3113 4.96519 10.2727 4.90723L9.10077 3.1494C8.8303 2.74369 8.37497 2.5 7.88737 2.5H3.12502Z" fill={fill} />
</svg>
);
};
export default FolderIcon;
+11
View File
@@ -0,0 +1,11 @@
import React from 'react';
const GitIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path d="M12.5 15C12.5 16.3807 13.6193 17.5 15 17.5C16.3807 17.5 17.5 16.3807 17.5 15C17.5 13.6193 16.3807 12.5 15 12.5C13.6193 12.5 12.5 13.6193 12.5 15ZM12.5 15C10.5109 15 8.60322 14.2098 7.1967 12.8033C5.79018 11.3968 5 9.48912 5 7.5M5 7.5C6.38071 7.5 7.5 6.38071 7.5 5C7.5 3.61929 6.38071 2.5 5 2.5C3.61929 2.5 2.5 3.61929 2.5 5C2.5 6.38071 3.61929 7.5 5 7.5ZM5 7.5V17.5" stroke="#A8A8A8" stroke-width="1.5" strokeLinecap="round" strokeLinejoin="round" />
</svg>
);
};
export default GitIcon;
+9
View File
@@ -0,0 +1,9 @@
import React from "react";
const HamburgerMenuIcon = ({ className = "", fill = "#6f6f6f", onClick = () => { } }) => {
return (
<svg className={className} xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill={fill} viewBox="0 0 256 256"><path d="M224,128a8,8,0,0,1-8,8H40a8,8,0,0,1,0-16H216A8,8,0,0,1,224,128ZM40,72H216a8,8,0,0,0,0-16H40a8,8,0,0,0,0,16ZM216,184H40a8,8,0,0,0,0,16H216a8,8,0,0,0,0-16Z"></path></svg>
);
};
export default HamburgerMenuIcon;
+39
View File
@@ -0,0 +1,39 @@
import React from "react";
const KebabIcon = ({ className = "", stroke = "#8D8D8D", onClick = () => { } }) => {
return (
<svg
className={`${className}`}
onClick={onClick}
xmlns="http://www.w3.org/2000/svg"
width="18"
height="18"
viewBox="0 0 18 18"
fill="none"
>
<path
d="M9 9.75C9.41421 9.75 9.75 9.41421 9.75 9C9.75 8.58579 9.41421 8.25 9 8.25C8.58579 8.25 8.25 8.58579 8.25 9C8.25 9.41421 8.58579 9.75 9 9.75Z"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M9 4.5C9.41421 4.5 9.75 4.16421 9.75 3.75C9.75 3.33579 9.41421 3 9 3C8.58579 3 8.25 3.33579 8.25 3.75C8.25 4.16421 8.58579 4.5 9 4.5Z"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M9 15C9.41421 15 9.75 14.6642 9.75 14.25C9.75 13.8358 9.41421 13.5 9 13.5C8.58579 13.5 8.25 13.8358 8.25 14.25C8.25 14.6642 8.58579 15 9 15Z"
stroke={stroke}
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
};
export default KebabIcon;
+9
View File
@@ -0,0 +1,9 @@
import React from 'react'
const LeftBendArrow = ({ className = "", fill = "#6f6f6f", onClick = () => { } }) => {
return (
<svg className={className} onClick={onClick} xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill={fill} viewBox="0 0 256 256"><path d="M232,200a8,8,0,0,1-16,0,88.1,88.1,0,0,0-88-88H88v40a8,8,0,0,1-13.66,5.66l-48-48a8,8,0,0,1,0-11.32l48-48A8,8,0,0,1,88,56V96h40A104.11,104.11,0,0,1,232,200Z"></path></svg>
)
}
export default LeftBendArrow
+59
View File
@@ -0,0 +1,59 @@
import React from "react";
const LoadCheckIcon = ({
className = "",
stroke = "black",
onClick,
title,
icon = "check",
}) => {
const click = () => {
if (onClick) {
onClick();
}
};
return (
<div title={title}>
{icon === "loader" ? (
<svg
className={`animate animate-spin ${className}`}
onClick={click}
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
viewBox="0 0 16 16"
fill="none"
>
<path
d="M1.3335 6.66667C1.3335 6.66667 2.67015 4.84548 3.75605 3.75883C4.84196 2.67218 6.34256 2 8.00016 2C11.3139 2 14.0002 4.68629 14.0002 8C14.0002 11.3137 11.3139 14 8.00016 14C5.26477 14 2.9569 12.1695 2.23467 9.66667M1.3335 6.66667V2.66667M1.3335 6.66667H5.3335"
stroke="#4F46E5"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
) : null}
{icon === "check" ? (
<svg
className={`${className}`}
onClick={click}
xmlns="http://www.w3.org/2000/svg"
width="19"
height="18"
viewBox="0 0 19 18"
fill="none"
>
<path
d="M15.5 4.5L7.25 12.75L3.5 9"
stroke="#059669"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
) : null}
</div>
);
};
export default LoadCheckIcon;
+29
View File
@@ -0,0 +1,29 @@
const NarrowUpArrowIcon = ({
className = "",
stroke = "#717179",
fill = "none",
onClick = () => {},
}) => {
return (
<svg
className={`${className}`}
onClick={onClick}
width="14"
height="18"
viewBox="0 0 14 18"
fill={fill}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7 17V1M7 1L1 7M7 1L13 7"
stroke={stroke}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
};
export default NarrowUpArrowIcon;
+8
View File
@@ -0,0 +1,8 @@
import React from "react";
const PdfFileIcon = ({ className = "", fill = "#6f6f6f", onClick = () => { } }) => {
return (
<svg className={className} onClick={onClick} xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill={fill} viewBox="0 0 256 256"><path d="M48,120H208a8,8,0,0,0,8-8V88a8,8,0,0,0-2.34-5.66l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40v72A8,8,0,0,0,48,120ZM152,44l44,44H152Zm72,108a8,8,0,0,1-8,8H192v16h16a8,8,0,0,1,0,16H192v16a8,8,0,0,1-16,0V152a8,8,0,0,1,8-8h32A8,8,0,0,1,224,152ZM64,144H48a8,8,0,0,0-8,8v56a8,8,0,0,0,16,0v-8h8a28,28,0,0,0,0-56Zm0,40H56V160h8a12,12,0,0,1,0,24Zm64-40H112a8,8,0,0,0-8,8v56a8,8,0,0,0,8,8h16a36,36,0,0,0,0-72Zm0,56h-8V160h8a20,20,0,0,1,0,40Z"></path></svg>);
};
export default PdfFileIcon;
+11
View File
@@ -0,0 +1,11 @@
import React from 'react';
const PlusIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path fillRule="evenodd" clipRule="evenodd" d="M7.9999 2.3999C8.44173 2.3999 8.7999 2.75807 8.7999 3.1999V7.1999H12.7999C13.2417 7.1999 13.5999 7.55807 13.5999 7.9999C13.5999 8.44173 13.2417 8.7999 12.7999 8.7999H8.7999V12.7999C8.7999 13.2417 8.44173 13.5999 7.9999 13.5999C7.55807 13.5999 7.1999 13.2417 7.1999 12.7999V8.7999H3.1999C2.75807 8.7999 2.3999 8.44173 2.3999 7.9999C2.3999 7.55807 2.75807 7.1999 3.1999 7.1999H7.1999V3.1999C7.1999 2.75807 7.55807 2.3999 7.9999 2.3999Z" fill={fill} />
</svg>
);
};
export default PlusIcon;
File diff suppressed because one or more lines are too long
+8
View File
@@ -0,0 +1,8 @@
import React from "react";
const ReactIcon = ({ className = "", fill = "#6f6f6f", stroke = "#6f6f6f", onClick = () => { } }) => {
return (
<svg className={className} onClick={onClick} fill={fill} width="24px" height="24px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" stroke={stroke}><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title>react</title> <path d="M14.313 22.211c0.55 0.025 1.112 0.043 1.681 0.043 0.575 0 1.143-0.012 1.7-0.043-0.557 0.72-1.107 1.357-1.689 1.964l0.008-0.008c-0.579-0.6-1.135-1.238-1.659-1.902l-0.041-0.054zM8.615 21.411c1.083 0.275 2.404 0.509 3.752 0.653l0.131 0.011c0.825 1.133 1.659 2.13 2.554 3.068l-0.011-0.012c-1.311 1.463-3.080 2.491-5.081 2.86l-0.055 0.008c-0.004 0-0.008 0-0.012 0-0.248 0-0.482-0.061-0.687-0.169l0.008 0.004c-0.832-0.475-1.193-2.292-0.912-4.627 0.067-0.575 0.177-1.18 0.312-1.797zM23.398 21.398c0.118 0.474 0.229 1.078 0.308 1.692l0.009 0.086c0.287 2.334-0.067 4.149-0.892 4.634-0.184 0.102-0.404 0.162-0.638 0.162-0.023 0-0.046-0.001-0.069-0.002l0.003 0c-2.053-0.375-3.821-1.396-5.129-2.841l-0.007-0.008c0.879-0.923 1.707-1.918 2.466-2.965l0.058-0.084c1.476-0.154 2.799-0.392 4.088-0.717l-0.197 0.042zM9.784 17.666c0.25 0.49 0.512 0.978 0.8 1.468q0.431 0.731 0.881 1.428c-0.868-0.127-1.706-0.287-2.507-0.482 0.225-0.787 0.507-1.602 0.825-2.416zM22.212 17.641c0.331 0.821 0.612 1.64 0.845 2.434-0.8 0.196-1.645 0.362-2.519 0.487 0.3-0.469 0.6-0.952 0.881-1.447 0.281-0.487 0.544-0.985 0.795-1.475zM7.619 12.292c0.436 1.478 0.904 2.714 1.449 3.906l-0.075-0.182c-0.466 1.005-0.927 2.234-1.305 3.499l-0.052 0.205c-0.706-0.217-1.274-0.43-1.827-0.669l0.115 0.044c-2.164-0.921-3.564-2.132-3.564-3.092s1.4-2.177 3.564-3.094c0.525-0.225 1.1-0.428 1.694-0.617zM24.358 12.287c0.605 0.187 1.18 0.396 1.718 0.622 2.164 0.925 3.564 2.134 3.564 3.094-0.006 0.96-1.406 2.174-3.57 3.093-0.525 0.225-1.1 0.427-1.693 0.616-0.44-1.483-0.908-2.718-1.451-3.912l0.076 0.188c0.464-1.004 0.926-2.233 1.303-3.498l0.053-0.206zM20.53 11.444c0.869 0.129 1.706 0.287 2.507 0.484-0.225 0.79-0.506 1.602-0.825 2.416-0.25-0.487-0.512-0.978-0.8-1.467-0.281-0.49-0.581-0.967-0.881-1.432zM11.458 11.444c-0.3 0.471-0.6 0.953-0.88 1.45-0.281 0.487-0.544 0.977-0.794 1.467-0.331-0.82-0.612-1.637-0.845-2.433 0.8-0.187 1.643-0.354 2.518-0.482zM16 11.126c0.925 0 1.846 0.042 2.752 0.116q0.761 1.091 1.478 2.324 0.697 1.2 1.272 2.432c-0.385 0.819-0.807 1.637-1.266 2.437-0.475 0.825-0.966 1.61-1.475 2.337-0.91 0.079-1.832 0.122-2.762 0.122-0.925 0-1.846-0.044-2.752-0.116-0.507-0.727-1.002-1.505-1.478-2.324q-0.697-1.2-1.272-2.432c0.379-0.821 0.807-1.641 1.266-2.442 0.475-0.825 0.966-1.607 1.475-2.334 0.91-0.080 1.832-0.122 2.762-0.122zM15.981 7.845c0.58 0.6 1.136 1.237 1.659 1.901l0.040 0.053c-0.55-0.025-1.112-0.042-1.681-0.042-0.575 0-1.143 0.012-1.7 0.042 0.556-0.72 1.106-1.357 1.689-1.964l-0.008 0.008zM9.88 4.033c2.053 0.376 3.82 1.397 5.129 2.841l0.007 0.008c-0.879 0.924-1.707 1.919-2.466 2.968l-0.058 0.084c-1.475 0.153-2.798 0.389-4.086 0.714l0.196-0.042c-0.14-0.612-0.244-1.205-0.317-1.774-0.287-2.334 0.067-4.149 0.892-4.632 0.206-0.097 0.447-0.157 0.701-0.165l0.003-0zM22.090 4.008v0.008c0.013-0 0.028-0.001 0.044-0.001 0.239 0 0.464 0.059 0.662 0.163l-0.008-0.004c0.832 0.477 1.193 2.293 0.912 4.629-0.067 0.575-0.177 1.181-0.312 1.799-1.085-0.278-2.406-0.513-3.754-0.656l-0.128-0.011c-0.826-1.134-1.66-2.131-2.555-3.070l0.012 0.012c1.311-1.46 3.077-2.488 5.074-2.859l0.056-0.009zM22.096 2.646c-2.442 0.371-4.556 1.557-6.1 3.268l-0.008 0.009c-1.555-1.71-3.669-2.888-6.051-3.245l-0.056-0.007c-0.013-0-0.029-0-0.045-0-0.491 0-0.952 0.129-1.351 0.355l0.014-0.007c-1.718 0.991-2.103 4.079-1.216 7.954-3.804 1.175-6.278 3.053-6.278 5.032 0 1.987 2.487 3.87 6.302 5.036-0.88 3.89-0.487 6.983 1.235 7.973 0.378 0.217 0.832 0.344 1.315 0.344 0.022 0 0.044-0 0.065-0.001l-0.003 0c2.442-0.371 4.556-1.558 6.1-3.27l0.008-0.009c1.555 1.711 3.669 2.889 6.051 3.246l0.056 0.007c0.015 0 0.034 0 0.052 0 0.488 0 0.947-0.128 1.344-0.351l-0.014 0.007c1.717-0.99 2.103-4.078 1.216-7.954 3.79-1.165 6.264-3.047 6.264-5.029 0-1.987-2.487-3.87-6.302-5.039 0.88-3.886 0.487-6.982-1.235-7.973-0.382-0.219-0.84-0.348-1.328-0.348-0.013 0-0.026 0-0.039 0l0.002-0zM18.787 16.005c0 1.543-1.251 2.794-2.794 2.794s-2.794-1.251-2.794-2.794c0-1.543 1.251-2.794 2.794-2.794 0.772 0 1.47 0.313 1.976 0.818v0c0.506 0.506 0.818 1.204 0.818 1.976 0 0 0 0 0 0v0z"></path> </g></svg>)
};
export default ReactIcon;
+8
View File
@@ -0,0 +1,8 @@
import React from 'react'
const RightBendArrow = ({ className = "", fill = "#6f6f6f", onClick = () => { } }) => {
return (
<svg className={className} onClick={onClick} xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill={fill} viewBox="0 0 256 256"><path d="M229.66,109.66l-48,48A8,8,0,0,1,168,152V112H128a88.1,88.1,0,0,0-88,88,8,8,0,0,1-16,0A104.11,104.11,0,0,1,128,96h40V56a8,8,0,0,1,13.66-5.66l48,48A8,8,0,0,1,229.66,109.66Z"></path></svg>)
}
export default RightBendArrow
+11
View File
@@ -0,0 +1,11 @@
import React from 'react';
const RobotIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path fillRule="evenodd" clipRule="evenodd" d="M10 0.833252C10.3452 0.833252 10.625 1.11307 10.625 1.45825V2.49992H15.1823C15.9877 2.49992 16.6406 3.15284 16.6406 3.95825V10.2083C16.6406 10.7797 16.312 11.2744 15.8333 11.5136V11.616L17.3169 13.0996C17.561 13.3437 17.561 13.7394 17.3169 13.9835C17.0729 14.2276 16.6771 14.2276 16.4331 13.9835L15.7753 13.3258C15.3742 16.1563 12.9413 18.3333 10 18.3333C7.05869 18.3333 4.62582 16.1563 4.22468 13.3258L3.56694 13.9835C3.32286 14.2276 2.92714 14.2276 2.68306 13.9835C2.43898 13.7394 2.43898 13.3437 2.68306 13.0996L4.16667 11.616V11.5136C3.68805 11.2744 3.35938 10.7797 3.35938 10.2083V3.95825C3.35938 3.15284 4.01229 2.49992 4.81771 2.49992H9.375V1.45825C9.375 1.11307 9.65482 0.833252 10 0.833252ZM4.81771 3.74992C4.70265 3.74992 4.60938 3.84319 4.60938 3.95825V10.2083C4.60938 10.3233 4.70265 10.4166 4.81771 10.4166H15.1823C15.2974 10.4166 15.3906 10.3233 15.3906 10.2083V3.95825C15.3906 3.84319 15.2974 3.74992 15.1823 3.74992H4.81771ZM7.29167 5.83325C7.63684 5.83325 7.91667 6.11307 7.91667 6.45825V7.70825C7.91667 8.05343 7.63684 8.33325 7.29167 8.33325C6.94649 8.33325 6.66667 8.05343 6.66667 7.70825V6.45825C6.66667 6.11307 6.94649 5.83325 7.29167 5.83325ZM12.7083 5.83325C13.0535 5.83325 13.3333 6.11307 13.3333 6.45825V7.70825C13.3333 8.05343 13.0535 8.33325 12.7083 8.33325C12.3632 8.33325 12.0833 8.05343 12.0833 7.70825V6.45825C12.0833 6.11307 12.3632 5.83325 12.7083 5.83325Z" fill={fill} />
</svg>
);
};
export default RobotIcon;
+11
View File
@@ -0,0 +1,11 @@
import React from 'react';
const SettingIcon = ({ className = "", fill = "#A8A8A8", onClick = () => { } }) => {
return (
<svg onClick={onClick} className={`${className}`} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path d="M2.5 6.6665L12.5 6.6665M12.5 6.6665C12.5 8.04722 13.6193 9.1665 15 9.1665C16.3807 9.1665 17.5 8.04722 17.5 6.6665C17.5 5.28579 16.3807 4.1665 15 4.1665C13.6193 4.1665 12.5 5.28579 12.5 6.6665ZM7.5 13.3332L17.5 13.3332M7.5 13.3332C7.5 14.7139 6.38071 15.8332 5 15.8332C3.61929 15.8332 2.5 14.7139 2.5 13.3332C2.5 11.9525 3.61929 10.8332 5 10.8332C6.38071 10.8332 7.5 11.9525 7.5 13.3332Z" stroke="#A8A8A8" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
</svg>
);
};
export default SettingIcon;
+20
View File
@@ -0,0 +1,20 @@
import React, { useId } from "react";
import MoonLoader from "react-spinners/MoonLoader";
const override = {
// display: "block",
// margin: "0 auto",
borderColor: "red",
};
export const Spinner = ({ className = "", size = 20, color = "#ffffff" }) => {
const id = useId();
return (
<MoonLoader
color={color}
loading={true}
cssOverride={override}
size={size}
// aria-label="Loading Spinner"
data-testid={id}
/>
);
};

Some files were not shown because too many files have changed in this diff Show More