mokkenstorm.dev
fork of hey-api/openapi-ts because I need some additional things
1<script>
2 import Header from './Header.svelte';
3 import '../app.css';
4 import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query';
5 import { client } from '../client/client.gen';
6 import { browser } from '$app/environment';
7
8 // configure internal service client
9 client.setConfig({
10 // set default base url for requests
11 baseUrl: 'https://petstore3.swagger.io/api/v3',
12 // set default headers for requests
13 headers: {
14 Authorization: 'Bearer <token_from_service_client>'
15 }
16 });
17
18 const queryClient = new QueryClient({
19 defaultOptions: {
20 queries: {
21 enabled: browser,
22 staleTime: 60000
23 }
24 }
25 });
26</script>
27
28<div class="app">
29 <Header />
30
31 <main>
32 <QueryClientProvider client={queryClient}>
33 <slot />
34 </QueryClientProvider>
35 </main>
36
37 <footer>
38 <p>visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to learn SvelteKit</p>
39 </footer>
40</div>
41
42<style>
43 .app {
44 display: flex;
45 flex-direction: column;
46 min-height: 100vh;
47 }
48
49 main {
50 flex: 1;
51 display: flex;
52 flex-direction: column;
53 padding: 1rem;
54 width: 100%;
55 max-width: 64rem;
56 margin: 0 auto;
57 box-sizing: border-box;
58 }
59
60 footer {
61 display: flex;
62 flex-direction: column;
63 justify-content: center;
64 align-items: center;
65 padding: 12px;
66 }
67
68 footer a {
69 font-weight: bold;
70 }
71
72 @media (min-width: 480px) {
73 footer {
74 padding: 12px 0;
75 }
76 }
77</style>