jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

🐛 fix(headerComponent): change Sign out button to anchor tag for better accessibility and consistency

Browse source 
✨ feat(headerComponent): add Home link when on admin page for easier navigation
✨ feat(headerComponent): add Admin page link for easier navigation to admin page
🐛 fix(ApiKeysPage): handle case when api_keys.name is null or undefined by displaying "-" instead
🐛 fix(ApiKeysPage): handle case when api_keys.last_used_at is an invalid date by displaying "Never" instead
✨ feat(ApiKeysPage): add Total Uses column to display the total number of uses for each API key
🐛 fix(loginPage): set isAdmin context variable based on user's is_superuser property
🐛 fix(loginPage): increase delay before fetching logged user to 500ms for better user experience
🐛 fix(types): add total_uses property to ApiKey type to match backend response
This commit is contained in:
Cristhian Zanforlin Lousa 2023-08-29 11:46:48 -03:00
commit 3e55e5f394
4 changed files with 67 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/frontend/src/components/headerComponent/index.tsx
View file

@ -32,29 +32,38 @@ export default function Header(): JSX.Element {
<MenuBar flows={flows} tabId={tabId} />
)}
{!autoLogin && location.pathname !== `/flow/${tabId}` && (
<Button
<a
onClick={() => {
logout();
navigate("/login");
}}
className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer mx-5"
>
Sign out
</a>
)}
{location.pathname === "/admin" && (
<a
onClick={() => {
logout();
navigate("/login");
navigate("/");
}}
className="mx-5 cursor-pointer text-sm font-medium text-muted-foreground transition-colors hover:text-primary"
variant="outline"
className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer"
>
Sign out
</Button>
Home
</a>
)}
{isAdmin &&
!autoLogin &&
location.pathname !== "/admin" &&
location.pathname !== `/flow/${tabId}` && (
<Button
className="cursor-pointer text-sm font-medium text-muted-foreground transition-colors hover:text-primary"
onClick={() => navigate("/admin")}
variant="outline"
>
Admin page
</Button>
<a
className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer"
onClick={() => navigate("/admin")}
>
Admin page
</a>
)}
</div>
<div className="round-button-div">

50
src/frontend/src/pages/ApiKeysPage/index.tsx
View file

@ -156,6 +156,7 @@ export default function ApiKeysPage() {
</div>
</ShadTooltip>
</TableHead>
<TableHead className="h-10">Total Uses</TableHead>
<TableHead className="h-10 w-[100px] text-right"></TableHead>
</TableRow>
</TableHeader>
@ -167,7 +168,7 @@ export default function ApiKeysPage() {
<TableCell className="truncate py-2">
<ShadTooltip content={api_keys.name}>
<span className="cursor-default">
{api_keys.name}
{api_keys.name ? api_keys.name : "-"}
</span>
</ShadTooltip>
</TableCell>
@ -177,18 +178,45 @@ export default function ApiKeysPage() {
</span>
</TableCell>
<TableCell className="truncate py-2 ">
{moment(api_keys.created_at).format(
"YYYY-MM-DD HH:mm"
)}
</TableCell>
<TableCell className="truncate py-2">
{moment(api_keys.last_used_at).format(
"YYYY-MM-DD HH:mm"
) === "Invalid date"
? "Never"
: moment(api_keys.last_used_at).format(
<ShadTooltip
side="top"
content={moment(
api_keys.created_at
).format("YYYY-MM-DD HH:mm")}
>
<div>
{moment(api_keys.created_at).format(
"YYYY-MM-DD HH:mm"
)}
</div>
</ShadTooltip>
</TableCell>
<TableCell className="truncate py-2">
<ShadTooltip
side="top"
content={
moment(api_keys.last_used_at).format(
"YYYY-MM-DD HH:mm"
) === "Invalid date"
? "Never"
: moment(
api_keys.last_used_at
).format("YYYY-MM-DD HH:mm")
}
>
<div>
{moment(api_keys.last_used_at).format(
"YYYY-MM-DD HH:mm"
) === "Invalid date"
? "Never"
: moment(
api_keys.last_used_at
).format("YYYY-MM-DD HH:mm")}
</div>
</ShadTooltip>
</TableCell>
<TableCell className="truncate py-2">
{api_keys.total_uses}
</TableCell>
<TableCell className="flex w-[100px] py-2 text-right">
<div className="flex">

6
src/frontend/src/pages/loginPage/index.tsx
View file

@ -19,7 +19,7 @@ export default function LoginPage(): JSX.Element {
useState<loginInputStateType>(CONTROL_LOGIN_STATE);
const { password, username } = inputState;
const { login, getAuthentication, setUserData } = useContext(AuthContext);
const { login, getAuthentication, setUserData, setIsAdmin } = useContext(AuthContext);
const navigate = useNavigate();
const { setErrorData } = useContext(alertContext);
@ -53,10 +53,12 @@ export default function LoginPage(): JSX.Element {
setTimeout(() => {
getLoggedUser()
.then((user) => {
const isSuperUser = user.is_superuser;
setIsAdmin(isSuperUser);
setUserData(user);
})
.catch((error) => {});
}, 1000);
}, 500);
}
}

1
src/frontend/src/types/components/index.ts
View file

@ -538,6 +538,7 @@ export type ApiKey = {
name: string;
created_at: string;
last_used_at: string;
total_uses: number;
};
export type fetchErrorComponentType = {
message: string;