@oxyhq/services 0.0.83 → 0.0.85
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.
- package/dist/components/auth/AccountSwitcherModal.d.ts.map +1 -1
- package/dist/components/auth/AccountSwitcherModal.js +37 -33
- package/dist/components/auth/styles/account-switcher-modal.module.css +20 -26
- package/dist/components/auth/styles/account-switcher-modal.module.css.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccountSwitcherModal.d.ts","sourceRoot":"","sources":["../../../src/components/auth/AccountSwitcherModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"AccountSwitcherModal.d.ts","sourceRoot":"","sources":["../../../src/components/auth/AccountSwitcherModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA8B/B,UAAU,yBAAyB;IACjC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,oBAAoB,kGA6I/B,CAAC"}
|
|
@@ -6,6 +6,7 @@ import useOxySession from "../../hooks/useOxySession";
|
|
|
6
6
|
import { forwardRef } from "react";
|
|
7
7
|
import { AiOutlineClose } from "react-icons/ai";
|
|
8
8
|
import { Avatar } from "../../features/profile";
|
|
9
|
+
import { MdHistory, MdDelete, MdInterests, MdTune, MdSecurity, MdLanguage, } from "react-icons/md";
|
|
9
10
|
import getUserById from "../../hooks/getUserById";
|
|
10
11
|
import styles from "./styles/account-switcher-modal.module.css";
|
|
11
12
|
export const AccountSwitcherModal = forwardRef((props, ref) => {
|
|
@@ -44,39 +45,42 @@ export const AccountSwitcherModal = forwardRef((props, ref) => {
|
|
|
44
45
|
ease: "easeInOut",
|
|
45
46
|
duration: 0.2,
|
|
46
47
|
}, className: styles.container, role: "group", onClick: handleBackdropClick, ref: ref },
|
|
47
|
-
React.createElement("div", { className: "
|
|
48
|
-
React.createElement("div", { className: "flex
|
|
49
|
-
React.createElement(
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
React.createElement("
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
React.createElement("
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
React.createElement("
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
React.createElement(
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
48
|
+
React.createElement("div", { className: "flex justify-between items-center p-4 border-b" },
|
|
49
|
+
React.createElement("div", { className: "flex items-center space-x-2" },
|
|
50
|
+
React.createElement(Avatar, { userImage: session?.user?.avatar, className: "h-10 w-10 rounded-full object-center", draggable: false, alt: "avatar" }),
|
|
51
|
+
React.createElement("p", { className: "text-sm font-medium" }, session?.user?.email)),
|
|
52
|
+
React.createElement("button", { className: "p-2 hover:bg-gray-100 rounded-full" }, "Close")),
|
|
53
|
+
React.createElement("div", { className: "p-2 space-y-2" },
|
|
54
|
+
React.createElement("h2", { className: "text-2xl font-bold" },
|
|
55
|
+
"Hi, ",
|
|
56
|
+
session?.user?.name,
|
|
57
|
+
"!"),
|
|
58
|
+
React.createElement("div", null,
|
|
59
|
+
React.createElement("button", { className: "w-full py-2 px-4 border rounded-full rounded-b-md text-blue-600 bg-indigo-50 p-1 hover:bg-zinc-200" }, "Manage your Oxy Account"),
|
|
60
|
+
React.createElement("button", { className: "w-full py-2 px-4 border rounded-full rounded-t-md text-left flex justify-between items-center bg-indigo-50 p-1 hover:bg-zinc-200" }, "Show more accounts")),
|
|
61
|
+
React.createElement("div", { className: "pt-2" },
|
|
62
|
+
React.createElement("p", { className: "text-sm text-gray-500 mb-2" }, "More from Oxy Services"),
|
|
63
|
+
React.createElement("div", { className: "space-y-2" }, [
|
|
64
|
+
{ icon: MdHistory, text: "Search history", rightText: "Saving" },
|
|
65
|
+
{ icon: MdDelete, text: "Delete last 15 minutes" },
|
|
66
|
+
{ icon: MdInterests, text: "Interests" },
|
|
67
|
+
{ icon: MdTune, text: "Search personalisation" },
|
|
68
|
+
{
|
|
69
|
+
icon: MdSecurity,
|
|
70
|
+
text: "SafeSearch",
|
|
71
|
+
rightText: "Blurring on",
|
|
72
|
+
},
|
|
73
|
+
{ icon: MdLanguage, text: "Language", rightText: "English" },
|
|
74
|
+
].map((item, index) => (React.createElement("button", { key: index, className: "w-full py-2 px-4 flex items-center justify-start hover:bg-gray-100 rounded-md" },
|
|
75
|
+
item.icon &&
|
|
76
|
+
React.createElement(item.icon, {
|
|
77
|
+
className: "h-5 w-5 mr-3",
|
|
78
|
+
}),
|
|
79
|
+
React.createElement("span", { className: "flex-grow text-left" }, item.text),
|
|
80
|
+
item.rightText && (React.createElement("span", { className: "text-sm text-gray-500" }, item.rightText)))))))),
|
|
81
|
+
React.createElement("div", { className: "flex justify-between p-4 border-t" },
|
|
82
|
+
React.createElement("button", { className: "w-1/2 py-2 px-4 flex items-center justify-center hover:bg-gray-100 rounded-md" }, "More settings"),
|
|
83
|
+
React.createElement("button", { className: "w-1/2 py-2 px-4 flex items-center justify-center hover:bg-gray-100 rounded-md" }, "Help")),
|
|
80
84
|
React.createElement("button", { className: "absolute right-3 top-3 rounded-full bg-indigo-50 p-1 hover:bg-zinc-200", onClick: onClose },
|
|
81
85
|
React.createElement(AiOutlineClose, { className: "h-5 w-5 rounded-full stroke-2 text-zinc-700" })),
|
|
82
86
|
React.createElement("div", { className: "flex h-10 items-center space-x-2 text-xs" },
|
|
@@ -1,35 +1,29 @@
|
|
|
1
1
|
.container {
|
|
2
|
-
width: 300px;
|
|
3
|
-
background-color: var(--clr-background);
|
|
4
|
-
box-shadow: 0 0rem 10px -2px var(--clr-tertiary);
|
|
5
|
-
border-radius: 1rem;
|
|
6
|
-
padding: 0.8em 0;
|
|
7
|
-
overflow: hidden;
|
|
8
2
|
position: fixed;
|
|
9
3
|
top: 0;
|
|
10
4
|
bottom: 0;
|
|
11
5
|
left: 0;
|
|
12
6
|
right: 0;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
7
|
+
@apply w-full max-w-md mx-auto bg-white shadow-lg rounded-xl;
|
|
8
|
+
}
|
|
9
|
+
.container a {
|
|
10
|
+
font-size: var(--fs-milli);
|
|
11
|
+
font-weight: var(--fw-700);
|
|
12
|
+
display: block;
|
|
13
|
+
padding: 0.8em 1em;
|
|
14
|
+
cursor: pointer;
|
|
15
|
+
transition: background-color 0.1s ease-in-out;
|
|
16
|
+
}
|
|
17
|
+
.container a:hover {
|
|
18
|
+
background-color: var(--clr-trends-hover);
|
|
19
|
+
}
|
|
20
|
+
.container a:active {
|
|
21
|
+
background-color: var(--clr-trends-active);
|
|
22
|
+
}
|
|
23
|
+
.container a:focus-visible {
|
|
24
|
+
background-color: var(--clr-trends-hover);
|
|
25
|
+
outline: 2px solid var(--clr-primary-disabled);
|
|
26
|
+
outline-offset: -2px;
|
|
33
27
|
}
|
|
34
28
|
|
|
35
29
|
/*# sourceMappingURL=account-switcher-modal.module.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../../../../src/components/auth/styles/account-switcher-modal.module.
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../../../../src/components/auth/styles/account-switcher-modal.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA","file":"account-switcher-modal.module.css"}
|