binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: date and time standardization all across the platform. (#3283)

Browse source 
* chore: date and time standardization all across the platform.

* chore: update `renderFormattedTime` function.
* remove unwanted code.

* fix: build errors

* chore: update `renderFormattedTime` function params.
This commit is contained in:
Prateek Shourya 2024-01-02 14:45:51 +05:30 • committed by GitHub
parent d9ee692ce9
commit 1539340113
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
65 changed files with 366 additions and 723 deletions
Download patch file Download diff file Expand all files Collapse all files

12
web/components/issues/issue-layouts/calendar/day-tile.tsx
View file

@ -4,7 +4,7 @@ import { Droppable } from "@hello-pangea/dnd";
// components
import { CalendarIssueBlocks, ICalendarDate, CalendarQuickAddIssueForm } from "components/issues";
// helpers
import { renderDateFormat } from "helpers/date-time.helper";
import { renderFormattedPayloadDate } from "helpers/date-time.helper";
// constants
import { MONTHS_LIST } from "constants/calendar";
import { IIssue } from "types";
@ -52,7 +52,9 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
const [showAllIssues, setShowAllIssues] = useState(false);
const calendarLayout = issuesFilterStore?.issueFilters?.displayFilters?.calendar?.layout ?? "month";
const issueIdList = groupedIssueIds ? groupedIssueIds[renderDateFormat(date.date)] : null;
const formattedDatePayload = renderFormattedPayloadDate(date.date);
if (!formattedDatePayload) return null;
const issueIdList = groupedIssueIds ? groupedIssueIds[formattedDatePayload] : null;
const totalIssues = issueIdList?.length ?? 0;
return (
@ -78,7 +80,7 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
{/* content */}
<div className="h-full w-full">
<Droppable droppableId={renderDateFormat(date.date)} isDropDisabled={false}>
<Droppable droppableId={formattedDatePayload} isDropDisabled={false}>
{(provided, snapshot) => (
<div
className={`h-full w-full select-none overflow-y-auto ${
@ -100,9 +102,9 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
<div className="px-2 py-1">
<CalendarQuickAddIssueForm
formKey="target_date"
groupId={renderDateFormat(date.date)}
groupId={formattedDatePayload}
prePopulatedData={{
target_date: renderDateFormat(date.date),
target_date: renderFormattedPayloadDate(date.date),
}}
quickAddCallback={quickAddCallback}
viewId={viewId}

4
web/components/issues/issue-layouts/calendar/week-days.tsx
View file

@ -2,7 +2,7 @@ import { observer } from "mobx-react-lite";
// components
import { CalendarDayTile } from "components/issues";
// helpers
import { renderDateFormat } from "helpers/date-time.helper";
import { renderFormattedPayloadDate } from "helpers/date-time.helper";
// types
import { ICalendarDate, ICalendarWeek } from "./types";
import { IIssue } from "types";
@ -65,7 +65,7 @@ export const CalendarWeekDays: React.FC<Props> = observer((props) => {
return (
<CalendarDayTile
issuesFilterStore={issuesFilterStore}
key={renderDateFormat(date.date)}
key={renderFormattedPayloadDate(date.date)}
date={date}
issues={issues}
groupedIssueIds={groupedIssueIds}

5
web/components/issues/issue-layouts/filters/applied-filters/date.tsx
View file

@ -1,9 +1,8 @@
import { observer } from "mobx-react-lite";
// icons
import { X } from "lucide-react";
// helpers
import { renderLongDateFormat } from "helpers/date-time.helper";
import { renderFormattedDate } from "helpers/date-time.helper";
import { capitalizeFirstLetter } from "helpers/string.helper";
// constants
import { DATE_FILTER_OPTIONS } from "constants/filters";
@ -28,7 +27,7 @@ export const AppliedDateFilters: React.FC<Props> = observer((props) => {
if (dateParts.length === 2) {
const [date, time] = dateParts;
dateLabel = `${capitalizeFirstLetter(time)} ${renderLongDateFormat(date)}`;
dateLabel = `${capitalizeFirstLetter(time)} ${renderFormattedDate(date)}`;
}
}

8
web/components/issues/issue-layouts/gantt/blocks.tsx
View file

@ -2,7 +2,7 @@ import { useRouter } from "next/router";
// ui
import { Tooltip, StateGroupIcon } from "@plane/ui";
// helpers
import { renderShortDate } from "helpers/date-time.helper";
import { renderFormattedDate } from "helpers/date-time.helper";
// types
import { IIssue } from "types";
@ -34,15 +34,13 @@ export const IssueGanttBlock = ({ data }: { data: IIssue }) => {
<div className="space-y-1">
<h5>{data?.name}</h5>
<div>
{renderShortDate(data?.start_date ?? "")} to {renderShortDate(data?.target_date ?? "")}
{renderFormattedDate(data?.start_date ?? "")} to {renderFormattedDate(data?.target_date ?? "")}
</div>
</div>
}
position="top-left"
>
<Tooltip tooltipHeading="Title" tooltipContent={data.name}>
<div className="relative w-full truncate px-2.5 py-1 text-sm text-custom-text-100">{data?.name}</div>
</Tooltip>
<div className="relative w-full truncate px-2.5 py-1 text-sm text-custom-text-100">{data?.name}</div>
</Tooltip>
</div>
);

9
web/components/issues/issue-layouts/gantt/quick-add-issue-form.tsx
View file

@ -11,11 +11,10 @@ import useKeypress from "hooks/use-keypress";
import useProjectDetails from "hooks/use-project-details";
import useOutsideClickDetector from "hooks/use-outside-click-detector";
// helpers
import { renderDateFormat } from "helpers/date-time.helper";
import { renderFormattedPayloadDate } from "helpers/date-time.helper";
import { createIssuePayload } from "helpers/issue.helper";
// types
import { IIssue } from "types";
// helpers
import { createIssuePayload } from "helpers/issue.helper";
type Props = {
prePopulatedData?: Partial<IIssue>;
@ -116,8 +115,8 @@ export const GanttInlineCreateIssueForm: React.FC<Props> = observer((props) => {
const payload = createIssuePayload(workspaceDetail!, projectDetails!, {
...(prePopulatedData ?? {}),
...formData,
start_date: renderDateFormat(new Date()),
target_date: renderDateFormat(new Date(new Date().getTime() + 24 * 60 * 60 * 1000)),
start_date: renderFormattedPayloadDate(new Date()),
target_date: renderFormattedPayloadDate(new Date(new Date().getTime() + 24 * 60 * 60 * 1000)),
});
try {

4
web/components/issues/issue-layouts/properties/date.tsx
View file

@ -12,7 +12,7 @@ import { Tooltip } from "@plane/ui";
// hooks
import useDynamicDropdownPosition from "hooks/use-dynamic-dropdown";
// helpers
import { renderDateFormat, renderFormattedDate } from "helpers/date-time.helper";
import { renderFormattedPayloadDate, renderFormattedDate } from "helpers/date-time.helper";
export interface IIssuePropertyDate {
value: string | null;
@ -105,7 +105,7 @@ export const IssuePropertyDate: React.FC<IIssuePropertyDate> = observer((props)
onChange={(val, e) => {
e?.stopPropagation();
if (onChange && val) {
onChange(renderDateFormat(val));
onChange(renderFormattedPayloadDate(val));
close();
}
}}

5
web/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx
View file

@ -1,9 +1,8 @@
import React from "react";
// hooks
import useSubIssue from "hooks/use-sub-issue";
// helpers
import { renderLongDetailDateFormat } from "helpers/date-time.helper";
import { renderFormattedDate } from "helpers/date-time.helper";
// types
import { IIssue } from "types";
@ -20,7 +19,7 @@ export const SpreadsheetCreatedOnColumn: React.FC<Props> = ({ issue, expandedIss
return (
<>
<div className="flex h-11 w-full items-center justify-center text-xs border-b-[0.5px] border-custom-border-200 hover:bg-custom-background-80">
{renderLongDetailDateFormat(issue.created_at)}
{renderFormattedDate(issue.created_at)}
</div>
{isExpanded &&

5
web/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx
View file

@ -1,9 +1,8 @@
import React from "react";
// hooks
import useSubIssue from "hooks/use-sub-issue";
// helpers
import { renderLongDetailDateFormat } from "helpers/date-time.helper";
import { renderFormattedDate } from "helpers/date-time.helper";
// types
import { IIssue } from "types";
@ -22,7 +21,7 @@ export const SpreadsheetUpdatedOnColumn: React.FC<Props> = (props) => {
return (
<>
<div className="flex h-11 w-full items-center justify-center text-xs border-b-[0.5px] border-custom-border-200 hover:bg-custom-background-80">
{renderLongDetailDateFormat(issue.updated_at)}
{renderFormattedDate(issue.updated_at)}
</div>
{isExpanded &&