Skip to content

Commit 61a3872

Browse files
Maxime-ClltMaxime-Cllt
authored
October update (#2)
* fix and clean up * Rename App name * Updt App Image
1 parent dabd47b commit 61a3872

32 files changed

+170
-54
lines changed

‎app-icon.png

29.5 KB
Loading

‎assets/FileFlowDemo.png

4.63 KB
Loading

‎index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="UTF-8" />
55
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<title>Tauri + React + Typescript</title>
7+
<title>FileFlow</title>
88
</head>
99

1010
<body>

‎public/tauri.svg

-6
This file was deleted.

‎public/vite.svg

-1
This file was deleted.

‎src-tauri/Cargo.lock

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src-tauri/Cargo.toml

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
[package]
2-
name = "Datastorm"
2+
name = "FileFlow"
33
version = "1.0.0"
44
description = "An app to insert CSV data into a database"
5-
authors = ["you"]
5+
authors = ["Maxime-Cllt"]
66
edition = "2021"
77

88
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

‎src-tauri/database_config.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,6 @@
44
"port": "5432",
55
"username": "root",
66
"password": "root",
7-
"db_name": "postgres"
7+
"db_name": "postgres",
8+
"sqlite_file_path": ""
89
}

‎src-tauri/icons/128x128.png

8.56 KB
Loading

‎src-tauri/icons/[email protected]

19.7 KB
Loading

‎src-tauri/icons/32x32.png

1.41 KB
Loading

‎src-tauri/icons/Square107x107Logo.png

6.89 KB
Loading

‎src-tauri/icons/Square142x142Logo.png

9.71 KB
Loading

‎src-tauri/icons/Square150x150Logo.png

10.3 KB
Loading

‎src-tauri/icons/Square284x284Logo.png

21.8 KB
Loading

‎src-tauri/icons/Square30x30Logo.png

1.25 KB
Loading

‎src-tauri/icons/Square310x310Logo.png

24.2 KB
Loading

‎src-tauri/icons/Square44x44Logo.png

2.2 KB
Loading

‎src-tauri/icons/Square71x71Logo.png

4.15 KB
Loading

‎src-tauri/icons/Square89x89Logo.png

5.51 KB
Loading

‎src-tauri/icons/StoreLogo.png

2.61 KB
Loading

‎src-tauri/icons/icon.icns

233 KB
Binary file not shown.

‎src-tauri/icons/icon.ico

-42 KB
Binary file not shown.

‎src-tauri/icons/icon.png

15.4 KB
Loading

‎src-tauri/tauri.conf.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@
66
"distDir": "../dist"
77
},
88
"package": {
9-
"productName": "fileflow",
10-
"version": "0.1.0"
9+
"productName": "FileFlow",
10+
"version": "1.0.0"
1111
},
1212
"tauri": {
1313
"allowlist": {

‎src/App.tsx

+2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
import {BrowserRouter as Router, Route, Routes,} from 'react-router-dom';
22
import Home from './Home';
3+
import AboutComponent from "@/components/fileflowui/About.tsx";
34

45
function App() {
56
return (
67
<Router>
78
<Routes>
89
<Route path="/" element={<Home/>}/>
10+
<Route path="/about" element={<AboutComponent/>}/>
911
</Routes>
1012
</Router>
1113
);

‎src/Home.tsx

+21-23
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import React, {useState} from 'react';
22
import {invoke} from '@tauri-apps/api/tauri';
33
import './Loader.css';
44

5-
65
import {Card, CardContent, CardHeader,} from "@/components/ui/card"
76
import Menu from "@/components/fileflowui/Menu.tsx";
87
import Loader from "@/Loader.tsx";
@@ -14,12 +13,12 @@ import SqliteFormComponent from "@/components/fileflowui/SqliteFormComponent.tsx
1413

1514
const Home: React.FC = () => {
1615

17-
const [dbDriver, setdbDriver] = useState('postgres');
18-
const [dbUrl, setDbUrl] = useState('localhost');
19-
const [port, setPort] = useState('5432');
20-
const [username, setUsername] = useState('root');
21-
const [password, setPassword] = useState('root');
22-
const [dbName, setDbName] = useState('postgres');
16+
const [dbDriver, setdbDriver] = useState('');
17+
const [dbUrl, setDbUrl] = useState('');
18+
const [port, setPort] = useState('');
19+
const [username, setUsername] = useState('');
20+
const [password, setPassword] = useState('');
21+
const [dbName, setDbName] = useState('');
2322
const [tableName, setTableName] = useState('');
2423
const [histoLog, setHistoLog] = useState('Historique des logs');
2524
const [filePath, setFilePath] = useState<string | null>(null);
@@ -30,15 +29,14 @@ const Home: React.FC = () => {
3029
const [sqlite, setSqlite] = useState(false);
3130
const [sqliteFilePath, setSqliteFilePath] = useState('');
3231

33-
3432
const addLog = (message: string) => {
3533
setHistoLog((prev) => `${prev}\n${message}`);
3634
}
3735

3836
const handleConnection = async (e: { preventDefault: () => void; }) => {
3937
e.preventDefault();
4038

41-
if (!dbUrl || !port || !username || !password || !dbName) {
39+
if (!dbUrl || !port || !username) {
4240
addLog('Veuillez remplir tous les champs');
4341
return;
4442
}
@@ -163,13 +161,12 @@ const Home: React.FC = () => {
163161
const response = await invoke('load_database_config');
164162
if (typeof response === "string") {
165163
const dbConfig = JSON.parse(response);
166-
setdbDriver(dbConfig.db_driver.toString());
167-
setDbUrl(dbConfig.db_host.toString());
168-
setPort(dbConfig.port.toString());
169-
setUsername(dbConfig.username.toString());
170-
setPassword(dbConfig.password.toString());
171-
setDbName(dbConfig.db_name.toString());
172-
setTableName(dbConfig.table_name.toString());
164+
setdbDriver(dbConfig.db_driver.toString() ?? "");
165+
setDbUrl(dbConfig.db_host.toString() ?? "");
166+
setPort(dbConfig.port.toString() ?? "");
167+
setUsername(dbConfig.username.toString() ?? "");
168+
setPassword(dbConfig.password.toString() ?? "");
169+
setDbName(dbConfig.db_name.toString() ?? "");
173170

174171
if (dbConfig.sqlite_file_path.toString().length > 0) {
175172
setSqliteFilePath(dbConfig.sqlite_file_path.toString());
@@ -265,15 +262,16 @@ const Home: React.FC = () => {
265262
</div>
266263
}
267264

268-
</CardHeader>
269265

270-
{/* Boutons en bas */}
271-
<ButtonGroupComponent {...{
272-
handleInsert,
273-
handleSubmit: handleConnection,
274-
handleReset
275-
}}/>
266+
{/* Boutons en bas */}
267+
<ButtonGroupComponent {...{
268+
handleInsert,
269+
handleSubmit: handleConnection,
270+
handleReset
271+
}}/>
272+
276273

274+
</CardHeader>
277275
</Card>
278276

279277
{/* TextArea tout en bas */}

‎src/assets/react.svg

-1
This file was deleted.

‎src/components/fileflowui/About.tsx

+95
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
import React from 'react';
2+
import Menu from "@/components/fileflowui/Menu.tsx";
3+
import { Card } from "@/components/ui/card.tsx";
4+
5+
6+
const AboutComponent: React.FC = () => {
7+
8+
const addLog = () => {
9+
return;
10+
}
11+
const saveConfig = async (e: { preventDefault: () => void; }) => {
12+
e.preventDefault();
13+
return;
14+
};
15+
16+
const loadConfig = async (e: { preventDefault: () => void; }) => {
17+
e.preventDefault();
18+
return;
19+
};
20+
21+
return (
22+
<div className="bg-gray-100">
23+
{/* Menu */}
24+
<div className="fixed top-0 w-full bg-white shadow-md z-10">
25+
<Menu addLog={addLog} saveConfig={saveConfig} loadConfig={loadConfig} />
26+
</div>
27+
28+
{/* Hero Section */}
29+
<div className="flex items-center justify-center h-64 bg-gradient-to-r from-blue-600 to-purple-600 text-white">
30+
<h1 className="text-6xl font-bold">FileFlow</h1>
31+
</div>
32+
33+
{/* About Section */}
34+
<div className="flex justify-center align-middle mt-12 px-4">
35+
36+
<div className="w-full max-w-6xl space-y-8">
37+
{/* Description Card */}
38+
<Card className="p-8 shadow-lg bg-white">
39+
<h2 className="text-3xl font-bold text-center mb-4">About FileFlow</h2>
40+
<p className="text-lg text-gray-700 text-center">
41+
FileFlow is a simple tool that allows you to insert data from a CSV file into a database table,
42+
built with Rust and Tauri framework. It's cross-platform and can be used on Windows, MacOS, and Linux.
43+
</p>
44+
</Card>
45+
46+
{/* Features and Usage in Grid */}
47+
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
48+
{/* Features Card */}
49+
<Card className="p-6 shadow-md bg-white">
50+
<h2 className="text-2xl font-semibold mb-4">Features</h2>
51+
<ul className="list-disc list-inside text-gray-700 space-y-2">
52+
<li>Insert data into a new table</li>
53+
<li>Insert data into an existing table</li>
54+
<li>Optimize the type of the columns (VARCHAR(MAX_LENGTH))</li>
55+
<li>From CSV file</li>
56+
<li>No privileges required to insert data</li>
57+
</ul>
58+
</Card>
59+
60+
{/* Usage Card */}
61+
<Card className="p-6 shadow-md bg-white">
62+
<h2 className="text-2xl font-semibold mb-4">Usage</h2>
63+
<ol className="list-decimal list-inside text-gray-700 space-y-2">
64+
<li>Select the CSV file you want to insert into the database</li>
65+
<li>Select the target database</li>
66+
<li>Click on the "Insert" button</li>
67+
<li>Wait for the data to be inserted</li>
68+
<li>Done!</li>
69+
</ol>
70+
</Card>
71+
</div>
72+
73+
{/* Modes of Insertion */}
74+
<Card className="p-6 shadow-md bg-white mb-16">
75+
<h2 className="text-2xl font-semibold mb-4">Modes of Insertion</h2>
76+
<ul className="list-disc list-inside text-gray-700 space-y-2">
77+
<li><strong>Optimized mode:</strong> Inserts data into a new table with optimized column types (VARCHAR(MAX_LENGTH))</li>
78+
<li><strong>Fast mode:</strong> Inserts data into an existing table with columns as defined in the CSV</li>
79+
</ul>
80+
<p className="text-sm text-gray-500 mt-4">
81+
<strong>Note:</strong> Optimized mode may take longer, but ensures better data type management.
82+
</p>
83+
84+
</Card>
85+
86+
87+
<div className={"h-8"}></div>
88+
89+
</div>
90+
</div>
91+
</div>
92+
);
93+
};
94+
95+
export default AboutComponent;

‎src/components/fileflowui/ButtonGroupComponent.tsx

+25-11
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React from 'react';
2-
import {Button} from "@/components/ui/button.tsx";
32
import {Database, Eraser, Upload} from "lucide-react";
43

54
interface ButtonGroupProps {
@@ -10,17 +9,32 @@ interface ButtonGroupProps {
109

1110
const ButtonGroupComponent: React.FC<ButtonGroupProps> = ({handleSubmit, handleInsert, handleReset}) => {
1211
return (
13-
<div className="flex items-center justify-center col-span-2 gap-4 mb-4">
14-
<Button onClick={handleSubmit} className=" mx-auto bg-green-600 hover:bg-green-700">
15-
<Database/>
16-
</Button>
17-
<Button onClick={handleInsert} className=" mx-auto bg-blue-500 hover:bg-blue-600">
18-
<Upload/>
19-
</Button>
20-
<Button onClick={handleReset} className=" mx-auto bg-red-500 hover:bg-red-600">
21-
<Eraser/>
22-
</Button>
12+
<div className="flex items-center justify-center gap-6 mb-6 p-4">
13+
<button
14+
onClick={handleSubmit}
15+
className="flex items-center justify-center bg-green-600 hover:bg-green-700 text-white p-3 rounded-full shadow-lg transition duration-300"
16+
aria-label="Submit to Database"
17+
>
18+
<Database className="w-5 h-5"/>
19+
</button>
20+
21+
<button
22+
onClick={handleInsert}
23+
className="flex items-center justify-center bg-blue-500 hover:bg-blue-600 text-white p-3 rounded-full shadow-lg transition duration-300"
24+
aria-label="Insert Data"
25+
>
26+
<Upload className="w-5 h-5"/>
27+
</button>
28+
29+
<button
30+
onClick={handleReset}
31+
className="flex items-center justify-center bg-red-500 hover:bg-red-600 text-white p-3 rounded-full shadow-lg transition duration-300"
32+
aria-label="Reset"
33+
>
34+
<Eraser className="w-5 h-5"/>
35+
</button>
2336
</div>
37+
2438
);
2539
};
2640

0 commit comments

Comments
 (0)