Skip to content
This repository was archived by the owner on Apr 5, 2024. It is now read-only.

Commit 400a37d

Browse files
qvalentinqvalentin
authored
Feature/be fs api (#26)
* added the be connection * clicking on files works
1 parent 3992dce commit 400a37d

File tree

6 files changed

+57
-15
lines changed

6 files changed

+57
-15
lines changed

‎webapp_frontend/src/background/api/api.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ export const hostname:string =constants.url.API_URL+'/api';
55

66
export const userPath:string='/v1/users';
77

8+
export const filesytemPath:string='/v1/filesystem';
9+
10+
11+
812

913
interface BackendHealthData {
1014
uptimeInSeconds: number;

‎webapp_frontend/src/background/api/auth.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ export const checkForCookie=()=>{
2828
if (refreshTokenCookieValue){
2929
store.dispatch(addRefreshToken(refreshTokenCookieValue))
3030
getAccessTokenWithRefreshToken();
31+
3132
}
3233
store.dispatch(checkedCookies(true))
3334

@@ -88,12 +89,14 @@ export const getAccessTokenWithRefreshToken = () => {
8889

8990
//TODO: also get User data here
9091

92+
9193
})
9294
.catch(((error) => {
9395
store.dispatch(removeTokens()as RemoveTokens);
9496

9597
console.log(error)
9698
//you probably want to notify the user, maybe with a toast or similar
99+
97100
}));
98101

99102
}

‎webapp_frontend/src/background/api/filesystem.ts‎

Lines changed: 26 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,28 @@
11
import {BackendFolderContentsData} from "./filesystemTypes";
2-
2+
import {hostname, filesytemPath} from "./api";
3+
import Axios from "axios";
34

45
export const getFolderContents = (path: string) => new Promise<BackendFolderContentsData>((resolve, reject) => {
6+
7+
8+
let config = {
9+
headers: {
10+
"X-FF-PATH": path
11+
},
12+
};
13+
14+
515
console.log(`[filesytem api] request folder content of ${path}`);
6-
resolve(exampleValue(path))
16+
17+
Axios.get(hostname + filesytemPath + '/contents',config)
18+
.then(response=>resolve(response.data))
19+
.catch(error=>reject(error))
20+
21+
22+
// resolve(exampleValue(path))
723
})
824

25+
/*
926
const exampleValue = (path: string): BackendFolderContentsData => {
1027
if (path === "/") return exampleFileSystem
1128
else if (path === "/fasel") return exampleFileSystem
@@ -48,7 +65,7 @@ const exampleValue = (path: string): BackendFolderContentsData => {
4865
{
4966
"createdByUserId": 1,
5067
"id": 0,
51-
"lastUpdated": 1597177368 ,
68+
"lastUpdated": 1597177368,
5269
"name": "text.txt",
5370
"permissionSet": {
5471
"editableForGroups": [
@@ -82,7 +99,7 @@ const exampleValue = (path: string): BackendFolderContentsData => {
8299
{
83100
"createdByUserId": 2,
84101
"id": 0,
85-
"lastUpdated": 1599147368 ,
102+
"lastUpdated": 1599147368,
86103
"name": "sound.mp3",
87104
"permissionSet": {
88105
"editableForGroups": [
@@ -116,7 +133,7 @@ const exampleValue = (path: string): BackendFolderContentsData => {
116133
{
117134
"createdByUserId": 1,
118135
"id": 0,
119-
"lastUpdated": 1602047368 ,
136+
"lastUpdated": 1602047368,
120137
"name": "movie.mp4",
121138
"permissionSet": {
122139
"editableForGroups": [
@@ -150,7 +167,7 @@ const exampleValue = (path: string): BackendFolderContentsData => {
150167
{
151168
"createdByUserId": 2,
152169
"id": 0,
153-
"lastUpdated": 1599949968 ,
170+
"lastUpdated": 1599949968,
154171
"name": "image.jpg",
155172
"permissionSet": {
156173
"editableForGroups": [
@@ -184,7 +201,7 @@ const exampleValue = (path: string): BackendFolderContentsData => {
184201
{
185202
"createdByUserId": 1313,
186203
"id": 0,
187-
"lastUpdated": 1599992468 ,
204+
"lastUpdated": 1599992468,
188205
"name": "importantFile.md",
189206
"permissionSet": {
190207
"editableForGroups": [
@@ -218,7 +235,7 @@ const exampleValue = (path: string): BackendFolderContentsData => {
218235
{
219236
"createdByUserId": 2,
220237
"id": 0,
221-
"lastUpdated": 1601584968 ,
238+
"lastUpdated": 1601584968,
222239
"name": "likeMe.html",
223240
"permissionSet": {
224241
"editableForGroups": [
@@ -437,4 +454,4 @@ const exampleFileSystem = {
437454
"type": "FOLDER"
438455
}
439456
]
440-
}
457+
}*/

‎webapp_frontend/src/background/redux/reducers/tokens.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export default function (state = initialState, action: TokenActionsTypes) {
3636
case CHECKED_COOKIES: {
3737
return {
3838
refreshToken: state.refreshToken,
39-
accessToken: state.refreshToken,
39+
accessToken: state.accessToken,
4040
checkedCookies: action.payload
4141
};
4242
}

‎webapp_frontend/src/components/pages/filesytem/FileList.tsx‎

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export default function FileList(props: Props): ReactElement {
1818
const [path, setPath] = useState<string>(location.pathname.slice(filesBaseUrl.length) || "/")
1919
const [files, setFiles] = useState<File[] | null>(null)
2020
const [folders, setFolders] = useState<Folder[] | null>(null)
21-
21+
const [error, setError] = useState<string>("");
2222

2323

2424
console.log("[FileList path]" + path)
@@ -30,8 +30,14 @@ export default function FileList(props: Props): ReactElement {
3030
(response: BackendFolderContentsData) => {
3131
setFiles(response.files)
3232
setFolders(response.folders)
33+
setError("")
3334
}
3435
)
36+
.catch(error => {
37+
setError(error.response?.data.message)
38+
setFiles([])
39+
setFolders([])
40+
});
3541

3642
}
3743

@@ -40,6 +46,9 @@ export default function FileList(props: Props): ReactElement {
4046

4147
}, [path, location]);
4248

49+
50+
51+
4352
return (
4453
<Container fluid>
4554
<FilesBreadcrumb path={path} setPath={setPath}/>
@@ -58,6 +67,12 @@ export default function FileList(props: Props): ReactElement {
5867
<hr/>
5968
<Row>
6069

70+
{error ?
71+
<Col className={"text-center"}> {error}</Col> : (!folders && !files) ?
72+
<Col className={"text-center"}> Nothing to see here.</Col> : null
73+
}
74+
75+
6176
{folders?.map((folder: Folder, i: number) => {
6277
return (<FileListFolder key={i.toString()} setPath={setPath} folder={folder}/>)
6378
})}

‎webapp_frontend/src/components/pages/filesytem/FileListItem.tsx‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export default function FileListItem(props: Props): ReactElement {
3838

3939
const FileIcon = (isFolder: boolean, name: string): ReactElement => {
4040
if (isFolder) return <FolderIcon height={ICON_HEIGHT} width={"auto"}
41-
color={"secondary"}/>
41+
color={"secondary"}/>
4242
let positionOfPoint = reverseString(name).indexOf(".");
4343
if (positionOfPoint < 0) return <FileEarmarkIcon height={ICON_HEIGHT} width={"auto"} color={"secondary"}/>
4444

@@ -53,7 +53,8 @@ export default function FileListItem(props: Props): ReactElement {
5353
case ".mp3" :
5454
return <FileEarmarkMusicIcon height={ICON_HEIGHT} width={"auto"} color={"secondary"}/>
5555
case ".md" :
56-
case ".html" : return <FileEarmarkRichtextIcon height={ICON_HEIGHT} width={"auto"} color={"secondary"}/>
56+
case ".html" :
57+
return <FileEarmarkRichtextIcon height={ICON_HEIGHT} width={"auto"} color={"secondary"}/>
5758
default :
5859
return <FileEarmarkIcon height={ICON_HEIGHT} width={"auto"} color={"secondary"}/>
5960
}
@@ -75,8 +76,10 @@ export default function FileListItem(props: Props): ReactElement {
7576
<Col xs={1}>{props.fileListItem.type}</Col>
7677
<Col xs={1}>{FileIcon(props.fileListItem.isFolder, props.fileListItem.name)}</Col>
7778
<Col xs={1}>...</Col>
78-
<Col xs={3}><Link to={`/file${props.fileListItem.path ?? ""}`}
79-
onClick={() => onClick()}>{props.fileListItem.name}</Link></Col>
79+
<Col xs={3}> <Link
80+
to={props.fileListItem.path ? `/file${props.fileListItem.path ?? ""}` : `#${props.fileListItem.name}`}
81+
onClick={onClick}>{props.fileListItem.name}</Link>
82+
</Col>
8083
<Col xs={3}>{props.fileListItem.createdByUserId}</Col>
8184
<Col xs={1}>{getDateAsStringFromTimestamp(props.fileListItem.lastUpdated)}</Col>
8285
<Col xs={1}>{formatBytes(props.fileListItem.size)}</Col>

0 commit comments

Comments
 (0)