@bikiran/utils 2.1.4 → 2.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -5,8 +5,9 @@ import { useEffect } from "react";
|
|
|
5
5
|
import AppAccount from "./components/AppAccount";
|
|
6
6
|
import ServiceApp from "./components/ServiceApp";
|
|
7
7
|
import { serviceIcons } from "./icons/Icons";
|
|
8
|
+
import style from './style/Service.module.css';
|
|
8
9
|
const ButtonClose = ({ onClick, ImageComponent }) => {
|
|
9
|
-
return (_jsx("div", { onClick: onClick, className:
|
|
10
|
+
return (_jsx("div", { onClick: onClick, className: style.closeBtn, children: _jsx(ImageComponent, { src: serviceIcons.iconCross, alt: "cross", width: 100, height: 100, sizes: "100vw", className: "w-full h-auto rounded-full" }) }));
|
|
10
11
|
};
|
|
11
12
|
const ServicesPopup = ({ auth, apps = [], setShow, ref, applicationData, LinkComponent, ImageComponent, }) => {
|
|
12
13
|
var _a;
|
|
@@ -26,10 +27,10 @@ const ServicesPopup = ({ auth, apps = [], setShow, ref, applicationData, LinkCom
|
|
|
26
27
|
? apps.filter((a) => a.status !== "inactive")
|
|
27
28
|
: (applicationData === null || applicationData === void 0 ? void 0 : applicationData.filter((a) => a.status !== "inactive")) || [];
|
|
28
29
|
const staticAppLogo = ((_a = auth === null || auth === void 0 ? void 0 : auth.currentUser) === null || _a === void 0 ? void 0 : _a.photoUrl) || "";
|
|
29
|
-
return (_jsx("div", { className:
|
|
30
|
+
return (_jsx("div", { className: style.popupContainer, children: _jsxs("div", { className: style.popupWrapper, children: [_jsx("div", { className: "flex items-center justify-end sm:hidden", children: _jsx(ButtonClose, { onClick: (ev) => {
|
|
30
31
|
ev.stopPropagation();
|
|
31
32
|
ev.preventDefault();
|
|
32
33
|
setShow(false);
|
|
33
|
-
}, ImageComponent: ImageComponent }) }), _jsxs("div", { className:
|
|
34
|
+
}, ImageComponent: ImageComponent }) }), _jsxs("div", { className: style.serviceListContainer, children: [_jsx(AppAccount, { logo: staticAppLogo, LinkComponent: LinkComponent, ImageComponent: ImageComponent }), arr.map((app) => (_jsx(ServiceApp, { app: app, LinkComponent: LinkComponent, ImageComponent: ImageComponent }, app.id)))] })] }) }));
|
|
34
35
|
};
|
|
35
36
|
export default ServicesPopup;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { serviceIcons } from "../icons/Icons";
|
|
3
|
+
import style from "../style/Service.module.css";
|
|
3
4
|
const ServiceApp = ({ app, LinkComponent, ImageComponent }) => {
|
|
4
|
-
return (_jsx("div", { className: " relative flex justify-end", children: _jsxs(LinkComponent, { href: app.website, referrerPolicy: "no-referrer", target: "_blank", className:
|
|
5
|
+
return (_jsx("div", { className: " relative flex justify-end", children: _jsxs(LinkComponent, { href: app.website, referrerPolicy: "no-referrer", target: "_blank", className: style.serviceItem, children: [_jsx("div", { className: style.serviceLogo, children: _jsx(ImageComponent, { src: (app === null || app === void 0 ? void 0 : app.logo) || serviceIcons.iconDefault, alt: app === null || app === void 0 ? void 0 : app.name, width: 50, height: 50, priority: true, className: "w-full h-full object-contain" }) }), _jsx("p", { className: style.serviceName, children: app === null || app === void 0 ? void 0 : app.name })] }) }));
|
|
5
6
|
};
|
|
6
7
|
export default ServiceApp;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
.popupContainer {
|
|
2
|
+
@apply sm:absolute fixed sm:top-11 top-0 sm:-right-8 -right-0 z-[999] p-2.5 pr-1 bg-[#F7F3F8] shadow-[0px_0px_30px_0px_rgba(19,15,64,0.20)] sm:rounded-30 w-screen sm:w-98 h-screen sm:h-[520px] overflow-hidden;
|
|
3
|
+
}
|
|
4
|
+
.popupWrapper {
|
|
5
|
+
@apply "h-full bg-white rounded-[22px] p-[23px] pt-3 overflow-y-scroll custom-scrollbar cursor-default";
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
.closeBtn {
|
|
9
|
+
@apply size-[32px] bg-[rgba(245,3,3,0.10)] rounded-full p-2 ml-3;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.serviceListContainer {
|
|
13
|
+
@apply grid grid-cols-3 gap-3 sm:mt-0 mt-5;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.serviceItem {
|
|
17
|
+
@apply w-full h-[100px] border border-primary-100 bg-white rounded-[18px] px-4 pt-[8px] overflow-hidden flex flex-col justify-center items-center cursor-pointer;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.serviceLogo {
|
|
21
|
+
@apply size-[35px] sm:size-[50px] mb-[6px];
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.serviceName {
|
|
25
|
+
@apply text-primary-700 text-xs font-medium whitespace-nowrap overflow-hidden text-ellipsis;
|
|
26
|
+
}
|