upload page
This commit is contained in:
parent
23d05febfa
commit
58ede7284c
8 changed files with 96 additions and 40 deletions
7
.idea/discord.xml
generated
Normal file
7
.idea/discord.xml
generated
Normal file
|
@ -0,0 +1,7 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="DiscordProjectSettings">
|
||||
<option name="show" value="PROJECT_FILES" />
|
||||
<option name="description" value="" />
|
||||
</component>
|
||||
</project>
|
11
.idea/workspace.xml
generated
11
.idea/workspace.xml
generated
|
@ -5,9 +5,11 @@
|
|||
</component>
|
||||
<component name="ChangeListManager">
|
||||
<list default="true" id="4cc93404-63bf-4aee-bd04-2b0203a508b3" name="Changes" comment="">
|
||||
<change afterPath="$PROJECT_DIR$/src/app/helpers.tsx" afterDir="false" />
|
||||
<change afterPath="$PROJECT_DIR$/src/app/main.css" afterDir="false" />
|
||||
<change afterPath="$PROJECT_DIR$/src/app/images/upload/page.css" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/next.config.ts" beforeDir="false" afterPath="$PROJECT_DIR$/next.config.ts" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/pnpm-lock.yaml" beforeDir="false" afterPath="$PROJECT_DIR$/pnpm-lock.yaml" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/src/app/images/upload/page.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/images/upload/page.tsx" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/src/app/page.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/page.tsx" afterDir="false" />
|
||||
</list>
|
||||
|
@ -20,6 +22,7 @@
|
|||
<option name="RECENT_TEMPLATES">
|
||||
<list>
|
||||
<option value="TypeScript JSX File" />
|
||||
<option value="TypeScript File" />
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
|
@ -73,7 +76,9 @@
|
|||
<workItem from="1733200504378" duration="23000" />
|
||||
<workItem from="1733232865117" duration="6000" />
|
||||
<workItem from="1733238983600" duration="81000" />
|
||||
<workItem from="1733239451427" duration="4696000" />
|
||||
<workItem from="1733239451427" duration="6396000" />
|
||||
<workItem from="1733250368879" duration="1956000" />
|
||||
<workItem from="1733252479518" duration="1692000" />
|
||||
</task>
|
||||
<servers />
|
||||
</component>
|
||||
|
|
|
@ -1,7 +1,16 @@
|
|||
import type { NextConfig } from "next";
|
||||
import dotenv from 'dotenv';
|
||||
dotenv.config();
|
||||
if (!process.env.API_URL){
|
||||
console.error("no api url provided");
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
|
||||
const nextConfig: NextConfig = {
|
||||
/* config options here */
|
||||
env: {
|
||||
NEXT_PUBLIC_API_URL: process.env.API_URL,
|
||||
}
|
||||
};
|
||||
|
||||
export default nextConfig;
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@radix-ui/themes": "^3.1.6",
|
||||
"dotenv": "^16.4.7",
|
||||
"next": "15.0.3",
|
||||
"react": "19.0.0-rc-66855b96-20241106",
|
||||
"react-dom": "19.0.0-rc-66855b96-20241106"
|
||||
|
|
27
pnpm-lock.yaml
generated
27
pnpm-lock.yaml
generated
|
@ -11,6 +11,9 @@ importers:
|
|||
'@radix-ui/themes':
|
||||
specifier: ^3.1.6
|
||||
version: 3.1.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)
|
||||
dotenv:
|
||||
specifier: ^16.4.7
|
||||
version: 16.4.7
|
||||
next:
|
||||
specifier: 15.0.3
|
||||
version: 15.0.3(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)
|
||||
|
@ -1124,6 +1127,10 @@ packages:
|
|||
resolution: {integrity: sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==}
|
||||
engines: {node: '>=6.0.0'}
|
||||
|
||||
dotenv@16.4.7:
|
||||
resolution: {integrity: sha512-47qPchRCykZC03FhkYAhrvwU4xDBFIj1QPqaarj6mdM/hgUzfPHcpkHJOn3mJAufFeeAxAzeGsr5X0M4k6fLZQ==}
|
||||
engines: {node: '>=12'}
|
||||
|
||||
emoji-regex@9.2.2:
|
||||
resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
|
||||
|
||||
|
@ -3183,6 +3190,8 @@ snapshots:
|
|||
dependencies:
|
||||
esutils: 2.0.3
|
||||
|
||||
dotenv@16.4.7: {}
|
||||
|
||||
emoji-regex@9.2.2: {}
|
||||
|
||||
enhanced-resolve@5.17.1:
|
||||
|
@ -3293,8 +3302,8 @@ snapshots:
|
|||
'@typescript-eslint/parser': 8.17.0(eslint@8.57.1)(typescript@5.7.2)
|
||||
eslint: 8.57.1
|
||||
eslint-import-resolver-node: 0.3.9
|
||||
eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1)
|
||||
eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1)
|
||||
eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1)
|
||||
eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1)
|
||||
eslint-plugin-jsx-a11y: 6.10.2(eslint@8.57.1)
|
||||
eslint-plugin-react: 7.37.2(eslint@8.57.1)
|
||||
eslint-plugin-react-hooks: 5.0.0(eslint@8.57.1)
|
||||
|
@ -3313,37 +3322,37 @@ snapshots:
|
|||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
|
||||
eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1):
|
||||
eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1):
|
||||
dependencies:
|
||||
'@nolyfill/is-core-module': 1.0.39
|
||||
debug: 4.3.7
|
||||
enhanced-resolve: 5.17.1
|
||||
eslint: 8.57.1
|
||||
eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1)
|
||||
eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1)
|
||||
fast-glob: 3.3.2
|
||||
get-tsconfig: 4.8.1
|
||||
is-bun-module: 1.3.0
|
||||
is-glob: 4.0.3
|
||||
optionalDependencies:
|
||||
eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1)
|
||||
eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1)
|
||||
transitivePeerDependencies:
|
||||
- '@typescript-eslint/parser'
|
||||
- eslint-import-resolver-node
|
||||
- eslint-import-resolver-webpack
|
||||
- supports-color
|
||||
|
||||
eslint-module-utils@2.12.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1):
|
||||
eslint-module-utils@2.12.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1):
|
||||
dependencies:
|
||||
debug: 3.2.7
|
||||
optionalDependencies:
|
||||
'@typescript-eslint/parser': 8.17.0(eslint@8.57.1)(typescript@5.7.2)
|
||||
eslint: 8.57.1
|
||||
eslint-import-resolver-node: 0.3.9
|
||||
eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1)
|
||||
eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1)
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
|
||||
eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1):
|
||||
eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1):
|
||||
dependencies:
|
||||
'@rtsao/scc': 1.1.0
|
||||
array-includes: 3.1.8
|
||||
|
@ -3354,7 +3363,7 @@ snapshots:
|
|||
doctrine: 2.1.0
|
||||
eslint: 8.57.1
|
||||
eslint-import-resolver-node: 0.3.9
|
||||
eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1)
|
||||
eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.17.0(eslint@8.57.1)(typescript@5.7.2))(eslint@8.57.1))(eslint@8.57.1))(eslint@8.57.1)
|
||||
hasown: 2.0.2
|
||||
is-core-module: 2.15.1
|
||||
is-glob: 4.0.3
|
||||
|
|
12
src/app/images/upload/page.css
Normal file
12
src/app/images/upload/page.css
Normal file
|
@ -0,0 +1,12 @@
|
|||
.page {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.mainpage {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
|
@ -1,11 +1,15 @@
|
|||
"use client";
|
||||
import "@radix-ui/themes/styles.css";
|
||||
import {useState} from "react";
|
||||
import './page.css'
|
||||
import {getCookie} from "@/app/helpers";
|
||||
import {Button, Theme} from "@radix-ui/themes";
|
||||
|
||||
|
||||
export default function Page() {
|
||||
const API_URL = process.env.NEXT_PUBLIC_API_URL as string;
|
||||
const [file, setFile] = useState(null);
|
||||
const [apiKey, setApiKey] = useState('');
|
||||
const [message, setMessage] = useState('');
|
||||
|
||||
const handleFileChange = (e: any) => {
|
||||
|
@ -21,43 +25,51 @@ export default function Page() {
|
|||
const formData = new FormData();
|
||||
formData.append('file', file);
|
||||
|
||||
let apikey = ""
|
||||
await fetch('http://localhost:7070/api/token', {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
//@ts-expect-error
|
||||
headers: {
|
||||
'Authorization': getCookie("access_token"),
|
||||
}
|
||||
}).then(res => res.json().then(data => {
|
||||
console.log(data)
|
||||
apikey = data.apiToken;
|
||||
}));
|
||||
}).then(res => {
|
||||
res.json().then(data => {
|
||||
setApiKey(data.apiToken);
|
||||
})
|
||||
});
|
||||
console.log(apiKey);
|
||||
await fetch('http://localhost:7070/api/upload', {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
headers: {
|
||||
'Authorization': apiKey,
|
||||
}
|
||||
}).then(async (res) => {
|
||||
if (res.status === 201) {
|
||||
const response = await res.json();
|
||||
setMessage(`${API_URL}/api/file/` + response.id);
|
||||
} else {
|
||||
setMessage('Something went wrong.');
|
||||
}
|
||||
});
|
||||
|
||||
try {
|
||||
await fetch('http://localhost:7070/api/upload', {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
//@ts-expect-error
|
||||
headers: {
|
||||
'Authorization': apikey,
|
||||
}
|
||||
}).then(res => res.json().then(data => console.log(data)));
|
||||
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div style={{padding: '20px', fontFamily: 'Arial, sans-serif'}}>
|
||||
<h2>Upload a File</h2>
|
||||
<input type="file" onChange={handleFileChange}/>
|
||||
<button onClick={handleUpload} style={{marginLeft: '10px'}}>
|
||||
Upload
|
||||
</button>
|
||||
{message && <p>{message}</p>}
|
||||
</div>
|
||||
<Theme appearance="dark">
|
||||
<div className="mainpage">
|
||||
<div className="page">
|
||||
<h2>Upload a File</h2>
|
||||
</div>
|
||||
<div className="page">
|
||||
|
||||
<input type="file" onChange={handleFileChange}/>
|
||||
<Button color="crimson" variant="surface" onClick={handleUpload} style={{marginLeft: '10px'}}>
|
||||
Upload
|
||||
</Button>
|
||||
</div>
|
||||
<div className="page">{message && <p>{message}</p>}</div>
|
||||
</div>
|
||||
</Theme>
|
||||
);
|
||||
|
||||
}
|
|
@ -1,4 +1,5 @@
|
|||
import "./main.css"
|
||||
import 'dotenv/config'
|
||||
import { cookies } from 'next/headers'
|
||||
import "@radix-ui/themes/styles.css";
|
||||
import {Text, Theme} from "@radix-ui/themes";
|
||||
|
|
Loading…
Add table
Reference in a new issue