diff --git a/buildtime/client/logical-editor/src/App.css b/buildtime/client/logical-editor/src/App.css index 3755f00a1..367a71a80 100644 --- a/buildtime/client/logical-editor/src/App.css +++ b/buildtime/client/logical-editor/src/App.css @@ -52,12 +52,20 @@ } } -.sidebar h2 { +.treeElement p { + font-size: 12px; + margin: 8px 16px 0 0; +} + +.treeElement { + background: whitesmoke; + border-inline: 1px solid var(--border); + box-sizing: border-box; + box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); +} + +.treeElement h2 { font-size: 14px; letter-spacing: -1px; - margin: 8px 16px 0 0; - @media (max-width: 1024px) { - font-size: 14px; - margin: 20px 0; - } + margin: 4px 16px 0 0; } \ No newline at end of file diff --git a/buildtime/client/logical-editor/src/components/Language.jsx b/buildtime/client/logical-editor/src/components/Language.jsx index b5ec8b9b9..546b3ceec 100644 --- a/buildtime/client/logical-editor/src/components/Language.jsx +++ b/buildtime/client/logical-editor/src/components/Language.jsx @@ -1,11 +1,16 @@ import { useState } from 'react' -//import UseFetch from './tools/UseFetch'; +import UseFetch from './tools/UseFetch'; const Language = ({ languageid }) => { - + const { data: lang, isLoading, error } = UseFetch(`http://localhost:8088/language/${languageid}`) + + if (isLoading) return

Loading profile...

+ if (error) return

Error: {error}

+ return (
-

Language ${languageid}

+

Language: {lang.language}

+

Locale: {lang.locale}

); } diff --git a/buildtime/client/logical-editor/src/components/tools/UseFetch.jsx b/buildtime/client/logical-editor/src/components/tools/UseFetch.jsx index 08a5618b9..58c893311 100644 --- a/buildtime/client/logical-editor/src/components/tools/UseFetch.jsx +++ b/buildtime/client/logical-editor/src/components/tools/UseFetch.jsx @@ -1,6 +1,6 @@ import { useState, useEffect } from 'react' -function UseFetch(url, options) { +function UseFetch(url, options = {method: 'GET'}) { const [data, setData] = useState(null) const [isLoading, setIsLoading] = useState(true) const [error, setError] = useState(null) @@ -20,7 +20,8 @@ function UseFetch(url, options) { .then((json) => setData(json)) .catch((err) => setError(err.message)) .finally(() => setIsLoading(false)) - }) + },[]) + return { data, isLoading, error } }