Skip to content

Commit

Permalink
Merge pull request #24 from Hu-Fi/admin-page
Browse files Browse the repository at this point in the history 
Basic admin page UI
  • Loading branch information
@posix4e
posix4e committed Mar 1, 2024
2 parents d95e36f + e324292 commit 23d1394
Show file tree
Hide file tree
Showing 55 changed files with 1,608 additions and 3 deletions.
29 changes: 28 additions & 1 deletion interface/src/i18n/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -253,5 +253,32 @@
"withdraw_info": "Withdraw token from {grow_type}",
"delete_info":"Delete this {grow_type}, all tokens will be refunded.",
"asks": "Asks",
"bids": "Bids"
"bids": "Bids",

"password_incorrect": "Password incorrect",
"enter_password": "Enter password",
"dashboard": "Dashboard",
"users": "Users",
"database": "Database",
"config": "Config",
"exit": "Exit",
"health": "Health",
"message": "Message",
"exchanges": "Exchanges",
"revenue": "Revenue",
"last_update": "Last update",
"volume": "Volume",
"actions": "Actions",
"type": "Type",
"user_id": "User ID",
"symbol": "Symbol",
"state": "State",
"view_all": "View all",
"total_users": "Total users",
"active_users": "Active users",
"user_signups_this_week": "User signups this week",
"max_amount_to_keep_in_bot": "Max amount to keep in bot",
"spot_fee": "Spot fee",
"settings":"Settings",
"save": "Save"
}
53 changes: 53 additions & 0 deletions interface/src/lib/components/admin/config/settings.svelte
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<script>
import clsx from "clsx";
import { _ } from "svelte-i18n";
let max_amount_to_keep_in_bot = 30000;
let spot_fee = 0.02;
let save_loading = false;
const loadSettings = () => {
console.log('onMount load settings from server');
}
loadSettings()
const saveSettings = () => {
save_loading = true;
console.log('call API to save settings with auth');
setTimeout( () => {
save_loading = false;
}, 3000)
}
</script>

<div class="flex flex-col space-y-8">
<div>
<span class="text-2xl font-semibold capitalize"> {$_('settings')} </span>
</div>

<div id="amount" class="flex flex-col space-y-2">
<span>
{$_('max_amount_to_keep_in_bot')}
</span>
<div>
<input type="text" class="input input-bordered focus:outline-none" bind:value={max_amount_to_keep_in_bot} />
</div>
</div>

<div id="amount" class="flex flex-col space-y-2">
<span>
{$_('spot_fee')}
</span>
<div>
<input type="text" class="input input-bordered focus:outline-none" bind:value={spot_fee} />
</div>
</div>

<div>
<button class="btn btn-sm rounded-2xl w-16" on:click={()=> { saveSettings() }}>
<span class={clsx(save_loading && "loading")}>
{$_('save')}
</span>
</button>
</div>
</div>
15 changes: 15 additions & 0 deletions interface/src/lib/components/admin/dashboard.svelte
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<script lang="ts">
import Users from "$lib/components/admin/dashboard/users.svelte";
import Stats from "$lib/components/admin/dashboard/stats.svelte";
import Transactions from "$lib/components/admin/dashboard/transactions.svelte";
</script>

<div id="main-content" class="flex overflow-hidden bg-white pt-8">
<main class="mb-20">
<div class="pt-6 px-4 flex flex-col space-y-4">
<Stats />
<Transactions />
<Users />
</div>
</main>
</div>
71 changes: 71 additions & 0 deletions interface/src/lib/components/admin/dashboard/sideBar.svelte
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
<script>
import clsx from "clsx";
import { _ } from "svelte-i18n";
import { page } from "$app/stores";
import { goto } from "$app/navigation";
import { exit } from "$lib/helpers/hufi/admin";
import SideBarIcons from "./sideBarIcons.svelte";
const paths = [
"dashboard",
"orders",
"users",
"database",
"exchanges",
// "revenue",
"health",
// "message",
"config",
"exit",
];
const items = paths.map((path) => {
return {
key: path,
name: $_(path),
value: `/manage/${path}`,
fn:
path === "exit"
? () => {
exit();
}
: () => {
goto(`/manage/${path}`);
},
};
});
</script>

<aside
id="sidebar"
class="fixed hidden z-20 h-full top-0 left-0 lg:flex flex-shrink-0 flex-col w-64 transition-width duration-75"
aria-label="Sidebar"
>
<div
class="relative flex-1 flex flex-col min-h-0 border-r border-gray-200 bg-white pt-0"
>
<div class="flex-1 flex flex-col pt-5 pb-4 overflow-y-auto">
<div class="flex-1 px-3 bg-white divide-y space-y-1">
<ul class="space-y-2 pb-2">
{#each items as item}
<li>
<button
on:click={() => item.fn()}
class={clsx(
"w-full text-base text-gray-900 font-normal rounded-lg flex items-center p-2 hover:bg-gray-100 group",
$page.url.pathname.includes(item.key) && "bg-gray-100",
)}
>
<SideBarIcons name={item.key} />
<span class="ml-3">{item.name}</span>
</button>
</li>
{/each}
</ul>
</div>
</div>
</div>
</aside>
<div
class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10"
id="sidebarBackdrop"
></div>
145 changes: 145 additions & 0 deletions interface/src/lib/components/admin/dashboard/sideBarIcons.svelte
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,145 @@
<script lang="ts">
export let name: string;
</script>

{#if name === "dashboard"}
<svg
class="w-6 h-6 text-gray-500 group-hover:text-gray-900 transition duration-75"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
><path d="M2 10a8 8 0 018-8v8h8a8 8 0 11-16 0z"></path><path
d="M12 2.252A8.014 8.014 0 0117.748 8H12V2.252z"
></path></svg
>
{:else if name === "users"}
<svg
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z"
clip-rule="evenodd"
></path>
</svg>
{:else if name === "exchanges"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M2.25 13.5a8.25 8.25 0 0 1 8.25-8.25.75.75 0 0 1 .75.75v6.75H18a.75.75 0 0 1 .75.75 8.25 8.25 0 0 1-16.5 0Z"
clip-rule="evenodd"
/>
<path
fill-rule="evenodd"
d="M12.75 3a.75.75 0 0 1 .75-.75 8.25 8.25 0 0 1 8.25 8.25.75.75 0 0 1-.75.75h-7.5a.75.75 0 0 1-.75-.75V3Z"
clip-rule="evenodd"
/>
</svg>
{:else if name === "revenue"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25ZM9.763 9.51a2.25 2.25 0 0 1 3.828-1.351.75.75 0 0 0 1.06-1.06 3.75 3.75 0 0 0-6.38 2.252c-.033.307 0 .595.032.822l.154 1.077H8.25a.75.75 0 0 0 0 1.5h.421l.138.964a3.75 3.75 0 0 1-.358 2.208l-.122.242a.75.75 0 0 0 .908 1.047l1.539-.512a1.5 1.5 0 0 1 .948 0l.655.218a3 3 0 0 0 2.29-.163l.666-.333a.75.75 0 1 0-.67-1.342l-.667.333a1.5 1.5 0 0 1-1.145.082l-.654-.218a3 3 0 0 0-1.898 0l-.06.02a5.25 5.25 0 0 0 .053-1.794l-.108-.752H12a.75.75 0 0 0 0-1.5H9.972l-.184-1.29a1.863 1.863 0 0 1-.025-.45Z"
clip-rule="evenodd"
/>
</svg>
{:else if name === "orders"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M5.625 1.5H9a3.75 3.75 0 0 1 3.75 3.75v1.875c0 1.036.84 1.875 1.875 1.875H16.5a3.75 3.75 0 0 1 3.75 3.75v7.875c0 1.035-.84 1.875-1.875 1.875H5.625a1.875 1.875 0 0 1-1.875-1.875V3.375c0-1.036.84-1.875 1.875-1.875ZM9.75 17.25a.75.75 0 0 0-1.5 0V18a.75.75 0 0 0 1.5 0v-.75Zm2.25-3a.75.75 0 0 1 .75.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 .75-.75Zm3.75-1.5a.75.75 0 0 0-1.5 0V18a.75.75 0 0 0 1.5 0v-5.25Z"
clip-rule="evenodd"
/>
<path
d="M14.25 5.25a5.23 5.23 0 0 0-1.279-3.434 9.768 9.768 0 0 1 6.963 6.963A5.23 5.23 0 0 0 16.5 7.5h-1.875a.375.375 0 0 1-.375-.375V5.25Z"
/>
</svg>
{:else if name === "database"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M10 1c3.866 0 7 1.79 7 4s-3.134 4-7 4-7-1.79-7-4 3.134-4 7-4Zm5.694 8.13c.464-.264.91-.583 1.306-.952V10c0 2.21-3.134 4-7 4s-7-1.79-7-4V8.178c.396.37.842.688 1.306.953C5.838 10.006 7.854 10.5 10 10.5s4.162-.494 5.694-1.37ZM3 13.179V15c0 2.21 3.134 4 7 4s7-1.79 7-4v-1.822c-.396.37-.842.688-1.306.953-1.532.875-3.548 1.369-5.694 1.369s-4.162-.494-5.694-1.37A7.009 7.009 0 0 1 3 13.179Z"
clip-rule="evenodd"
/>
</svg>
{:else if name === "config"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M11.078 2.25c-.917 0-1.699.663-1.85 1.567L9.05 4.889c-.02.12-.115.26-.297.348a7.493 7.493 0 0 0-.986.57c-.166.115-.334.126-.45.083L6.3 5.508a1.875 1.875 0 0 0-2.282.819l-.922 1.597a1.875 1.875 0 0 0 .432 2.385l.84.692c.095.078.17.229.154.43a7.598 7.598 0 0 0 0 1.139c.015.2-.059.352-.153.43l-.841.692a1.875 1.875 0 0 0-.432 2.385l.922 1.597a1.875 1.875 0 0 0 2.282.818l1.019-.382c.115-.043.283-.031.45.082.312.214.641.405.985.57.182.088.277.228.297.35l.178 1.071c.151.904.933 1.567 1.85 1.567h1.844c.916 0 1.699-.663 1.85-1.567l.178-1.072c.02-.12.114-.26.297-.349.344-.165.673-.356.985-.57.167-.114.335-.125.45-.082l1.02.382a1.875 1.875 0 0 0 2.28-.819l.923-1.597a1.875 1.875 0 0 0-.432-2.385l-.84-.692c-.095-.078-.17-.229-.154-.43a7.614 7.614 0 0 0 0-1.139c-.016-.2.059-.352.153-.43l.84-.692c.708-.582.891-1.59.433-2.385l-.922-1.597a1.875 1.875 0 0 0-2.282-.818l-1.02.382c-.114.043-.282.031-.449-.083a7.49 7.49 0 0 0-.985-.57c-.183-.087-.277-.227-.297-.348l-.179-1.072a1.875 1.875 0 0 0-1.85-1.567h-1.843ZM12 15.75a3.75 3.75 0 1 0 0-7.5 3.75 3.75 0 0 0 0 7.5Z"
clip-rule="evenodd"
/>
</svg>
{:else if name === "exit"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M16.5 3.75a1.5 1.5 0 0 1 1.5 1.5v13.5a1.5 1.5 0 0 1-1.5 1.5h-6a1.5 1.5 0 0 1-1.5-1.5V15a.75.75 0 0 0-1.5 0v3.75a3 3 0 0 0 3 3h6a3 3 0 0 0 3-3V5.25a3 3 0 0 0-3-3h-6a3 3 0 0 0-3 3V9A.75.75 0 1 0 9 9V5.25a1.5 1.5 0 0 1 1.5-1.5h6ZM5.78 8.47a.75.75 0 0 0-1.06 0l-3 3a.75.75 0 0 0 0 1.06l3 3a.75.75 0 0 0 1.06-1.06l-1.72-1.72H15a.75.75 0 0 0 0-1.5H4.06l1.72-1.72a.75.75 0 0 0 0-1.06Z"
clip-rule="evenodd"
/>
</svg>
{:else if name === "health"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M7.502 6h7.128A3.375 3.375 0 0 1 18 9.375v9.375a3 3 0 0 0 3-3V6.108c0-1.505-1.125-2.811-2.664-2.94a48.972 48.972 0 0 0-.673-.05A3 3 0 0 0 15 1.5h-1.5a3 3 0 0 0-2.663 1.618c-.225.015-.45.032-.673.05C8.662 3.295 7.554 4.542 7.502 6ZM13.5 3A1.5 1.5 0 0 0 12 4.5h4.5A1.5 1.5 0 0 0 15 3h-1.5Z"
clip-rule="evenodd"
/>
<path
fill-rule="evenodd"
d="M3 9.375C3 8.339 3.84 7.5 4.875 7.5h9.75c1.036 0 1.875.84 1.875 1.875v11.25c0 1.035-.84 1.875-1.875 1.875h-9.75A1.875 1.875 0 0 1 3 20.625V9.375Zm9.586 4.594a.75.75 0 0 0-1.172-.938l-2.476 3.096-.908-.907a.75.75 0 0 0-1.06 1.06l1.5 1.5a.75.75 0 0 0 1.116-.062l3-3.75Z"
clip-rule="evenodd"
/>
</svg>
{:else if name === "message"}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="w-6 h-6 text-gray-500 flex-shrink-0 group-hover:text-gray-900 transition duration-75"
>
<path
fill-rule="evenodd"
d="M12 2.25c-2.429 0-4.817.178-7.152.521C2.87 3.061 1.5 4.795 1.5 6.741v6.018c0 1.946 1.37 3.68 3.348 3.97.877.129 1.761.234 2.652.316V21a.75.75 0 0 0 1.28.53l4.184-4.183a.39.39 0 0 1 .266-.112c2.006-.05 3.982-.22 5.922-.506 1.978-.29 3.348-2.023 3.348-3.97V6.741c0-1.947-1.37-3.68-3.348-3.97A49.145 49.145 0 0 0 12 2.25ZM8.25 8.625a1.125 1.125 0 1 0 0 2.25 1.125 1.125 0 0 0 0-2.25Zm2.625 1.125a1.125 1.125 0 1 1 2.25 0 1.125 1.125 0 0 1-2.25 0Zm4.875-1.125a1.125 1.125 0 1 0 0 2.25 1.125 1.125 0 0 0 0-2.25Z"
clip-rule="evenodd"
/>
</svg>
{/if}
Loading

0 comments on commit 23d1394

Please sign in to comment.