@soppiya/app-bridge 1.1.2 → 1.1.4
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/articles-picker/ui/ArticlesPicker.js +13 -7
- package/dist/components/blogs-picker/ui/BlogsPicker.js +13 -7
- package/dist/components/collections-pciker/ui/CollectionPicker.js +16 -10
- package/dist/components/collections-pciker/ui/CollectionPicker.stories.d.ts +1 -4
- package/dist/components/collections-pciker/ui/CollectionPicker.stories.js +1 -4
- package/dist/components/link-list-picker/ui/LinkListPicker.js +15 -9
- package/dist/components/meta-data/index.d.ts +1 -1
- package/dist/components/meta-data/ui/MetaData.d.ts +7 -5
- package/dist/components/meta-data/ui/MetaData.js +11 -16
- package/dist/components/meta-data/ui/MetaData.stories.js +15 -7
- package/dist/components/metafield-entries/api/query.d.ts +8 -0
- package/dist/components/metafield-entries/api/query.js +18 -0
- package/dist/components/metafield-entries/index.d.ts +0 -0
- package/dist/components/metafield-entries/index.js +0 -0
- package/dist/components/metafield-entries/model/useMetaobjectEntries.d.ts +25 -0
- package/dist/components/metafield-entries/model/useMetaobjectEntries.js +46 -0
- package/dist/components/metafield-entries/ui/MetaobjectEntries.d.ts +10 -0
- package/dist/components/metafield-entries/ui/MetaobjectEntries.js +108 -0
- package/dist/components/metafield-entries/ui/MetaobjectEntries.stories.d.ts +15 -0
- package/dist/components/metafield-entries/ui/MetaobjectEntries.stories.js +10 -0
- package/dist/components/pages-picker/ui/PagesPicker.js +19 -11
- package/dist/components/products-picker/ui/ProductPicker.js +16 -10
- package/dist/components/variants-picker/ui/VariantsPicker.js +13 -7
- package/dist/shared/graphql/gql.d.ts +5 -0
- package/dist/shared/graphql/gql.js +2 -1
- package/dist/shared/graphql/graphql.d.ts +29 -0
- package/dist/shared/graphql/graphql.js +299 -1
- package/dist/styles.css +12 -4
- package/package.json +1 -1
|
@@ -2,19 +2,23 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { InfinityScroll } from "../../infinity-scroll/index.js";
|
|
3
3
|
import { useFilterQuery } from "../../../shared/lib/index.js";
|
|
4
4
|
import { BlockStack, Box, Button, Checkbox, Image, InlineStack, Input, Modal, Spinner, Text } from "@soppiya/elementus";
|
|
5
|
+
import classnames from "classnames";
|
|
5
6
|
import lodash from "lodash";
|
|
6
7
|
import { useState } from "react";
|
|
7
8
|
import { userArticles } from "../model/useArticles.js";
|
|
8
|
-
const ArticlesPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
9
|
+
const ArticlesPicker = ({ title = "Articles", initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
9
10
|
const [selectedVariant, setSelectedVariant] = useState(initialIds);
|
|
10
11
|
const { query, debounceQuery, onChangeQuery } = useFilterQuery();
|
|
11
12
|
const { articles, pageInfo, isLoadingArticles, fetchMoreArticles } = userArticles({
|
|
12
13
|
first: 20,
|
|
13
14
|
query: debounceQuery
|
|
14
15
|
});
|
|
15
|
-
const
|
|
16
|
+
const isReached = limit !== 1 / 0 && selectedVariant.length >= limit;
|
|
17
|
+
const isDisabled = limit !== 1 / 0 && selectedVariant.length > limit;
|
|
16
18
|
const handleSelectVariant = (articleId)=>{
|
|
17
|
-
selectedVariant?.includes(articleId)
|
|
19
|
+
if (selectedVariant?.includes(articleId)) return void setSelectedVariant((prev)=>prev?.filter((id)=>articleId !== id));
|
|
20
|
+
if (isReached) return;
|
|
21
|
+
setSelectedVariant((prev)=>[
|
|
18
22
|
...prev,
|
|
19
23
|
articleId
|
|
20
24
|
]);
|
|
@@ -26,21 +30,20 @@ const ArticlesPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk }
|
|
|
26
30
|
gap: 50,
|
|
27
31
|
justifyContent: "end",
|
|
28
32
|
children: /*#__PURE__*/ jsx(Button, {
|
|
29
|
-
disabled: lodash.isEmpty(selectedVariant) ||
|
|
33
|
+
disabled: lodash.isEmpty(selectedVariant) || isDisabled,
|
|
30
34
|
onClick: handleOk,
|
|
31
35
|
children: "Add"
|
|
32
36
|
})
|
|
33
37
|
});
|
|
34
38
|
return /*#__PURE__*/ jsx(Modal, {
|
|
35
39
|
open: true,
|
|
36
|
-
title: title
|
|
40
|
+
title: title,
|
|
37
41
|
bodyPadding: 0,
|
|
38
42
|
buttons: ButtonJSX,
|
|
39
43
|
onClose: onClose,
|
|
40
44
|
children: /*#__PURE__*/ jsxs(BlockStack, {
|
|
41
45
|
children: [
|
|
42
46
|
/*#__PURE__*/ jsx(Box, {
|
|
43
|
-
className: "border-b border-b-[#ebebeb]! h",
|
|
44
47
|
padding: 60,
|
|
45
48
|
children: /*#__PURE__*/ jsx(Input, {
|
|
46
49
|
size: "sm",
|
|
@@ -59,7 +62,9 @@ const ArticlesPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk }
|
|
|
59
62
|
children: [
|
|
60
63
|
articles?.map((article)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
61
64
|
stack: "full",
|
|
62
|
-
className:
|
|
65
|
+
className: classnames('lg:cursor-pointer border-t border-t-[#ebebeb]!', {
|
|
66
|
+
'bg-[#f1f1f1ab] cursor-default!': !selectedVariant.includes(article._id) && isReached
|
|
67
|
+
}),
|
|
63
68
|
gapX: 60,
|
|
64
69
|
padding: 60,
|
|
65
70
|
onClick: ()=>handleSelectVariant(String(article._id)),
|
|
@@ -70,6 +75,7 @@ const ArticlesPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk }
|
|
|
70
75
|
children: [
|
|
71
76
|
/*#__PURE__*/ jsx(Box, {
|
|
72
77
|
children: /*#__PURE__*/ jsx(Checkbox, {
|
|
78
|
+
disabled: !selectedVariant.includes(article._id) && isReached,
|
|
73
79
|
checked: selectedVariant.includes(String(article._id)),
|
|
74
80
|
onChange: ()=>{}
|
|
75
81
|
})
|
|
@@ -2,19 +2,23 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { InfinityScroll } from "../../infinity-scroll/index.js";
|
|
3
3
|
import { useFilterQuery } from "../../../shared/lib/index.js";
|
|
4
4
|
import { BlockStack, Box, Button, Checkbox, Image, InlineStack, Input, Modal, Spinner, Text } from "@soppiya/elementus";
|
|
5
|
+
import classnames from "classnames";
|
|
5
6
|
import lodash from "lodash";
|
|
6
7
|
import { useState } from "react";
|
|
7
8
|
import { useBlogs } from "../model/useBlogs.js";
|
|
8
|
-
const BlogsPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
9
|
+
const BlogsPicker = ({ title = "Blogs", initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
9
10
|
const [selectedBlog, setSelectedBlog] = useState(initialIds);
|
|
10
11
|
const { query, debounceQuery, onChangeQuery } = useFilterQuery();
|
|
11
12
|
const { blogs, isLoadingBlogs, fetchMoreBlogs, pageInfo } = useBlogs({
|
|
12
13
|
first: 20,
|
|
13
14
|
query: debounceQuery
|
|
14
15
|
});
|
|
15
|
-
const
|
|
16
|
+
const isReached = limit !== 1 / 0 && selectedBlog.length >= limit;
|
|
17
|
+
const isDisabled = limit !== 1 / 0 && selectedBlog.length > limit;
|
|
16
18
|
const handleSelectedBlog = (blogId)=>{
|
|
17
|
-
selectedBlog
|
|
19
|
+
if (selectedBlog?.includes(blogId)) return void setSelectedBlog((prev)=>prev?.filter((id)=>blogId !== id));
|
|
20
|
+
if (isReached) return;
|
|
21
|
+
setSelectedBlog((prev)=>[
|
|
18
22
|
...prev,
|
|
19
23
|
blogId
|
|
20
24
|
]);
|
|
@@ -26,20 +30,19 @@ const BlogsPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk })=>
|
|
|
26
30
|
justifyContent: "end",
|
|
27
31
|
children: /*#__PURE__*/ jsx(Button, {
|
|
28
32
|
onClick: handleOk,
|
|
29
|
-
disabled: lodash.isEmpty(selectedBlog) ||
|
|
33
|
+
disabled: lodash.isEmpty(selectedBlog) || isDisabled,
|
|
30
34
|
children: "Add"
|
|
31
35
|
})
|
|
32
36
|
});
|
|
33
37
|
return /*#__PURE__*/ jsx(Modal, {
|
|
34
38
|
open: true,
|
|
35
|
-
title: title
|
|
39
|
+
title: title,
|
|
36
40
|
buttons: ButtonJSX,
|
|
37
41
|
bodyPadding: 0,
|
|
38
42
|
onClose: onClose,
|
|
39
43
|
children: /*#__PURE__*/ jsxs(BlockStack, {
|
|
40
44
|
children: [
|
|
41
45
|
/*#__PURE__*/ jsx(Box, {
|
|
42
|
-
className: "border-b border-b-[#ebebeb]! h",
|
|
43
46
|
padding: 60,
|
|
44
47
|
children: /*#__PURE__*/ jsx(Input, {
|
|
45
48
|
size: "sm",
|
|
@@ -58,7 +61,9 @@ const BlogsPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk })=>
|
|
|
58
61
|
children: [
|
|
59
62
|
blogs?.map((blog)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
60
63
|
stack: "full",
|
|
61
|
-
className:
|
|
64
|
+
className: classnames('lg:cursor-pointer border-t border-t-[#ebebeb]!', {
|
|
65
|
+
'bg-[#f1f1f1ab] cursor-default!': !selectedBlog.includes(blog._id) && isReached
|
|
66
|
+
}),
|
|
62
67
|
gapX: 60,
|
|
63
68
|
padding: 60,
|
|
64
69
|
onClick: ()=>handleSelectedBlog(String(blog._id)),
|
|
@@ -69,6 +74,7 @@ const BlogsPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk })=>
|
|
|
69
74
|
children: [
|
|
70
75
|
/*#__PURE__*/ jsx(Box, {
|
|
71
76
|
children: /*#__PURE__*/ jsx(Checkbox, {
|
|
77
|
+
disabled: !selectedBlog.includes(blog._id) && isReached,
|
|
72
78
|
checked: selectedBlog.includes(String(blog._id)),
|
|
73
79
|
onChange: ()=>{}
|
|
74
80
|
})
|
|
@@ -2,43 +2,46 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { InfinityScroll } from "../../infinity-scroll/index.js";
|
|
3
3
|
import { useFilterQuery } from "../../../shared/lib/index.js";
|
|
4
4
|
import { BlockStack, Box, Button, Checkbox, Image, InlineStack, Input, Modal, Spinner, Text } from "@soppiya/elementus";
|
|
5
|
+
import classnames from "classnames";
|
|
5
6
|
import lodash from "lodash";
|
|
6
7
|
import { useState } from "react";
|
|
7
8
|
import { useCollections } from "../model/useCollections.js";
|
|
8
|
-
const CollectionPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
9
|
-
const [
|
|
9
|
+
const CollectionPicker = ({ title = "Collections", initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
10
|
+
const [selectedCollection, setSelectedCollection] = useState(initialIds);
|
|
10
11
|
const { query, debounceQuery, onChangeQuery } = useFilterQuery();
|
|
11
12
|
const { collections, isLoadingCollections, fetchMoreCollections, pageInfo } = useCollections({
|
|
12
13
|
query: debounceQuery
|
|
13
14
|
});
|
|
14
|
-
const
|
|
15
|
+
const isReached = limit !== 1 / 0 && selectedCollection.length >= limit;
|
|
16
|
+
const isDisabled = limit !== 1 / 0 && selectedCollection.length > limit;
|
|
15
17
|
const handleSelectVariant = (productId)=>{
|
|
16
|
-
|
|
18
|
+
if (selectedCollection.includes(productId)) return void setSelectedCollection((prev)=>prev.filter((id)=>productId !== id));
|
|
19
|
+
if (isReached) return;
|
|
20
|
+
setSelectedCollection((prev)=>[
|
|
17
21
|
...prev,
|
|
18
22
|
productId
|
|
19
23
|
]);
|
|
20
24
|
};
|
|
21
25
|
const handleOk = ()=>{
|
|
22
|
-
if (lodash.isFunction(onOk)) onOk(
|
|
26
|
+
if (lodash.isFunction(onOk)) onOk(selectedCollection);
|
|
23
27
|
};
|
|
24
28
|
const ButtonJSX = /*#__PURE__*/ jsx(InlineStack, {
|
|
25
29
|
justifyContent: "end",
|
|
26
30
|
children: /*#__PURE__*/ jsx(Button, {
|
|
27
|
-
disabled: lodash.isEmpty(
|
|
31
|
+
disabled: lodash.isEmpty(selectedCollection) || isDisabled,
|
|
28
32
|
onClick: handleOk,
|
|
29
33
|
children: "Add"
|
|
30
34
|
})
|
|
31
35
|
});
|
|
32
36
|
return /*#__PURE__*/ jsx(Modal, {
|
|
33
37
|
open: true,
|
|
34
|
-
title: title
|
|
38
|
+
title: title,
|
|
35
39
|
bodyPadding: 0,
|
|
36
40
|
buttons: ButtonJSX,
|
|
37
41
|
onClose: onClose,
|
|
38
42
|
children: /*#__PURE__*/ jsxs(BlockStack, {
|
|
39
43
|
children: [
|
|
40
44
|
/*#__PURE__*/ jsx(Box, {
|
|
41
|
-
className: "border-b border-b-[#ebebeb]! h",
|
|
42
45
|
padding: 60,
|
|
43
46
|
children: /*#__PURE__*/ jsx(Input, {
|
|
44
47
|
size: "sm",
|
|
@@ -57,7 +60,9 @@ const CollectionPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk
|
|
|
57
60
|
children: [
|
|
58
61
|
collections?.map((collection)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
59
62
|
stack: "full",
|
|
60
|
-
className:
|
|
63
|
+
className: classnames('lg:cursor-pointer border-t border-t-[#ebebeb]!', {
|
|
64
|
+
'bg-[#f1f1f1ab] cursor-default!': !selectedCollection.includes(collection._id) && isReached
|
|
65
|
+
}),
|
|
61
66
|
gapX: 60,
|
|
62
67
|
padding: 60,
|
|
63
68
|
onClick: ()=>handleSelectVariant(String(collection._id)),
|
|
@@ -68,7 +73,8 @@ const CollectionPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk
|
|
|
68
73
|
children: [
|
|
69
74
|
/*#__PURE__*/ jsx(Box, {
|
|
70
75
|
children: /*#__PURE__*/ jsx(Checkbox, {
|
|
71
|
-
|
|
76
|
+
disabled: !selectedCollection.includes(collection._id) && isReached,
|
|
77
|
+
checked: selectedCollection.includes(String(collection._id)),
|
|
72
78
|
onChange: ()=>{}
|
|
73
79
|
})
|
|
74
80
|
}),
|
|
@@ -2,19 +2,23 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { InfinityScroll } from "../../infinity-scroll/index.js";
|
|
3
3
|
import { useFilterQuery } from "../../../shared/lib/index.js";
|
|
4
4
|
import { BlockStack, Box, Button, Checkbox, InlineStack, Input, Modal, Spinner, Text } from "@soppiya/elementus";
|
|
5
|
+
import classnames from "classnames";
|
|
5
6
|
import lodash from "lodash";
|
|
6
7
|
import { useState } from "react";
|
|
7
8
|
import { useLinklist } from "../model/useLinkList.js";
|
|
8
|
-
const
|
|
9
|
+
const LinkListPicker = ({ title = "Linklist", initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
9
10
|
const [selectedLinklist, setSelectedLinklist] = useState(initialIds);
|
|
10
11
|
const { query, debounceQuery, onChangeQuery } = useFilterQuery();
|
|
11
12
|
const { linklists, isLoadingLinklist, fetchMoreLinklists, pageInfo } = useLinklist({
|
|
12
13
|
first: 20,
|
|
13
14
|
query: debounceQuery
|
|
14
15
|
});
|
|
15
|
-
const
|
|
16
|
+
const isReached = limit !== 1 / 0 && selectedLinklist.length >= limit;
|
|
17
|
+
const isDisabled = limit !== 1 / 0 && selectedLinklist.length > limit;
|
|
16
18
|
const handleSelectedLinklist = (linkListId)=>{
|
|
17
|
-
selectedLinklist.includes(linkListId)
|
|
19
|
+
if (selectedLinklist.includes(linkListId)) return void setSelectedLinklist((prev)=>prev.filter((id)=>id !== linkListId));
|
|
20
|
+
if (isReached) return;
|
|
21
|
+
setSelectedLinklist((prev)=>[
|
|
18
22
|
...prev,
|
|
19
23
|
linkListId
|
|
20
24
|
]);
|
|
@@ -25,21 +29,20 @@ const LinkListPicker_LinkListPicker = ({ title, initialIds = [], limit = 1 / 0,
|
|
|
25
29
|
const ButtonJSX = /*#__PURE__*/ jsx(InlineStack, {
|
|
26
30
|
justifyContent: "end",
|
|
27
31
|
children: /*#__PURE__*/ jsx(Button, {
|
|
28
|
-
disabled: lodash.isEmpty(selectedLinklist) ||
|
|
32
|
+
disabled: lodash.isEmpty(selectedLinklist) || isDisabled,
|
|
29
33
|
onClick: handleOk,
|
|
30
34
|
children: "Add"
|
|
31
35
|
})
|
|
32
36
|
});
|
|
33
37
|
return /*#__PURE__*/ jsx(Modal, {
|
|
34
38
|
open: true,
|
|
35
|
-
title: title
|
|
39
|
+
title: title,
|
|
36
40
|
bodyPadding: 0,
|
|
37
41
|
buttons: ButtonJSX,
|
|
38
42
|
onClose: onClose,
|
|
39
43
|
children: /*#__PURE__*/ jsxs(BlockStack, {
|
|
40
44
|
children: [
|
|
41
45
|
/*#__PURE__*/ jsx(Box, {
|
|
42
|
-
className: "border-b border-b-[#ebebeb]! h",
|
|
43
46
|
padding: 60,
|
|
44
47
|
children: /*#__PURE__*/ jsx(Input, {
|
|
45
48
|
size: "sm",
|
|
@@ -58,7 +61,9 @@ const LinkListPicker_LinkListPicker = ({ title, initialIds = [], limit = 1 / 0,
|
|
|
58
61
|
children: [
|
|
59
62
|
linklists?.map((linklist)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
60
63
|
stack: "full",
|
|
61
|
-
className:
|
|
64
|
+
className: classnames('lg:cursor-pointer border-t border-t-[#ebebeb]!', {
|
|
65
|
+
'bg-[#f1f1f1ab] cursor-default!': !selectedLinklist.includes(linklist._id) && isReached
|
|
66
|
+
}),
|
|
62
67
|
gapX: 60,
|
|
63
68
|
padding: 60,
|
|
64
69
|
onClick: ()=>handleSelectedLinklist(String(linklist._id)),
|
|
@@ -68,6 +73,7 @@ const LinkListPicker_LinkListPicker = ({ title, initialIds = [], limit = 1 / 0,
|
|
|
68
73
|
gapX: 60,
|
|
69
74
|
children: /*#__PURE__*/ jsx(Box, {
|
|
70
75
|
children: /*#__PURE__*/ jsx(Checkbox, {
|
|
76
|
+
disabled: !selectedLinklist.includes(linklist._id) && isReached,
|
|
71
77
|
checked: selectedLinklist.includes(String(linklist._id)),
|
|
72
78
|
onChange: ()=>{}
|
|
73
79
|
})
|
|
@@ -94,5 +100,5 @@ const LinkListPicker_LinkListPicker = ({ title, initialIds = [], limit = 1 / 0,
|
|
|
94
100
|
})
|
|
95
101
|
});
|
|
96
102
|
};
|
|
97
|
-
const
|
|
98
|
-
export {
|
|
103
|
+
const ui_LinkListPicker = LinkListPicker;
|
|
104
|
+
export { ui_LinkListPicker as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default as MetaData } from "./ui/MetaData";
|
|
1
|
+
export { default as MetaData, type MetaFieldData } from "./ui/MetaData";
|
|
@@ -1,13 +1,15 @@
|
|
|
1
|
+
export type MetaFieldData = {
|
|
2
|
+
metafield: string;
|
|
3
|
+
value: string[];
|
|
4
|
+
};
|
|
1
5
|
interface Props {
|
|
6
|
+
title?: string;
|
|
2
7
|
scope: string;
|
|
3
|
-
|
|
4
|
-
metafield: string;
|
|
5
|
-
value: string[];
|
|
6
|
-
}[];
|
|
8
|
+
metafieldsData?: MetaFieldData[];
|
|
7
9
|
onChange?: (value: {
|
|
8
10
|
metafield: string;
|
|
9
11
|
value: string[];
|
|
10
12
|
}) => void;
|
|
11
13
|
}
|
|
12
|
-
declare const MetaData: ({ scope,
|
|
14
|
+
declare const MetaData: ({ title, scope, metafieldsData, onChange }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
13
15
|
export default MetaData;
|
|
@@ -1,33 +1,30 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Loading } from "../../../shared/loading/index.js";
|
|
3
3
|
import { BlockStack, Card, Text } from "@soppiya/elementus";
|
|
4
|
-
import { isFunction } from "lodash";
|
|
5
4
|
import { useGetMetaFields } from "../model/useGetMetaFields.js";
|
|
6
5
|
import MetaDataItem from "./MetaDataItem.js";
|
|
7
|
-
const MetaData_MetaData = ({ scope = "product",
|
|
6
|
+
const MetaData_MetaData = ({ title = "Meta fields", scope = "product", metafieldsData = [], onChange })=>{
|
|
8
7
|
const { metafields, loading } = useGetMetaFields([
|
|
9
8
|
scope
|
|
10
9
|
]);
|
|
11
10
|
const handleChange = (metaFieldID, value)=>{
|
|
12
|
-
|
|
11
|
+
onChange?.({
|
|
13
12
|
metafield: metaFieldID,
|
|
14
13
|
value
|
|
15
14
|
});
|
|
16
15
|
};
|
|
17
16
|
const getMetaFieldValue = (_id)=>{
|
|
18
|
-
const metaField =
|
|
17
|
+
const metaField = metafieldsData.find((metafieldData)=>metafieldData.metafield === _id);
|
|
19
18
|
return metaField?.value;
|
|
20
19
|
};
|
|
21
20
|
if (0 === metafields.length) return /*#__PURE__*/ jsxs(Card, {
|
|
22
21
|
children: [
|
|
23
22
|
/*#__PURE__*/ jsx(BlockStack, {
|
|
24
23
|
padding: 70,
|
|
25
|
-
children: /*#__PURE__*/ jsx(
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
children: "Meta fields"
|
|
30
|
-
})
|
|
24
|
+
children: /*#__PURE__*/ jsx(Text, {
|
|
25
|
+
size: "md",
|
|
26
|
+
weight: "semibold",
|
|
27
|
+
children: title
|
|
31
28
|
})
|
|
32
29
|
}),
|
|
33
30
|
/*#__PURE__*/ jsx(BlockStack, {
|
|
@@ -46,12 +43,10 @@ const MetaData_MetaData = ({ scope = "product", value = [], onChange })=>{
|
|
|
46
43
|
children: [
|
|
47
44
|
/*#__PURE__*/ jsx(BlockStack, {
|
|
48
45
|
padding: 70,
|
|
49
|
-
children: /*#__PURE__*/ jsx(
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
children: "Meta fields"
|
|
54
|
-
})
|
|
46
|
+
children: /*#__PURE__*/ jsx(Text, {
|
|
47
|
+
size: "md",
|
|
48
|
+
weight: "semibold",
|
|
49
|
+
children: title
|
|
55
50
|
})
|
|
56
51
|
}),
|
|
57
52
|
loading && !metafields ? /*#__PURE__*/ jsx(Loading, {}) : metafields.map((metaField)=>/*#__PURE__*/ jsx(MetaDataItem, {
|
|
@@ -23,7 +23,7 @@ const Product = ()=>{
|
|
|
23
23
|
padding: 70,
|
|
24
24
|
children: /*#__PURE__*/ jsx(MetaData, {
|
|
25
25
|
scope: "product",
|
|
26
|
-
|
|
26
|
+
metafieldsData: product,
|
|
27
27
|
onChange: handleChange
|
|
28
28
|
})
|
|
29
29
|
});
|
|
@@ -44,7 +44,7 @@ const Article = ()=>{
|
|
|
44
44
|
padding: 70,
|
|
45
45
|
children: /*#__PURE__*/ jsx(MetaData, {
|
|
46
46
|
scope: "article",
|
|
47
|
-
|
|
47
|
+
metafieldsData: product,
|
|
48
48
|
onChange: handleChange
|
|
49
49
|
})
|
|
50
50
|
});
|
|
@@ -65,13 +65,21 @@ const Variant = ()=>{
|
|
|
65
65
|
padding: 70,
|
|
66
66
|
children: /*#__PURE__*/ jsx(MetaData, {
|
|
67
67
|
scope: "variant",
|
|
68
|
-
|
|
68
|
+
metafieldsData: product,
|
|
69
69
|
onChange: handleChange
|
|
70
70
|
})
|
|
71
71
|
});
|
|
72
72
|
};
|
|
73
73
|
const Blog = ()=>{
|
|
74
|
-
const [product, setProduct] = useState([
|
|
74
|
+
const [product, setProduct] = useState([
|
|
75
|
+
{
|
|
76
|
+
metafield: "6942410d5da4f9634de8a7a9",
|
|
77
|
+
value: [
|
|
78
|
+
"694287616791846093ad7887",
|
|
79
|
+
"6943a80e984d8813d65098b7"
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
]);
|
|
75
83
|
const handleChange = (field)=>{
|
|
76
84
|
setProduct((prev)=>{
|
|
77
85
|
const exists = prev.find((f)=>f.metafield === field.metafield);
|
|
@@ -86,7 +94,7 @@ const Blog = ()=>{
|
|
|
86
94
|
padding: 70,
|
|
87
95
|
children: /*#__PURE__*/ jsx(MetaData, {
|
|
88
96
|
scope: "blog",
|
|
89
|
-
|
|
97
|
+
metafieldsData: product,
|
|
90
98
|
onChange: handleChange
|
|
91
99
|
})
|
|
92
100
|
});
|
|
@@ -107,7 +115,7 @@ const Page = ()=>{
|
|
|
107
115
|
padding: 70,
|
|
108
116
|
children: /*#__PURE__*/ jsx(MetaData, {
|
|
109
117
|
scope: "page",
|
|
110
|
-
|
|
118
|
+
metafieldsData: product,
|
|
111
119
|
onChange: handleChange
|
|
112
120
|
})
|
|
113
121
|
});
|
|
@@ -128,7 +136,7 @@ const Collection = ()=>{
|
|
|
128
136
|
padding: 70,
|
|
129
137
|
children: /*#__PURE__*/ jsx(MetaData, {
|
|
130
138
|
scope: "collection",
|
|
131
|
-
|
|
139
|
+
metafieldsData: product,
|
|
132
140
|
onChange: handleChange
|
|
133
141
|
})
|
|
134
142
|
});
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare const metaobjectEntriesQuery: import("@graphql-typed-document-node/core").TypedDocumentNode<import("../../../shared/graphql/graphql").MetaobjectEntriesQuery, import("../../../shared/graphql/graphql").Exact<{
|
|
2
|
+
after?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
|
|
3
|
+
before?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
|
|
4
|
+
first?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
|
|
5
|
+
last?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
|
|
6
|
+
query?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["String"]["input"]>;
|
|
7
|
+
filterKeys?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").MetaobjectEntryFilterKeys>;
|
|
8
|
+
}>>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { graphql } from "../../../shared/graphql/index.js";
|
|
2
|
+
const metaobjectEntriesQuery = graphql(`query MetaobjectEntries($after: ID, $before: ID, $first: Int, $last: Int, $query: String, $filterKeys: MetaobjectEntryFilterKeys) {
|
|
3
|
+
metaobjectEntries(after: $after, before: $before, first: $first, last: $last, query: $query, filterKeys: $filterKeys) {
|
|
4
|
+
pageInfo {
|
|
5
|
+
endCursor
|
|
6
|
+
hasNextPage
|
|
7
|
+
hasPreviousPage
|
|
8
|
+
startCursor
|
|
9
|
+
}
|
|
10
|
+
edges {
|
|
11
|
+
node {
|
|
12
|
+
_id
|
|
13
|
+
title
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
}`);
|
|
18
|
+
export { metaobjectEntriesQuery };
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { MetaobjectEntryFilterKeys } from "../../../shared/graphql/graphql";
|
|
2
|
+
type Props = {
|
|
3
|
+
skip?: boolean;
|
|
4
|
+
first?: number;
|
|
5
|
+
query?: string | null;
|
|
6
|
+
filterKeys?: MetaobjectEntryFilterKeys;
|
|
7
|
+
};
|
|
8
|
+
export declare const useMetaobjectEntries: (props?: Props) => {
|
|
9
|
+
metaobjectEntries: {
|
|
10
|
+
__typename: "MetaobjectEntry";
|
|
11
|
+
_id?: string | null;
|
|
12
|
+
title?: string | null;
|
|
13
|
+
}[] | undefined;
|
|
14
|
+
isLoadingMetaobjectEntries: boolean;
|
|
15
|
+
error: import("@apollo/client").ErrorLike | undefined;
|
|
16
|
+
fetchMoreMetaobjectEntries: () => void;
|
|
17
|
+
pageInfo: {
|
|
18
|
+
__typename: "PageInfo";
|
|
19
|
+
endCursor?: string | null;
|
|
20
|
+
hasNextPage?: boolean | null;
|
|
21
|
+
hasPreviousPage?: boolean | null;
|
|
22
|
+
startCursor?: string | null;
|
|
23
|
+
} | null | undefined;
|
|
24
|
+
};
|
|
25
|
+
export {};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { useQuery } from "@apollo/client/react";
|
|
2
|
+
import { metaobjectEntriesQuery } from "../api/query.js";
|
|
3
|
+
const useMetaobjectEntries = (props = {})=>{
|
|
4
|
+
const { skip, first, query, filterKeys } = props;
|
|
5
|
+
const { data, loading: isLoadingMetaobjectEntries, error, fetchMore } = useQuery(metaobjectEntriesQuery, {
|
|
6
|
+
skip,
|
|
7
|
+
variables: {
|
|
8
|
+
first,
|
|
9
|
+
query,
|
|
10
|
+
filterKeys
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
const metaobjectEntries = data?.metaobjectEntries?.edges?.map((edge)=>edge?.node).filter((node)=>null != node);
|
|
14
|
+
const pageInfo = data?.metaobjectEntries?.pageInfo;
|
|
15
|
+
const fetchMoreMetaobjectEntries = ()=>{
|
|
16
|
+
if (!pageInfo?.hasNextPage) return;
|
|
17
|
+
fetchMore({
|
|
18
|
+
variables: {
|
|
19
|
+
first,
|
|
20
|
+
query,
|
|
21
|
+
filterKeys,
|
|
22
|
+
after: pageInfo.endCursor
|
|
23
|
+
},
|
|
24
|
+
updateQuery (prev, { fetchMoreResult }) {
|
|
25
|
+
if (!fetchMoreResult.metaobjectEntries?.edges || !prev.metaobjectEntries?.edges) return prev;
|
|
26
|
+
return {
|
|
27
|
+
metaobjectEntries: {
|
|
28
|
+
...fetchMoreResult.metaobjectEntries,
|
|
29
|
+
edges: [
|
|
30
|
+
...prev.metaobjectEntries.edges,
|
|
31
|
+
...fetchMoreResult.metaobjectEntries.edges
|
|
32
|
+
]
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
return {
|
|
39
|
+
metaobjectEntries,
|
|
40
|
+
isLoadingMetaobjectEntries,
|
|
41
|
+
error,
|
|
42
|
+
fetchMoreMetaobjectEntries,
|
|
43
|
+
pageInfo
|
|
44
|
+
};
|
|
45
|
+
};
|
|
46
|
+
export { useMetaobjectEntries };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
type Props = {
|
|
2
|
+
title?: string;
|
|
3
|
+
initialIds?: string[];
|
|
4
|
+
limit?: number;
|
|
5
|
+
metaobjects?: string[];
|
|
6
|
+
onClose?: () => void;
|
|
7
|
+
onOk?: (linklist: string[]) => void;
|
|
8
|
+
};
|
|
9
|
+
declare const MetaobjectEntries: ({ title, initialIds, limit, metaobjects, onClose, onOk }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export default MetaobjectEntries;
|