chore/trigger operations btns redesign (#477)

* updated

* delete handler

* review

* fix

* timezone 0 sign

src/Components/ConfirmDeleteModal/ConfirmDeleteModal.tsx

@@ -5,7 +5,7 @@ interface ConfirmDeleteModalProps {
     message: string;
     children?: React.ReactNode;
     onClose: () => void;
-    onDelete?: () => Promise<void>;
+    onDelete?: () => void;
 }
 
 export const ConfirmDeleteModal = (props: ConfirmDeleteModalProps): JSX.Element => (

src/Components/ContactEditModal/ContactEditModal.tsx

@@ -71,6 +71,7 @@ export default class ContactEditModal extends React.Component<Props, State> {
                             Save and test
                         </Button>
                         <FileExport
+                            isButton
                             title={`delivery channel ${contactInfo.type} ${contactInfo.value}`}
                             data={omitContact(contactInfo)}
                         >

src/Components/FileExport/FileExport.tsx

@@ -10,18 +10,26 @@ type FileExportProps = {
     title: string;
     data: Partial<Trigger | Subscription | Contact>;
     children?: React.ReactNode;
+    isButton?: boolean;
 };
 
-export default function FileExport({ title, data, children }: FileExportProps): React.ReactElement {
+export default function FileExport({
+    title,
+    data,
+    children,
+    isButton,
+}: FileExportProps): React.ReactElement {
     const handleExport = () => {
         const fileData = JSON.stringify(data, undefined, 4);
         const blob = new Blob([fileData], { type: "application/json" });
         saveAs(blob, `${title}.json`);
     };
 
-    return (
+    return isButton ? (
         <Button use="link" onClick={handleExport} icon={<ExportIcon />}>
             {children || "Export"}
         </Button>
+    ) : (
+        <span onClick={handleExport}>{children || "Export"}</span>
     );
 }

src/Components/SubscriptionEditModal/SubscriptionEditModal.tsx

@@ -79,6 +79,7 @@ export default class SubscriptionEditModal extends React.Component<Props, State>
                             Save and test
                         </Button>
                         <FileExport
+                            isButton
                             title={this.getFileName()}
                             data={omitSubscription(subscription)}
                         >

src/Components/TriggerInfo/Components/LinkMenuItem.tsx

@@ -0,0 +1,32 @@
+import React from "react";
+import { Link } from "@skbkontur/react-ui/components/Link";
+import { MenuItem } from "@skbkontur/react-ui";
+
+interface ILinkMenuItemProps {
+    link?: string;
+    icon?: React.ReactElement;
+    onClick?: () => void;
+    children: React.ReactElement | string;
+}
+
+export const LinkMenuItem = ({ link, icon, onClick, children }: ILinkMenuItemProps) => {
+    return (
+        <MenuItem
+            href={link}
+            component={({ href, ...rest }) => {
+                return (
+                    <Link
+                        onClick={onClick}
+                        icon={icon}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        href={href}
+                        {...rest}
+                    />
+                );
+            }}
+        >
+            {children}
+        </MenuItem>
+    );
+};

src/Components/TriggerInfo/Components/ScheduleView.tsx

@@ -0,0 +1,28 @@
+import React from "react";
+import { Schedule } from "../../../Domain/Schedule";
+import { format, addMinutes, startOfDay } from "date-fns";
+import { getUTCDate } from "../../../helpers/DateUtil";
+
+export function ScheduleView(props: { data: Schedule }): React.ReactElement {
+    const { data } = props;
+    const { days, startOffset, endOffset, tzOffset } = data;
+
+    const startTime = format(addMinutes(startOfDay(getUTCDate()), startOffset), "HH:mm");
+
+    const endTime = format(addMinutes(startOfDay(getUTCDate()), endOffset), "HH:mm");
+
+    const timeZone = format(addMinutes(startOfDay(getUTCDate()), Math.abs(tzOffset)), "HH:mm");
+
+    const timeZoneSign = tzOffset < 0 ? "+" : "−";
+    const enabledDays = days.filter(({ enabled }) => enabled);
+
+    return (
+        <>
+            {days.length === enabledDays.length
+                ? "Everyday"
+                : enabledDays.map(({ name }) => name).join(", ")}{" "}
+            {startTime}—{endTime} (GMT {tzOffset !== 0 && timeZoneSign}
+            {timeZone})
+        </>
+    );
+}