feat: add sample api endpoint

This commit is contained in:
log101 2024-01-20 21:59:51 +03:00
parent 4c6d6df13b
commit efdf39ba9a
5 changed files with 824 additions and 120 deletions

View File

@ -1,11 +1,14 @@
import { defineConfig } from 'astro/config';
import react from "@astrojs/react";
import tailwind from "@astrojs/tailwind";
import vercel from "@astrojs/vercel/serverless";
// https://astro.build/config
export default defineConfig({
integrations: [react(), tailwind({
applyBaseStyles: false,
})]
applyBaseStyles: false
})],
output: "hybrid",
adapter: vercel()
});

721
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -13,12 +13,14 @@
"@astrojs/check": "^0.4.1",
"@astrojs/react": "^3.0.9",
"@astrojs/tailwind": "^5.1.0",
"@astrojs/vercel": "^7.0.0",
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-separator": "^1.0.3",
"@radix-ui/react-slot": "^1.0.2",
"@types/react": "^18.2.47",
"@types/react-dom": "^18.2.18",
"@vercel/blob": "^0.19.0",
"astro": "^4.1.2",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",

15
src/pages/create-url.ts Normal file
View File

@ -0,0 +1,15 @@
export const prerender = false
import type { APIRoute } from "astro"
export const POST: APIRoute = async ({ request }) => {
const data = await request.formData()
console.log(data)
return new Response(
JSON.stringify({
message: "This was a POST!"
})
)
}

View File

@ -2,26 +2,19 @@
import '@/styles/globals.css';
import Layout from '../layouts/Layout.astro';
import { Button } from '@/components/ui/button';
import {
Card,
CardContent,
CardFooter,
CardHeader,
CardTitle,
} from '@/components/ui/card';
import { CalendarIcon } from '@radix-ui/react-icons';
import '../styles/locked-page.css';
import LockedContent from '@/components/LockedContent';
import { Separator } from '@/components/ui/separator';
import { Label } from '@/components/ui/label';
import { Input } from '@/components/ui/input';
import { Textarea } from '@/components/ui/textarea';
---
<Layout>
<main class="flex flex-col gap-8">
<main>
<form
class="flex flex-col gap-8"
id="sample-form"
enctype="multipart/form-data"
>
<div>
<h1
class="scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl"
@ -43,10 +36,11 @@ import { Textarea } from '@/components/ui/textarea';
</h2>
<p class="leading-7 [&:not(:first-child)]:mt-6">
Aşağıdaki butona basıp galerinizden bir fotoğraf seçin, seçtiğiniz
fotoğraf yalnızca belirli bir konumda açılabilecek bir hale getirilecek.
fotoğraf yalnızca belirli bir konumda açılabilecek bir hale
getirilecek.
</p>
<div class="grid w-full max-w-sm items-center gap-1.5 mt-4">
<Input id="picture" type="file" />
<Input type="file" name="selected-photo" id="photo-selector" />
<p class="text-sm text-muted-foreground">
Galerinizden bir fotoğraf seçin.
</p>
@ -86,37 +80,40 @@ import { Textarea } from '@/components/ui/textarea';
>
3. Fotoğraf Açıklaması
</h2>
<p class="leading-7 [&:not(:first-child)]:mt-6">
Aşağıdaki butona basıp galerinizden bir fotoğraf seçin, seçtiğiniz
fotoğraf yalnızca belirli bir konumda açılabilecek bir hale getirilecek.
</p>
<div class="grid w-full max-w-sm items-center gap-1.5 mt-4">
<Textarea placeholder="Açıklamanızı buraya yazınız." />
<p class="text-sm text-muted-foreground">Bir açıklama girin.</p>
</div>
</div>
<div>
<h2
class="mt-10 scroll-m-20 border-b pb-2 text-2xl font-semibold tracking-tight transition-colors first:mt-0"
>
4. (Zorunlu Değil) Bağlantı Şifresi
</h2>
<p class="leading-7 [&:not(:first-child)]:mt-6">
Aşağıdaki butona basıp galerinizden bir fotoğraf seçin, seçtiğiniz
fotoğraf yalnızca belirli bir konumda açılabilecek bir hale getirilecek.
</p>
<div class="grid w-full max-w-sm items-center gap-1.5 mt-4">
<Label htmlFor="password">Şifre</Label>
<Input id="password" type="password" />
<Textarea placeholder="Açıklamanızı buraya yazınız." name="desc" />
<p class="text-sm text-muted-foreground">
Bağlantınız için bir şifre girin, açıklama ve fotoğrafın görülmesi
için önce bu şifrenin girilmesi istenecek.
Bir açıklama girin, yüklediğiniz içeriğin üzerine bu metin
görünecek.
</p>
</div>
</div>
<Button className="w-full">Bağlantıyı Oluştur</Button>
<Button className="w-full" type="submit" id="submit-button">
Bağlantıyı Oluştur
</Button>
</form>
</main>
<script src="../scripts/initSelectionMap.js"></script>
</Layout>
<script>
import type { PutBlobResult } from '@vercel/blob';
const handleSubmit = async (e: SubmitEvent) => {
e.preventDefault();
const formData = new FormData(e.target as HTMLFormElement);
const response = await fetch(`/create-url`, {
method: 'POST',
body: formData,
});
const newBlob = (await response.json()) as PutBlobResult;
console.log(newBlob);
};
document.getElementById('sample-form')!.onsubmit = handleSubmit;
</script>