vynte-infra/calendar
2
0
Fork 0
Code Issues Pull Requests Actions 1.2k Packages Projects Releases Wiki Activity

V2 General Fixes (#4038)

Browse Source
This commit is contained in:
sean-brydon
2022-08-31 11:13:27 +00:00
committed by GitHub
parent f5e394bb57
commit e17c463890
11 changed files with 52 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/components/v2/eventtype/EventAppsTab.tsx
+5 -1
View File
@@ -79,7 +79,11 @@ export const EventAppsTab = ({
Icon={Icon.FiGrid}
headline={t("empty_installed_apps_headline")}
description={t("empty_installed_apps_description")}
buttonRaw={<Button href="/apps">{t("empty_installed_apps_button")} </Button>}
buttonRaw={
<Button target="_blank" href="/apps">
{t("empty_installed_apps_button")}{" "}
</Button>
}
/>
);
}
apps/web/components/v2/eventtype/EventTypeSingleLayout.tsx
+4 -3
View File
@@ -104,8 +104,8 @@ function EventTypeSingleLayout({
{
name: "recurring",
tabName: "recurring",
icon: Icon.FiRotateCcw,
info: `recurring_event_description`,
icon: Icon.FiRepeat,
info: `recurring_event_tab_description`,
},
{
name: "apps",
@@ -191,7 +191,8 @@ function EventTypeSingleLayout({
showToast("Link copied!", "success");
}}
/>
<Button color="secondary" size="icon" StartIcon={Icon.FiCode} combined />
{/* TODO: Implement embed here @hariom */}
{/* <Button color="secondary" size="icon" StartIcon={Icon.FiCode} combined /> */}
<Button
color="secondary"
size="icon"
apps/web/pages/v2/bookings/[status].tsx
+2 -2
View File
@@ -91,7 +91,7 @@ export default function Bookings() {
)}
{(query.status === "loading" || query.status === "idle") && <SkeletonLoader />}
{query.status === "success" && !isEmpty && (
<div className="pt-4 xl:mx-6 xl:pt-0">
<div className="pt-2 xl:mx-6 xl:pt-0">
<p className="pb-3 text-xs font-medium leading-4 text-gray-500">Today</p>
<div className="overflow-hidden rounded-md border border-gray-200">
<table className="w-full">
@@ -123,7 +123,7 @@ export default function Bookings() {
</div>
)}
{query.status === "success" && isEmpty && (
<div className="flex items-center justify-center">
<div className="flex items-center justify-center pt-2 xl:mx-6 xl:pt-0">
<EmptyScreen
Icon={Icon.FiCalendar}
headline={t("no_status_bookings_yet", { status: t(status).toLowerCase() })}
apps/web/pages/v2/event-types/index.tsx
+3 -3
View File
@@ -305,7 +305,7 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
</Tooltip>
<Tooltip content={t("preview") as string}>
<Button
color="minimal"
color="minimalSecondary"
size="icon"
href={calLink}
StartIcon={Icon.FiExternalLink}
@@ -315,7 +315,7 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
<Tooltip content={t("copy_link") as string}>
<Button
color="minimal"
color="minimalSecondary"
size="icon"
StartIcon={Icon.FiLink}
disabled={type.$disabled}
@@ -328,7 +328,7 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
</div>
<Dropdown>
<DropdownMenuTrigger
className="focus:ring-brand-900 flex h-[36px] w-[36px] justify-center rounded-md bg-transparent text-gray-700 hover:bg-gray-100 focus:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-offset-1"
className="focus:ring-brand-900 flex h-[36px] w-[36px] justify-center rounded-md border border-transparent bg-transparent text-gray-700 hover:border-gray-300 hover:bg-gray-100 focus:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-offset-1"
data-testid={"event-type-options-" + type.id}>
<Icon.FiMoreHorizontal className="h-5 w-5 group-hover:text-gray-800" />
</DropdownMenuTrigger>
apps/web/public/static/locales/en/common.json
+3 -1
View File
@@ -307,6 +307,7 @@
"recurring_bookings": "As soon as someone books a recurring meeting with you it will show up here.",
"past_bookings": "Your past bookings will show up here.",
"cancelled_bookings": "Your cancelled bookings will show up here.",
"unconfirmed_bookings": "Your unconfirmed bookings will show up here.",
"on": "on",
"and": "and",
"calendar_shows_busy_between": "Your calendar shows you as busy between",
@@ -1086,5 +1087,6 @@
"old_password": "Old password",
"secure_password": "Your new super secure password",
"error_updating_password": "Error updating password",
"two_factor_auth": "Two factor authentication"
"two_factor_auth": "Two factor authentication",
"recurring_event_tab_description": "Set up a repeating schedule"
}
packages/ui/v2/core/Button.tsx
+9 -4
View File
@@ -43,6 +43,8 @@ const variantClassName = {
secondary: "border border-gray-200 text-brand-900 bg-white hover:bg-gray-100",
minimal:
"text-gray-700 bg-transparent hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:bg-gray-100 focus:ring-brand-900 dark:text-darkgray-900 hover:dark:text-gray-50",
minimalSecondary:
"text-gray-700 bg-transparent hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:bg-gray-100 focus:ring-brand-900 dark:text-darkgray-900 hover:dark:text-gray-50 border border-transparent hover:border-gray-300",
destructive:
"text-gray-700 bg-transparent hover:bg-red-100 hover:text-red-700 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:bg-red-100 focus:ring-red-700",
};
@@ -50,6 +52,7 @@ const variantDisabledClassName = {
primary: "border border-transparent bg-brand-500 bg-opacity-20 text-white",
secondary: "border border-gray-200 text-brand-900 bg-white opacity-30",
minimal: "text-gray-400 bg-transparent",
minimalSecondary: "text-gray-400 bg-transparent",
destructive: "text-red-700 bg-transparent opacity-30",
};
@@ -84,10 +87,12 @@ export const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, ButtonPr
// base styles independent what type of button it is
"inline-flex justify-center items-center text-sm font-medium relative",
// different styles depending on size
size === "base" && "h-9 px-4 py-2.5 rounded-md ",
size === "lg" && "h-[36px] px-4 py-2.5 rounded-md",
size === "icon" && "flex justify-center h-[36px] w-[36px] rounded-md",
combined && "rounded-none first:border-r-0 last:border-l-0 first:rounded-l-md last:rounded-r-md ",
size === "base" && "h-9 px-4 py-2.5 ",
size === "lg" && "h-[36px] px-4 py-2.5 ",
size === "icon" && "flex justify-center h-[36px] w-[36px] ",
combined
? "rounded-none first:border-r-0 last:border-l-0 first:rounded-l-md last:rounded-r-md "
: "rounded-md",
// different styles depending on color
// set not-allowed cursor if disabled
disabled ? variantDisabledClassName[color] : variantClassName[color],
packages/ui/v2/core/EmptyScreen.tsx
+1 -1
View File
@@ -23,7 +23,7 @@ export default function EmptyScreen({
}) {
return (
<>
<div className="min-h-80 my-6 flex w-full flex-col items-center justify-center rounded-sm border border-dashed p-7 lg:p-20">
<div className="min-h-80 flex w-full flex-col items-center justify-center rounded-md border border-dashed p-7 lg:p-20">
<div className="flex h-[72px] w-[72px] items-center justify-center rounded-full bg-gray-200 dark:bg-white">
<Icon className="inline-block h-10 w-10 text-white dark:bg-gray-900 dark:text-gray-600" />
</div>
packages/ui/v2/core/Switch.tsx
+5 -2
View File
@@ -18,12 +18,15 @@ const Switch = (
<PrimitiveSwitch.Root
className={classNames(
props.checked ? "bg-gray-900" : "bg-gray-200 hover:bg-gray-300",
"focus:ring-brand-800 h-[24px] w-[40px] rounded-full p-0.5 shadow-none focus:ring-1"
"focus:ring-brand-800 h-[24px] w-[40px] rounded-full p-0.5 shadow-inner focus:ring-1"
)}
{...primitiveProps}>
<PrimitiveSwitch.Thumb
id={id}
className="block h-[18px] w-[18px] translate-x-0 rounded-full bg-white transition-transform"
className={classNames(
"block h-[18px] w-[18px] translate-x-0 rounded-full bg-white shadow-md transition-transform",
props.checked && "shadow-inner"
)}
/>
</PrimitiveSwitch.Root>
{label && (
packages/ui/v2/core/layouts/BookingLayout.tsx
+9 -3
View File
@@ -11,10 +11,16 @@ const tabs: VerticalTabItemProps[] = [
href: "/bookings/upcoming",
icon: Icon.FiCalendar,
},
// TODO: Add filter for unconfimred bookings in a future PR - Out of scope
// {
// name: "unconfirmed",
// href: "/bookings/unconfirmed",
// icon: Icon.FiInbox,
// },
{
name: "Unconfirmed",
href: "/bookings/unconfirmed",
icon: Icon.FiInbox,
name: "recurring",
href: "/bookings/recurring",
icon: Icon.FiRotateCcw,
},
{
name: "past",
packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx
+8 -3
View File
@@ -7,6 +7,7 @@ import { FC, Fragment, MouseEventHandler } from "react";
import classNames from "@calcom/lib/classNames";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { SVGComponent } from "@calcom/types/SVGComponent";
import { Icon } from "@calcom/ui/Icon";
export type VerticalTabItemProps = {
name: string;
@@ -74,11 +75,15 @@ const VerticalTabItem: FC<VerticalTabItemProps> = ({ name, href, tabName, info,
<p>{t(name)}</p>
{info && <p className="pt-1 text-xs font-normal">{t(info)}</p>}
</div>
{/* {isCurrent && (
{isCurrent && (
<div className="ml-auto self-center">
<ChevronRight width={20} height={20} className="h-auto w-[20px] stroke-[1.5px]" />
<Icon.FiChevronRight
width={20}
height={20}
className="h-auto w-[20px] stroke-[1.5px] text-gray-700"
/>
</div>
)} */}
)}
</a>
</Link>
{props.children?.map((child) => (
packages/ui/v2/modules/booker/DatePicker.tsx
+3 -3
View File
@@ -43,12 +43,12 @@ export const Day = ({
<button
style={props.disabled ? { ...disabledDateButtonEmbedStyles } : { ...enabledDateButtonEmbedStyles }}
className={classNames(
"disabled:text-bookinglighter absolute top-0 left-0 right-0 bottom-0 mx-auto w-full rounded-md border-2 border-transparent text-center font-medium hover:bg-gray-300 disabled:cursor-default disabled:border-transparent disabled:font-light dark:hover:border-white disabled:dark:border-transparent",
"disabled:text-bookinglighter absolute top-0 left-0 right-0 bottom-0 mx-auto w-full rounded-md border-2 border-transparent text-center font-medium disabled:cursor-default disabled:border-transparent disabled:font-light dark:hover:border-white disabled:dark:border-transparent",
active
? "dark:bg-darkmodebrand dark:text-darkmodebrandcontrast bg-brand text-brandcontrast border-2"
: !props.disabled
? "dark:bg-darkgray-200 bg-gray-100 dark:text-white"
: "hover:bg-transparent"
? "dark:bg-darkgray-200 bg-gray-100 hover:bg-gray-300 dark:text-white"
: ""
)}
data-testid="day"
data-disabled={props.disabled}