Skip to content

feat(site): move history into sidebar #11413

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 11 commits into from
Jan 5, 2024
Merged

feat(site): move history into sidebar #11413

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
e7d633d
WIP: Add base sidebar structure
BrunoQuaresma Jan 3, 2024
72ed777
Refactor to only have history sidebar
BrunoQuaresma Jan 4, 2024
e66151a
Minor visual adjustments
BrunoQuaresma Jan 4, 2024
1110997
Refactor timeline and group build by date
BrunoQuaresma Jan 4, 2024
dcf8f32
Change workspace build data
BrunoQuaresma Jan 4, 2024
ec87d6b
Reset timeline
BrunoQuaresma Jan 4, 2024
1dacdd9
Add left bar to the sidebar
BrunoQuaresma Jan 4, 2024
0f56e29
Fix tests
BrunoQuaresma Jan 4, 2024
3449731
Fix lint
BrunoQuaresma Jan 4, 2024
df7f8b6
Resolve PR comments
BrunoQuaresma Jan 5, 2024
4e8fbf9
Improve agent row
BrunoQuaresma Jan 5, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Reset timeline
  • Loading branch information
@BrunoQuaresma
BrunoQuaresma committed Jan 4, 2024
commit ec87d6b306d50de7dfb23cb6b3ba44bca82abc9d
9 changes: 2 additions & 7 deletions site/src/components/Timeline/Timeline.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { TimelineDateRow } from "components/Timeline/TimelineDateRow";
import { FC, Fragment } from "react";
import { createDisplayDate } from "./utils";
import { Fragment } from "react";

type GetDateFn<TData> = (data: TData) => Date;

Expand All @@ -27,27 +26,23 @@ export interface TimelineProps<TData> {
items: TData[];
getDate: GetDateFn<TData>;
row: (item: TData) => JSX.Element;
dateRow?: FC<{ date: Date; displayDate: string }>;
}

export const Timeline = <TData,>({
items,
getDate,
row,
dateRow: DateRow = TimelineDateRow,
}: TimelineProps<TData>): JSX.Element => {
const itemsByDate = groupByDate(items, getDate);

return (
<>
{Object.keys(itemsByDate).map((dateStr) => {
const items = itemsByDate[dateStr];
const date = new Date(dateStr);
const displayDate = createDisplayDate(date);

return (
<Fragment key={dateStr}>
<DateRow date={date} displayDate={displayDate} />
<TimelineDateRow date={new Date(dateStr)} />
{items.map(row)}
</Fragment>
);
Expand Down
6 changes: 3 additions & 3 deletions site/src/components/Timeline/TimelineDateRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@ import TableCell from "@mui/material/TableCell";
import TableRow from "@mui/material/TableRow";
import { type FC } from "react";
import { css, useTheme } from "@emotion/react";
import { createDisplayDate } from "./utils";

export interface TimelineDateRow {
date: Date;
displayDate: string;
}

export const TimelineDateRow: FC<TimelineDateRow> = ({ date, displayDate }) => {
export const TimelineDateRow: FC<TimelineDateRow> = ({ date }) => {
const theme = useTheme();

return (
Expand All @@ -30,7 +30,7 @@ export const TimelineDateRow: FC<TimelineDateRow> = ({ date, displayDate }) => {
}}
title={date.toLocaleDateString()}
>
{displayDate}
{createDisplayDate(date)}
</TableCell>
</TableRow>
);
Expand Down