Compare commits

..
Author SHA1 Message Date
Daniel-Garmig 159ee1b004 Gitea Actions Support - Part 2 2024-05-12 02:21:05 +02:00
Daniel-Garmig e7ac0e8af6 Fix dockerfile for Docker Lint action. 2024-05-12 02:16:21 +02:00
Daniel-Garmig 5278d65e50 Add Gitea Actions Support:
Publish_on_Tag / Build and Push (push) Has been cancelled
Publish_on_Tag / Docker Lint (push) Has been cancelled
- Build and publish on tag.
2024-05-12 02:04:24 +02:00
14 changed files with 23 additions and 89 deletions
-2
View File
@@ -2,5 +2,3 @@ node_modules
build
.dockerignore
Dockerfile
.env
.env.local
-3
View File
@@ -1,3 +0,0 @@
# App config Variables (Will be visible by client):
VITE_BACKEND_HOST=SOMNIAROOMS_BACKEND_HOST
VITE_BACKEND_PORT=SOMNIAROOMS_BACKEND_PORT
+1 -5
View File
@@ -15,10 +15,6 @@ jobs:
name: Build and Push
runs-on: ubuntu-latest
steps:
- name: downcase REPO_OWNER
run: |
echo "REPO_OWNER=${gitea.repository_owner,,}" >> "${gitea.env}"
- name: Checkout
uses: actions/checkout@v4
@@ -42,7 +38,7 @@ jobs:
with:
context: .
push: true
tags: ${{vars.REGISTRY_INSTANCE}}/${{env.REPO_OWNER}}/somniaroomsapp:devbuild
tags: ${{vars.REGISTRY_INSTANCE}}/daniel-garmig/somniaroomsapp:devbuild
target: final-prod
platforms: linux/amd64,linux/arm64
secrets: |
-3
View File
@@ -19,8 +19,5 @@ RUN npm ci && npm run build
# production environment
FROM nginx:stable-alpine as final-prod
COPY --from=builder /app/dist /usr/share/nginx/html
COPY /public /usr/share/nginx/html/public
COPY scripts/env.sh /docker-entrypoint.d/env.sh
EXPOSE 80
RUN chmod +x /docker-entrypoint.d/env.sh
CMD ["nginx", "-g", "daemon off;"]
-27
View File
@@ -31,30 +31,3 @@ docker build -t somniarooms-app:prod --target final-prod .
```
docker run -d -it -p 8080:80 --name somniarooms-app somniarooms-app:prod
```
**Docker run with env vars:**
```
docker run -d -it -p 8080:80 --name somniarooms-app -e SOMNIAROOMS_BACKEND_HOST=https://somniaapi.example.org/ -e SOMNIAROOMS_BACKEND_PORT=443 somniarooms-app:prod
```
## Env Vars.
As this is distributed as a docker image ready to use, you must set some env variables to configure the app:
| Var | Default Value | Description |
| :------------------------: | :----------------------------: | :------------------------------------------------------------------------------------------: |
| `SOMNIAROOMS_BACKEND_HOST` | https://somniaapi.example.org/ | Host where uses can connect to the SomniaRoom API. API endpoint should be reachble for uses. |
| `SOMNIAROOMS_BACKEND_PORT` | 443 | Port to SomniarRooms API. |
## .env files
This project uses .env files to configure the app. As Vite only supports compile-time vars, we use some tricks to allow setting variables from container env variables.
### .env
Contains default values. It is just an example configuration.
For development is recomended to create a `.env.local` file based on `.env`.
### .env.production
Set varibles to certains placeholder, that are replace on container startup.
(We are using this solution: https://stackoverflow.com/a/77454537)
+1 -1
View File
@@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/SR2.svg" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
</head>
-12
View File
@@ -1,12 +0,0 @@
#!/bin/sh
for i in $(env | grep SOMNIAROOMS_)
do
key=$(echo $i | cut -d '=' -f 1)
value=$(echo $i | cut -d '=' -f 2-)
echo $key=$value
# sed All files
# find /usr/share/nginx/html -type f -exec sed -i "s|${key}|${value}|g" '{}' +
# sed JS and CSS only
find /usr/share/nginx/html -type f \( -name '*.js' -o -name '*.css' \) -exec sed -i "s|${key}|${value}|g" '{}' +
done
+1 -3
View File
@@ -71,13 +71,11 @@ export function SearchFilterCard({ onSearchClick }: { onSearchClick?: funOnSearc
const datePickerElement = searchFilter == null ? (
<DatePickerWithRange
updateDateRange={updateDateRange}
allowPast={false}>
updateDateRange={updateDateRange}>
</DatePickerWithRange>
) : (
<DatePickerWithRange
updateDateRange={updateDateRange}
allowPast={false}
startDate={searchFilter.dateRange.from}
endDate={searchFilter.dateRange.to}>
</DatePickerWithRange>
+7 -5
View File
@@ -9,18 +9,20 @@ function AppHeader() {
return (
<Card className="flex items-center mx-10 my-4">
<CardContent className="w-full py-2">
<CardContent className="w-full">
<div className="flex justify-around items-center">
<div className="flex flex-row items-center gap-2 relative">
<img src="public/SR2.svg" className="w-[64px]"></img>
<Typography variant={"largeText"}>Somnia Rooms</Typography>
<a href="https://duck.com" className="absolute w-[100%] h-[100%]"></a>
</div>
<Button variant="ghost" className="h-15">
<Link to={`home`}><HomeIcon className="mx-auto" />Home</Link>
<Button variant="ghost">
<HomeIcon />
<Link to={`home`}>Home</Link>
</Button>
<Button variant="ghost" className="h-15">
<Link to={`search`}><BookAIcon className="mx-auto" />Reservar</Link>
<Button variant="ghost">
<BookAIcon />
<Link to={`search`}>Reservar</Link>
</Button>
<ModeToggle />
</div>
+3 -9
View File
@@ -7,9 +7,8 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from ".
import { Button } from "../ui/button";
type OnBookingClickFunction = () => void;
type BookingDetailsModes = "Book" | "View"
export function BookingDetails({ onBookingConfirm, mode }: { onBookingConfirm?: OnBookingClickFunction, mode: BookingDetailsModes }) {
export function BookingDetails({ onBookingConfirm }: { onBookingConfirm?: OnBookingClickFunction }) {
const bookingData = useAppStore((state) => state.newBookingData);
@@ -39,7 +38,6 @@ export function BookingDetails({ onBookingConfirm, mode }: { onBookingConfirm?:
<TableCell>{room.guestNumber}</TableCell>
<TableCell>{room.amount}</TableCell>
<TableCell>{room.price / 100} €</TableCell>
<TableCell>{(room.price * room.amount) / 100} €</TableCell>
</TableRow>
);
})
@@ -52,8 +50,7 @@ export function BookingDetails({ onBookingConfirm, mode }: { onBookingConfirm?:
<TableHead>Room</TableHead>
<TableHead>Guests</TableHead>
<TableHead>Quantity</TableHead>
<TableHead>Unit price</TableHead>
<TableHead>Total price</TableHead>
<TableHead>Price</TableHead>
</TableRow>
</TableHeader>
<TableBody>
@@ -63,7 +60,7 @@ export function BookingDetails({ onBookingConfirm, mode }: { onBookingConfirm?:
);
const totalPrice = bookingData.rooms.reduce((acc, room) => (acc + (room.price * room.amount)), 0);
const totalPrice = bookingData.rooms.reduce((acc, room) => (acc + room.price), 0);
return (
<Card>
@@ -83,12 +80,9 @@ export function BookingDetails({ onBookingConfirm, mode }: { onBookingConfirm?:
<Separator className="my-2"></Separator>
<Typography variant={"h3"}>Total Price</Typography>
<Typography variant={"h3"}>{totalPrice / 100} €</Typography>
{
mode == "Book" &&
<Button className="my-2" onClick={onBtBookingClick}>
<Typography variant={"largeText"} className="text-primary-foreground">Book it!</Typography>
</Button>
}
</CardContent>
</Card>
)
+2 -11
View File
@@ -18,11 +18,8 @@ import { Typography } from "./typography"
export type UpdateRangeFunction = (newRange: DateRange) => void;
export function DatePickerWithRange({
className, updateDateRange, startDate, endDate, allowPast = true
}: {
className?: React.HTMLAttributes<HTMLDivElement> | undefined, updateDateRange: UpdateRangeFunction | undefined,
startDate?: Date, endDate?: Date, allowPast?: boolean
}) {
className, updateDateRange, startDate, endDate
}: { className?: React.HTMLAttributes<HTMLDivElement> | undefined, updateDateRange: UpdateRangeFunction | undefined , startDate?: Date, endDate?: Date}) {
// Date Range State.
const [dateRange, setDateRange] = React.useState<DateRange | undefined>({
from: startDate,
@@ -64,11 +61,6 @@ export function DatePickerWithRange({
beforeAndSelected = [beforeMatcher, dateMatcher];
}
let pastMatcher: DateBefore | undefined = undefined;
if (!allowPast) {
pastMatcher = { before: new Date() };
}
return (
<div className={cn("grid gap-x-2 grid-cols-2 grid-rows-2", className)}>
<Typography variant={"largeText"} as="p">Desde</Typography>
@@ -99,7 +91,6 @@ export function DatePickerWithRange({
selected={dateRange?.from}
onDayClick={handleDayClickFrom}
numberOfMonths={1}
disabled={pastMatcher}
/>
</PopoverContent>
</Popover>
+1 -1
View File
@@ -113,7 +113,7 @@ function BookPage() {
</div>
</div>
<Separator className="my-10" />
<BookingDetails mode="View"></BookingDetails>
<BookingDetails></BookingDetails>
<Separator className="my-10" />
<Button onClick={handleOnBookingSubmit} disabled={pageState == PageState.sending}>
<Typography variant={"h3"} className="text-primary-foreground">Book it now!</Typography>
+1 -1
View File
@@ -26,7 +26,7 @@ function Homepage() {
return (
<>
<Typography variant={"h1"}>Somnia Rooms</Typography>
<Typography variant={"h1"}>Hostal del Val</Typography>
<Separator className="my-10" />
<SearchFilterCard onSearchClick={onBtSearchClick}/>
<Separator className="my-10" />
+1 -1
View File
@@ -85,7 +85,7 @@ function SearchPage() {
{hasRooms ? roomList : (isSearched && noRoomsAvailable)}
</div>
<Separator className="my-10" />
<BookingDetails onBookingConfirm={onBookingContinue} mode={"Book"}></BookingDetails>
<BookingDetails onBookingConfirm={onBookingContinue}></BookingDetails>
<Separator className="my-10" />
<BackendConnectionStatus isLoading={isLoading} isError={isError} />
</div>