42 lines
1.3 KiB
React
42 lines
1.3 KiB
React
|
import React, { useEffect, useState } from 'react';
|
||
|
|
import { createClient } from '@supabase/supabase-js';
|
||
|
|
|
||
|
|
const supabaseUrl = import.meta.env.VITE_SUPABASE_URL;
|
||
|
|
const supabaseAnonKey = import.meta.env.VITE_SUPABASE_ANON_KEY;
|
||
|
|
const supabase = createClient(supabaseUrl, supabaseAnonKey);
|
||
|
|
|
||
|
|
export default function SupabaseTest() {
|
||
|
|
const [data, setData] = useState([]);
|
||
|
|
const [loading, setLoading] = useState(true);
|
||
|
|
const [error, setError] = useState(null);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
async function fetchData() {
|
||
|
|
setLoading(true);
|
||
|
|
setError(null);
|
||
|
|
// Passe den Tabellennamen ggf. an
|
||
|
|
const { data, error } = await supabase.from('test').select('*').limit(10);
|
||
|
|
if (error) setError(error.message);
|
||
|
|
setData(data || []);
|
||
|
|
setLoading(false);
|
||
|
|
}
|
||
|
|
fetchData();
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div style={{ marginTop: 24, padding: 16, border: '1px solid #eee', borderRadius: 8 }}>
|
||
|
|
<h2>Supabase Test</h2>
|
||
|
|
<div style={{ fontSize: 14 }}>
|
||
|
|
<strong>Supabase URL:</strong> {supabaseUrl}
|
||
|
|
</div>
|
||
|
|
{loading && <p>Lade Daten...</p>}
|
||
|
|
{error && <p style={{ color: 'red' }}>Fehler: {error}</p>}
|
||
|
|
<ul>
|
||
|
|
{data && data.length > 0 ? data.map((row, idx) => (
|
||
|
|
<li key={idx}>{JSON.stringify(row)}</li>
|
||
|
|
)) : !loading && <li>Keine Daten gefunden.</li>}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|