Skip to content

Commit

Permalink
Show version, make ui dependent on api in docker (#912)
Browse files Browse the repository at this point in the history
![Screenshot 2023-12-27 at 7 44
07 PM](https://github.com/PeerDB-io/peerdb/assets/65964360/e0ddd66d-c733-4c02-bc75-45acd02169ee)

Docker compose changes:
Figured it would be good to have ui start after the flow-api container
  • Loading branch information
Amogh-Bharadwaj authored Dec 27, 2023
1 parent f3d1d8e commit 4425e20
Show file tree
Hide file tree
Showing 5 changed files with 60 additions and 10 deletions.
2 changes: 2 additions & 0 deletions docker-compose-dev.yml
Original file line number Diff line number Diff line change
Expand Up @@ -209,6 +209,8 @@ services:
DATABASE_URL: postgres://postgres:postgres@catalog:5432/postgres
PEERDB_FLOW_SERVER_HTTP: http://flow_api:8113
PEERDB_PASSWORD:
depends_on:
- flow-api

volumes:
pgdata:
2 changes: 2 additions & 0 deletions docker-compose.yml
Original file line number Diff line number Diff line change
Expand Up @@ -174,6 +174,8 @@ services:
<<: *catalog-config
DATABASE_URL: postgres://postgres:postgres@catalog:5432/postgres
PEERDB_FLOW_SERVER_HTTP: http://flow_api:8113
depends_on:
- flow-api

volumes:
pgdata:
Expand Down
23 changes: 23 additions & 0 deletions ui/app/api/version/route.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { UVersionResponse } from '@/app/dto/VersionDTO';
import { PeerDBVersionResponse } from '@/grpc_generated/route';
import { GetFlowHttpAddressFromEnv } from '@/rpc/http';

export const dynamic = 'force-dynamic';

export async function GET() {
const flowServiceAddr = GetFlowHttpAddressFromEnv();
try {
const versionResponse: PeerDBVersionResponse = await fetch(
`${flowServiceAddr}/v1/version`
).then((res) => {
return res.json();
});
let response: UVersionResponse = {
version: versionResponse.version,
};
return new Response(JSON.stringify(response));
} catch (error) {
console.error('Error getting version:', error);
return new Response(JSON.stringify({ error: error }));
}
}
3 changes: 3 additions & 0 deletions ui/app/dto/VersionDTO.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export type UVersionResponse = {
version: string;
};
40 changes: 30 additions & 10 deletions ui/components/SidebarComponent.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
'use client';

import { UVersionResponse } from '@/app/dto/VersionDTO';
import useTZStore from '@/app/globalstate/time';
import Logout from '@/components/Logout';
import { BrandLogo } from '@/lib/BrandLogo';
Expand All @@ -8,11 +9,30 @@ import { Label } from '@/lib/Label';
import { RowWithSelect } from '@/lib/Layout';
import { Sidebar, SidebarItem } from '@/lib/Sidebar';
import Link from 'next/link';
import useSWR from 'swr';

const centerFlexStyle = {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
width: '100%',
marginBottom: '0.5rem',
};
const fetcher = (...args: [any]) => fetch(...args).then((res) => res.json());
export default function SidebarComponent(props: { logout?: boolean }) {
const timezones = ['UTC', 'Local', 'Relative'];
const setZone = useTZStore((state) => state.setZone);
const zone = useTZStore((state) => state.timezone);

const {
data: version,
error,
isLoading,
}: { data: UVersionResponse; error: any; isLoading: boolean } = useSWR(
'/api/version',
fetcher
);

return (
<Sidebar
topTitle={
Expand All @@ -24,15 +44,7 @@ export default function SidebarComponent(props: { logout?: boolean }) {
}
bottomRow={
<>
<div
style={{
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
width: '100%',
marginBottom: '0.5rem',
}}
>
<div style={centerFlexStyle}>
<div style={{ width: '80%' }}>
<RowWithSelect
label={<Label>Timezone:</Label>}
Expand Down Expand Up @@ -63,7 +75,15 @@ export default function SidebarComponent(props: { logout?: boolean }) {
{props.logout && <Logout />}
</>
}
bottomLabel={<Label variant='footnote'>App. v0.7.0</Label>}
bottomLabel={
<div style={centerFlexStyle}>
<Label as='label' style={{ textAlign: 'center', fontSize: 15 }}>
{' '}
<b>Version: </b>
{isLoading ? 'Loading...' : version?.version}
</Label>
</div>
}
>
<SidebarItem
as={Link}
Expand Down

0 comments on commit 4425e20

Please sign in to comment.