Compare commits
	
		
			2 Commits
		
	
	
		
			42ac0a99e8
			...
			5ae7c7f47b
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 5ae7c7f47b | |||
| 2ffeb53e32 | 
@@ -6,6 +6,7 @@
 | 
				
			|||||||
		<meta name="theme-color" content="#000000" />
 | 
							<meta name="theme-color" content="#000000" />
 | 
				
			||||||
		<link rel="shortcut icon" type="image/ico" href="/src/assets/favicon.ico" />
 | 
							<link rel="shortcut icon" type="image/ico" href="/src/assets/favicon.ico" />
 | 
				
			||||||
		<title>Solid App</title>
 | 
							<title>Solid App</title>
 | 
				
			||||||
 | 
							<link href="/src/styles/styles.css" rel="stylesheet" />
 | 
				
			||||||
	</head>
 | 
						</head>
 | 
				
			||||||
	<body>
 | 
						<body>
 | 
				
			||||||
		<noscript>You need to enable JavaScript to run this app.</noscript>
 | 
							<noscript>You need to enable JavaScript to run this app.</noscript>
 | 
				
			||||||
 
 | 
				
			|||||||
							
								
								
									
										1876
									
								
								Frontend/package-lock.json
									
									
									
										generated
									
									
									
										Normal file
									
								
							
							
						
						
									
										1876
									
								
								Frontend/package-lock.json
									
									
									
										generated
									
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							@@ -3,6 +3,7 @@
 | 
				
			|||||||
	"version": "1.0.0",
 | 
						"version": "1.0.0",
 | 
				
			||||||
	"main": "index.ts",
 | 
						"main": "index.ts",
 | 
				
			||||||
	"license": "MIT",
 | 
						"license": "MIT",
 | 
				
			||||||
 | 
						"type": "module",
 | 
				
			||||||
	"scripts": {
 | 
						"scripts": {
 | 
				
			||||||
		"dev": "vite",
 | 
							"dev": "vite",
 | 
				
			||||||
		"build": "vite build"
 | 
							"build": "vite build"
 | 
				
			||||||
@@ -15,6 +16,9 @@
 | 
				
			|||||||
		"vite-plugin-solid": "^2.11.8"
 | 
							"vite-plugin-solid": "^2.11.8"
 | 
				
			||||||
	},
 | 
						},
 | 
				
			||||||
	"dependencies": {
 | 
						"dependencies": {
 | 
				
			||||||
		"solid-js": "^1.9.9"
 | 
							"@tailwindcss/vite": "^4.1.13",
 | 
				
			||||||
 | 
							"daisyui": "^5.1.7",
 | 
				
			||||||
 | 
							"solid-js": "^1.9.9",
 | 
				
			||||||
 | 
							"tailwindcss": "^4.1.13"
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,22 +1,18 @@
 | 
				
			|||||||
import type { Component } from "solid-js";
 | 
					import type { Component } from "solid-js";
 | 
				
			||||||
import { createSignal, For, onMount } from "solid-js";
 | 
					import { createSignal, For, onMount } from "solid-js";
 | 
				
			||||||
 | 
					import CalibreService from "./services/calibreservice";
 | 
				
			||||||
interface Weather {
 | 
					import { book } from "./types/calibretypes";
 | 
				
			||||||
	date: string;
 | 
					import BookCard from "./components/BookCard";
 | 
				
			||||||
	temperatureC: number;
 | 
					 | 
				
			||||||
	temperatureF: number;
 | 
					 | 
				
			||||||
	summary: string;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
const App: Component = () => {
 | 
					const App: Component = () => {
 | 
				
			||||||
	const [weather, setWeather] = createSignal<Weather[]>([]);
 | 
						const [books, setBooks] = createSignal<book[]>([]);
 | 
				
			||||||
	onMount(() => {
 | 
						onMount(() => {
 | 
				
			||||||
		fetch("/api/weatherforecast")
 | 
							CalibreService.getBooks().then(setBooks);
 | 
				
			||||||
			.then((r) => r.json())
 | 
					 | 
				
			||||||
			.then(setWeather);
 | 
					 | 
				
			||||||
	});
 | 
						});
 | 
				
			||||||
	return (
 | 
						return (
 | 
				
			||||||
		<div>
 | 
							<div>
 | 
				
			||||||
 | 
								<button class="btn btn-primary">primary knapp</button>
 | 
				
			||||||
 | 
								<button class="btn btn-blue">blå knapp</button>
 | 
				
			||||||
			<header>
 | 
								<header>
 | 
				
			||||||
				<p>
 | 
									<p>
 | 
				
			||||||
					Edit <code>src/App.tsx</code> and save to reload.
 | 
										Edit <code>src/App.tsx</code> and save to reload.
 | 
				
			||||||
@@ -30,14 +26,9 @@ const App: Component = () => {
 | 
				
			|||||||
				</a>
 | 
									</a>
 | 
				
			||||||
			</header>
 | 
								</header>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
			<For each={weather()}>
 | 
								<div class="book-grid text-base-content mx-auto grid gap-6 pb-20 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 [&_.carbon-responsive-wrap]:flex-nowrap! [&_.carbon-responsive-wrap]:text-[11px]! [&_:is(div,button)]:[transition:background-color_0ms,border-color_100ms,box-shadow_300ms,border-radius_500ms_ease-out] [&>*]:mb-6">
 | 
				
			||||||
				{(item) => (
 | 
									<For each={books()}>{(item) => <BookCard book={item} />}</For>
 | 
				
			||||||
					<li>
 | 
								</div>
 | 
				
			||||||
						{item.date} - {item.temperatureC}°C / {item.temperatureF}°F -{" "}
 | 
					 | 
				
			||||||
						{item.summary}
 | 
					 | 
				
			||||||
					</li>
 | 
					 | 
				
			||||||
				)}
 | 
					 | 
				
			||||||
			</For>
 | 
					 | 
				
			||||||
		</div>
 | 
							</div>
 | 
				
			||||||
	);
 | 
						);
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 
 | 
				
			|||||||
							
								
								
									
										27
									
								
								Frontend/src/components/BookCard.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										27
									
								
								Frontend/src/components/BookCard.tsx
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,27 @@
 | 
				
			|||||||
 | 
					import type { Component } from "solid-js";
 | 
				
			||||||
 | 
					import { book } from "../types/calibretypes";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					const BookCard: Component<{ book: book }> = (props: { book: book }) => {
 | 
				
			||||||
 | 
						return (
 | 
				
			||||||
 | 
							<div class="card book-card bg-base-100 card-border border-base-300 card-sm">
 | 
				
			||||||
 | 
								{/* <figure>
 | 
				
			||||||
 | 
									<img
 | 
				
			||||||
 | 
										src="https://img.daisyui.com/images/stock/photo-1606107557195-0e29a4b5b4aa.webp"
 | 
				
			||||||
 | 
										alt="Shoes"
 | 
				
			||||||
 | 
									/>
 | 
				
			||||||
 | 
								</figure> */}
 | 
				
			||||||
 | 
								<div class="card-body">
 | 
				
			||||||
 | 
									<h3 class="card-title">{props.book.title}</h3>
 | 
				
			||||||
 | 
									<h4 class="author">{props.book.author}</h4>
 | 
				
			||||||
 | 
									<p>
 | 
				
			||||||
 | 
										Series: {props.book.seriesName} {props.book.seriesNumber}
 | 
				
			||||||
 | 
									</p>
 | 
				
			||||||
 | 
									{/* <div class="card-actions justify-end">
 | 
				
			||||||
 | 
										<button class="btn btn-primary">Buy Now</button>
 | 
				
			||||||
 | 
									</div> */}
 | 
				
			||||||
 | 
								</div>
 | 
				
			||||||
 | 
							</div>
 | 
				
			||||||
 | 
						);
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export default BookCard;
 | 
				
			||||||
							
								
								
									
										10
									
								
								Frontend/src/services/calibreservice.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										10
									
								
								Frontend/src/services/calibreservice.ts
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,10 @@
 | 
				
			|||||||
 | 
					import { book } from "../types/calibretypes";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					const CalibreService = {
 | 
				
			||||||
 | 
						getBooks: async (): Promise<book[]> => {
 | 
				
			||||||
 | 
							const response = await fetch("/api/calibre/books");
 | 
				
			||||||
 | 
							return response.json();
 | 
				
			||||||
 | 
						},
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export default CalibreService;
 | 
				
			||||||
							
								
								
									
										4
									
								
								Frontend/src/styles/styles.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										4
									
								
								Frontend/src/styles/styles.css
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,4 @@
 | 
				
			|||||||
 | 
					@import "tailwindcss";
 | 
				
			||||||
 | 
					@plugin "daisyui" {
 | 
				
			||||||
 | 
						themes: dim --default;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
							
								
								
									
										15
									
								
								Frontend/src/types/calibretypes.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										15
									
								
								Frontend/src/types/calibretypes.ts
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,15 @@
 | 
				
			|||||||
 | 
					interface book {
 | 
				
			||||||
 | 
						id: number;
 | 
				
			||||||
 | 
						title: string;
 | 
				
			||||||
 | 
						authorId: number;
 | 
				
			||||||
 | 
						author: string;
 | 
				
			||||||
 | 
						comments: string;
 | 
				
			||||||
 | 
						language: string;
 | 
				
			||||||
 | 
						path: string;
 | 
				
			||||||
 | 
						hasCover: boolean;
 | 
				
			||||||
 | 
						formats: Array<{ id: number; format: string; fileName: string }>;
 | 
				
			||||||
 | 
						seriesName: string;
 | 
				
			||||||
 | 
						seriesNumber: number;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export type { book };
 | 
				
			||||||
@@ -1,12 +1,13 @@
 | 
				
			|||||||
import { defineConfig } from "vite";
 | 
					import { defineConfig } from "vite";
 | 
				
			||||||
import solidPlugin from "vite-plugin-solid";
 | 
					import solidPlugin from "vite-plugin-solid";
 | 
				
			||||||
 | 
					import tailwindcss from "@tailwindcss/vite";
 | 
				
			||||||
import { env } from "process";
 | 
					import { env } from "process";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const target = env.BACKEND_URL ?? "http://localhost:5084/"; //"https://localhost:7192/";
 | 
					const target = env.BACKEND_URL ?? "http://localhost:5084/"; //"https://localhost:7192/";
 | 
				
			||||||
console.log("vite backend:", target);
 | 
					console.log("vite backend:", target);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default defineConfig({
 | 
					export default defineConfig({
 | 
				
			||||||
	plugins: [solidPlugin()],
 | 
						plugins: [solidPlugin(), tailwindcss()],
 | 
				
			||||||
	server: {
 | 
						server: {
 | 
				
			||||||
		port: 3000,
 | 
							port: 3000,
 | 
				
			||||||
		proxy: {
 | 
							proxy: {
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user