generated from Luis/nextjs-python-web-template
Compare commits
2 Commits
9b6fc699f2
...
8c77f3fbae
| Author | SHA1 | Date | |
|---|---|---|---|
| 8c77f3fbae | |||
| bc4761e7a2 |
2
.gitignore
vendored
2
.gitignore
vendored
@@ -23,5 +23,3 @@ htmlcov
|
|||||||
# georgs
|
# georgs
|
||||||
pkgs/.vs/
|
pkgs/.vs/
|
||||||
pkgs/clan-cli/.hypothesis/
|
pkgs/clan-cli/.hypothesis/
|
||||||
ui-assets.tar.gz
|
|
||||||
ui-release
|
|
||||||
@@ -24,9 +24,9 @@ For Entity object go to
|
|||||||
- [tests/openapi_client/docs/ResolutionApi.md](tests/openapi_client/docs/ResolutionApi.md)
|
- [tests/openapi_client/docs/ResolutionApi.md](tests/openapi_client/docs/ResolutionApi.md)
|
||||||
- [tests/openapi_client/docs/RepositoriesApi.md](tests/openapi_client/docs/RepositoriesApi.md)
|
- [tests/openapi_client/docs/RepositoriesApi.md](tests/openapi_client/docs/RepositoriesApi.md)
|
||||||
|
|
||||||
# Building a Docker Image if the Backend Changed
|
# Building a Docker Image
|
||||||
|
|
||||||
To build a new docker image when the backend code changed be inside the `pkgs/clan-cli` folder and execute:
|
To build a docker image of the frontend and backend be inside the `pkgs/clan-cli` folder and execute:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
nix build .#clan-docker
|
nix build .#clan-docker
|
||||||
@@ -48,22 +48,7 @@ docker run -p 127.0.0.1:2979:2979 clan-docker:latest
|
|||||||
[flake-module.nix at line 22](flake-module.nix)
|
[flake-module.nix at line 22](flake-module.nix)
|
||||||
- Documentation on `dockerTools.buildImage` you can find here: https://nix.dev/tutorials/nixos/building-and-running-docker-images.html
|
- Documentation on `dockerTools.buildImage` you can find here: https://nix.dev/tutorials/nixos/building-and-running-docker-images.html
|
||||||
|
|
||||||
## Building a Docker Image if the Frontend Changed
|
## Docker build with UI changes
|
||||||
|
|
||||||
To build a new docker image when the frontend code changed you first need
|
|
||||||
to get the `GITLAB_TOKEN` go to [repo access tokens](https://git.tu-berlin.de/internet-of-services-lab/service-aware-network-front-end/-/settings/access_tokens) and generate one. Then execute
|
|
||||||
|
|
||||||
```bash
|
|
||||||
export GITLAB_TOKEN="<your-access-token>"
|
|
||||||
```
|
|
||||||
|
|
||||||
Afterwards you can execute:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
./build_docker.sh
|
|
||||||
```
|
|
||||||
|
|
||||||
### The Script Explained
|
|
||||||
|
|
||||||
If changes to the UI have been made, and you want them to propagate to the docker container edit the file: [../ui/nix/ui-assets.nix](../ui/nix/ui-assets.nix).
|
If changes to the UI have been made, and you want them to propagate to the docker container edit the file: [../ui/nix/ui-assets.nix](../ui/nix/ui-assets.nix).
|
||||||
This is where a release version of the frontend is downloaded and integrated into the cli and the docker build. To do this first execute
|
This is where a release version of the frontend is downloaded and integrated into the cli and the docker build. To do this first execute
|
||||||
@@ -78,7 +63,11 @@ Make a tarball out of it called `ui-assets.tar.gz`
|
|||||||
tar -czvf ui-assets.tar.gz ui-release/lib/node_modules/clan-ui/out/
|
tar -czvf ui-assets.tar.gz ui-release/lib/node_modules/clan-ui/out/
|
||||||
```
|
```
|
||||||
|
|
||||||
Upload ui-assets.tar.gz to gitlab.
|
Upload ui-assets.tar.gz to gitlab. To get the `GITLAB_TOKEN` go to [repo access tokens](https://git.tu-berlin.de/internet-of-services-lab/service-aware-network-front-end/-/settings/access_tokens) and generate one. Then execute
|
||||||
|
|
||||||
|
```bash
|
||||||
|
export GITLAB_TOKEN="<your-access-token>"
|
||||||
|
```
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
curl --header "PRIVATE-TOKEN: $GITLAB_TOKEN" \
|
curl --header "PRIVATE-TOKEN: $GITLAB_TOKEN" \
|
||||||
@@ -114,12 +103,6 @@ nix build .#clan-docker
|
|||||||
|
|
||||||
# Uploading a Docker Image
|
# Uploading a Docker Image
|
||||||
|
|
||||||
You can use the script:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
./push_docker.sh
|
|
||||||
```
|
|
||||||
|
|
||||||
Login to the tu docker image server
|
Login to the tu docker image server
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
@@ -138,8 +121,6 @@ Push the image to the git registry
|
|||||||
docker image push git.tu-berlin.de:5000/internet-of-services-lab/service-aware-network-front-end:latest
|
docker image push git.tu-berlin.de:5000/internet-of-services-lab/service-aware-network-front-end:latest
|
||||||
```
|
```
|
||||||
|
|
||||||
# Using the Uploaded Docker Image
|
|
||||||
|
|
||||||
Pull the image
|
Pull the image
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
|
|||||||
@@ -1,42 +0,0 @@
|
|||||||
#!/usr/bin/env bash
|
|
||||||
|
|
||||||
# shellcheck shell=bash
|
|
||||||
set -euo pipefail
|
|
||||||
|
|
||||||
# GITLAB_TOKEN
|
|
||||||
if [[ -z "${GITLAB_TOKEN:-}" ]]; then
|
|
||||||
cat <<EOF
|
|
||||||
GITLAB_TOKEN environment var is not set. Please generate a new token under
|
|
||||||
https://git.tu-berlin.de/internet-of-services-lab/service-aware-network-front-end/-/settings/access_tokens
|
|
||||||
EOF
|
|
||||||
exit 1
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Create a new ui build
|
|
||||||
nix build .#ui --out-link ui-release
|
|
||||||
tar -czvf ui-assets.tar.gz ui-release/lib/node_modules/clan-ui/out/
|
|
||||||
|
|
||||||
# upload ui assets to gitlab
|
|
||||||
gitlab_base="https://git.tu-berlin.de/api/v4/projects/internet-of-services-lab%2Fservice-aware-network-front-end"
|
|
||||||
curl --header "PRIVATE-TOKEN: $GITLAB_TOKEN" \
|
|
||||||
--upload-file ./ui-assets.tar.gz \
|
|
||||||
"$gitlab_base/packages/generic/ui-assets/1.0.0/ui-assets.tar.gz"
|
|
||||||
|
|
||||||
|
|
||||||
# write url and hash to ui-assets.nix
|
|
||||||
url="$gitlab_base/packages/generic/ui-assets/1.0.0/ui-assets.tar.gz"
|
|
||||||
PROJECT_DIR=$(git rev-parse --show-toplevel)
|
|
||||||
cat > "$PROJECT_DIR/pkgs/ui/nix/ui-assets.nix" <<EOF
|
|
||||||
{ fetchzip }:
|
|
||||||
fetchzip {
|
|
||||||
url = "$url";
|
|
||||||
sha256 = "$(nix-prefetch-url --unpack $url)";
|
|
||||||
}
|
|
||||||
EOF
|
|
||||||
|
|
||||||
cat <<EOF
|
|
||||||
Please commit the changes to ui-assets.nix and push them to the repository.
|
|
||||||
If you want clan webui to use the new ui assets.
|
|
||||||
$ git commit -m "Update ui-assets.nix" "$PROJECT_DIR/pkgs/ui/nix/ui-assets.nix"
|
|
||||||
$ git push
|
|
||||||
EOF
|
|
||||||
@@ -1,9 +0,0 @@
|
|||||||
#!/usr/bin/env bash
|
|
||||||
|
|
||||||
# shellcheck shell=bash
|
|
||||||
set -euo pipefail
|
|
||||||
|
|
||||||
docker login git.tu-berlin.de:5000
|
|
||||||
docker load < result
|
|
||||||
docker image tag clan-docker:latest git.tu-berlin.de:5000/internet-of-services-lab/service-aware-network-front-end:latest
|
|
||||||
docker image push git.tu-berlin.de:5000/internet-of-services-lab/service-aware-network-front-end:latest
|
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
{ fetchzip }:
|
{ fetchzip }:
|
||||||
fetchzip {
|
fetchzip {
|
||||||
url = "https://gitea.gchq.icu/api/packages/IoSL/generic/IoSL-service-aware-frontend/0p1dw924f4sdkq26fd3rrb9qmryl84hdn5plz9ds105xv6al4ikf/assets.tar.gz";
|
url = "https://gitea.gchq.icu/api/packages/IoSL/generic/IoSL-service-aware-frontend/12ndzp04vy7xmqk90gakb4igy2qjf1pcfmr94r2cmpjrkkljdgbi/assets.tar.gz";
|
||||||
sha256 = "0p1dw924f4sdkq26fd3rrb9qmryl84hdn5plz9ds105xv6al4ikf";
|
sha256 = "12ndzp04vy7xmqk90gakb4igy2qjf1pcfmr94r2cmpjrkkljdgbi";
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,7 +9,6 @@ import {
|
|||||||
Tooltip,
|
Tooltip,
|
||||||
useMediaQuery,
|
useMediaQuery,
|
||||||
} from "@mui/material";
|
} from "@mui/material";
|
||||||
import { useGetAllEntities } from "@/api/entities/entities";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import React, { ReactNode } from "react";
|
import React, { ReactNode } from "react";
|
||||||
|
|
||||||
@@ -34,7 +33,32 @@ type MenuEntry = {
|
|||||||
subMenuEntries?: MenuEntry[];
|
subMenuEntries?: MenuEntry[];
|
||||||
};
|
};
|
||||||
|
|
||||||
export let menuEntityEntries: MenuEntry[] = [];
|
export const menuEntityEntries: MenuEntry[] = [
|
||||||
|
{
|
||||||
|
icon: <PersonIcon />,
|
||||||
|
label: "C1",
|
||||||
|
to: "/client/C1",
|
||||||
|
disabled: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: <PersonIcon />,
|
||||||
|
label: "C2",
|
||||||
|
to: "/client/C2",
|
||||||
|
disabled: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: <PersonIcon />,
|
||||||
|
label: "C3",
|
||||||
|
to: "/client/C3",
|
||||||
|
disabled: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: <PersonIcon />,
|
||||||
|
label: "C4",
|
||||||
|
to: "/client/C4",
|
||||||
|
disabled: false,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
export const menuEntries: MenuEntry[] = [
|
export const menuEntries: MenuEntry[] = [
|
||||||
{
|
{
|
||||||
@@ -72,7 +96,6 @@ interface SidebarProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function Sidebar(props: SidebarProps) {
|
export function Sidebar(props: SidebarProps) {
|
||||||
const { data: entityData } = useGetAllEntities();
|
|
||||||
const { show, onClose } = props;
|
const { show, onClose } = props;
|
||||||
const [activeMenuItem, setActiveMenuItem] = React.useState(
|
const [activeMenuItem, setActiveMenuItem] = React.useState(
|
||||||
typeof window !== "undefined" ? window.location.pathname : "",
|
typeof window !== "undefined" ? window.location.pathname : "",
|
||||||
@@ -90,22 +113,12 @@ export function Sidebar(props: SidebarProps) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (entityData) {
|
|
||||||
menuEntityEntries = Array.isArray(entityData.data)
|
|
||||||
? entityData.data.map((entity) => ({
|
|
||||||
icon: <PersonIcon />,
|
|
||||||
label: entity.name,
|
|
||||||
to: `/client/${entity.name}`,
|
|
||||||
disabled: false,
|
|
||||||
}))
|
|
||||||
: [];
|
|
||||||
}
|
|
||||||
if (isSmallerScreen) {
|
if (isSmallerScreen) {
|
||||||
setCollapseMenuOpen(false);
|
setCollapseMenuOpen(false);
|
||||||
} else {
|
} else {
|
||||||
setCollapseMenuOpen(true);
|
setCollapseMenuOpen(true);
|
||||||
}
|
}
|
||||||
}, [isSmallerScreen, entityData]);
|
}, [isSmallerScreen]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<aside
|
<aside
|
||||||
@@ -200,7 +213,7 @@ export function Sidebar(props: SidebarProps) {
|
|||||||
unmountOnExit
|
unmountOnExit
|
||||||
>
|
>
|
||||||
<List component="div" disablePadding>
|
<List component="div" disablePadding>
|
||||||
{menuEntityEntries?.map((menuEntry, idx) => (
|
{menuEntityEntries.map((menuEntry, idx) => (
|
||||||
<ListItemButton
|
<ListItemButton
|
||||||
key={idx}
|
key={idx}
|
||||||
sx={{ pl: 4 }}
|
sx={{ pl: 4 }}
|
||||||
|
|||||||
Reference in New Issue
Block a user