@tinacms/app 0.0.0-bc986dd-20250128224550 → 0.0.0-bdc07c1-20250506013835
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/CHANGELOG.md +73 -10
- package/package.json +8 -8
- package/src/App.tsx +24 -24
- package/src/Playground.tsx +55 -55
- package/src/dummy-client.ts +1 -1
- package/src/fields/rich-text/index.tsx +2 -2
- package/src/fields/rich-text/monaco/error-message.tsx +54 -54
- package/src/fields/rich-text/monaco/index.tsx +56 -56
- package/src/fields/rich-text/monaco/use-debounce.ts +8 -8
- package/src/global.css +3 -3
- package/src/index.css +15 -15
- package/src/lib/build-form.ts +24 -24
- package/src/lib/errors.tsx +7 -7
- package/src/lib/expand-query.ts +66 -61
- package/src/lib/graphql-reducer.ts +295 -275
- package/src/lib/types.ts +35 -33
- package/src/lib/util.ts +41 -41
- package/src/main.tsx +7 -7
- package/src/preflight.css +10 -10
- package/src/preview.tsx +12 -12
- package/src/vite-env.d.ts +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,11 +1,74 @@
|
|
|
1
1
|
# @tinacms/app
|
|
2
2
|
|
|
3
|
-
## 0.0.0-
|
|
3
|
+
## 0.0.0-bdc07c1-20250506013835
|
|
4
4
|
|
|
5
5
|
### Patch Changes
|
|
6
6
|
|
|
7
|
-
- Updated dependencies [[`
|
|
8
|
-
- tinacms@0.0.0-
|
|
7
|
+
- Updated dependencies [[`65cee5d`](https://github.com/tinacms/tinacms/commit/65cee5d6ae16c7320a4a14f0d9a82dc5f9103e34)]:
|
|
8
|
+
- tinacms@0.0.0-bdc07c1-20250506013835
|
|
9
|
+
- @tinacms/mdx@0.0.0-bdc07c1-20250506013835
|
|
10
|
+
|
|
11
|
+
## 2.2.5
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [#5602](https://github.com/tinacms/tinacms/pull/5602) [`ab43169`](https://github.com/tinacms/tinacms/commit/ab43169af5a95f31fa27bb0236623a031883a1fd) Thanks [@wicksipedia](https://github.com/wicksipedia)! - fix naming of TinaCloud
|
|
16
|
+
|
|
17
|
+
- [#5588](https://github.com/tinacms/tinacms/pull/5588) [`fd664d8`](https://github.com/tinacms/tinacms/commit/fd664d8f4e83941ed1b1f234668ab6341a6178f8) Thanks [@JackDevAU](https://github.com/JackDevAU)! - - Fix server-side branch queries by storing the active branch in a cookie and passing it via the x-branch header.
|
|
18
|
+
- Ensure GraphQL playground correctly updates when switching branches.
|
|
19
|
+
- Updated dependencies [[`921f235`](https://github.com/tinacms/tinacms/commit/921f2356e4615d532d02eefa7103fdb70f83b97a), [`ab43169`](https://github.com/tinacms/tinacms/commit/ab43169af5a95f31fa27bb0236623a031883a1fd), [`b551232`](https://github.com/tinacms/tinacms/commit/b5512326ad0ad9855bc75e2073a3ab2a8ec4c064), [`ea204c9`](https://github.com/tinacms/tinacms/commit/ea204c9045451f3ebea04f503e6158d2016613e4), [`fd664d8`](https://github.com/tinacms/tinacms/commit/fd664d8f4e83941ed1b1f234668ab6341a6178f8)]:
|
|
20
|
+
- tinacms@2.7.5
|
|
21
|
+
- @tinacms/mdx@1.6.2
|
|
22
|
+
|
|
23
|
+
## 2.2.3
|
|
24
|
+
|
|
25
|
+
### Patch Changes
|
|
26
|
+
|
|
27
|
+
- Updated dependencies [[`991db1f`](https://github.com/tinacms/tinacms/commit/991db1f10c1f9cf9211d7e82bd56658cdcce24c7)]:
|
|
28
|
+
- tinacms@2.7.3
|
|
29
|
+
|
|
30
|
+
## 2.2.2
|
|
31
|
+
|
|
32
|
+
### Patch Changes
|
|
33
|
+
|
|
34
|
+
- Updated dependencies [[`619e601`](https://github.com/tinacms/tinacms/commit/619e6010d6f95d893e980952bef64f747808c956), [`602b4d0`](https://github.com/tinacms/tinacms/commit/602b4d07f94de4c10d5bb059a5edc49546a2031c)]:
|
|
35
|
+
- tinacms@2.7.2
|
|
36
|
+
- @tinacms/mdx@1.6.1
|
|
37
|
+
|
|
38
|
+
## 2.2.1
|
|
39
|
+
|
|
40
|
+
### Patch Changes
|
|
41
|
+
|
|
42
|
+
- Updated dependencies [[`74513b3`](https://github.com/tinacms/tinacms/commit/74513b357aa27165aa86f7b3218c697c663539e8), [`06c1716`](https://github.com/tinacms/tinacms/commit/06c17163b558a96275b0ef66c746b005a6f90d13)]:
|
|
43
|
+
- tinacms@2.7.1
|
|
44
|
+
|
|
45
|
+
## 2.2.0
|
|
46
|
+
|
|
47
|
+
### Minor Changes
|
|
48
|
+
|
|
49
|
+
- [#5503](https://github.com/tinacms/tinacms/pull/5503) [`99bb59f`](https://github.com/tinacms/tinacms/commit/99bb59ff7b9f3cf27a1382b91826eb81831ecb95) Thanks [@JackDevAU](https://github.com/JackDevAU)! - feat: add experimental user form select to the useTina hook
|
|
50
|
+
|
|
51
|
+
### Patch Changes
|
|
52
|
+
|
|
53
|
+
- [#5486](https://github.com/tinacms/tinacms/pull/5486) [`d7c5ec1`](https://github.com/tinacms/tinacms/commit/d7c5ec1b174419dcc6ddba3cfb3684dd469da571) Thanks [@JackDevAU](https://github.com/JackDevAU)! - Update dependencies across packages
|
|
54
|
+
|
|
55
|
+
- Updated dependencies [[`3974aa7`](https://github.com/tinacms/tinacms/commit/3974aa759192713140733b99ee0254a1a056e124), [`7541614`](https://github.com/tinacms/tinacms/commit/7541614527a02268ea453b23ce84637f978dcf2d), [`d7c5ec1`](https://github.com/tinacms/tinacms/commit/d7c5ec1b174419dcc6ddba3cfb3684dd469da571), [`99bb59f`](https://github.com/tinacms/tinacms/commit/99bb59ff7b9f3cf27a1382b91826eb81831ecb95)]:
|
|
56
|
+
- tinacms@2.7.0
|
|
57
|
+
- @tinacms/mdx@1.6.0
|
|
58
|
+
|
|
59
|
+
## 2.1.19
|
|
60
|
+
|
|
61
|
+
### Patch Changes
|
|
62
|
+
|
|
63
|
+
- Updated dependencies []:
|
|
64
|
+
- tinacms@2.6.4
|
|
65
|
+
|
|
66
|
+
## 2.1.18
|
|
67
|
+
|
|
68
|
+
### Patch Changes
|
|
69
|
+
|
|
70
|
+
- Updated dependencies [[`05ba069`](https://github.com/tinacms/tinacms/commit/05ba0692a7e990fbb671177829562869d517e7c1), [`42daaf7`](https://github.com/tinacms/tinacms/commit/42daaf7af125da265d2c5998168e9c7345dc0a59), [`bc986dd`](https://github.com/tinacms/tinacms/commit/bc986dd48f9a7da264281b55926ec51ce1068bb7), [`3af2354`](https://github.com/tinacms/tinacms/commit/3af23542b984c10e138d0cf10a165d50b99bb0e9)]:
|
|
71
|
+
- tinacms@2.6.3
|
|
9
72
|
|
|
10
73
|
## 2.1.17
|
|
11
74
|
|
|
@@ -418,7 +481,7 @@
|
|
|
418
481
|
|
|
419
482
|
fix: Use clean page-sizes on media manager (to make pagination more obvious)
|
|
420
483
|
|
|
421
|
-
Fix issue with uploading media in a folder with
|
|
484
|
+
Fix issue with uploading media in a folder with TinaCloud
|
|
422
485
|
|
|
423
486
|
- Updated dependencies [9c27087fb]
|
|
424
487
|
- Updated dependencies [65d0a701f]
|
|
@@ -741,7 +804,7 @@
|
|
|
741
804
|
> NOTE: Relative paths are fine to use here, but make sure it's relative to the `.tina/config` file
|
|
742
805
|
|
|
743
806
|
```ts
|
|
744
|
-
localContentPath: process.env.REMOTE_ROOT_PATH // eg. '../../my-content-repo'
|
|
807
|
+
localContentPath: process.env.REMOTE_ROOT_PATH; // eg. '../../my-content-repo'
|
|
745
808
|
```
|
|
746
809
|
|
|
747
810
|
### Production workflow
|
|
@@ -785,18 +848,18 @@
|
|
|
785
848
|
EX:
|
|
786
849
|
|
|
787
850
|
```ts
|
|
788
|
-
import { defineConfig } from
|
|
851
|
+
import { defineConfig } from "tinacms";
|
|
789
852
|
|
|
790
853
|
export default defineConfig({
|
|
791
854
|
admin: {
|
|
792
855
|
auth: {
|
|
793
856
|
onLogin: () => {
|
|
794
|
-
console.log(
|
|
857
|
+
console.log("On Log in!");
|
|
795
858
|
},
|
|
796
859
|
},
|
|
797
860
|
},
|
|
798
861
|
/// ...
|
|
799
|
-
})
|
|
862
|
+
});
|
|
800
863
|
```
|
|
801
864
|
|
|
802
865
|
- 9d4943a82: Fix issue resolving alias fields when passing through the `useTina` hook
|
|
@@ -1019,13 +1082,13 @@
|
|
|
1019
1082
|
|
|
1020
1083
|
```ts
|
|
1021
1084
|
// .tina/config.ts
|
|
1022
|
-
import schema from
|
|
1085
|
+
import schema from "./schema";
|
|
1023
1086
|
|
|
1024
1087
|
export default defineConfig({
|
|
1025
1088
|
schema: schema,
|
|
1026
1089
|
//.. Everything from define config in `schema.ts`
|
|
1027
1090
|
//.. Everything from `schema.config`
|
|
1028
|
-
})
|
|
1091
|
+
});
|
|
1029
1092
|
```
|
|
1030
1093
|
|
|
1031
1094
|
2. Add Build config
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tinacms/app",
|
|
3
|
-
"version": "0.0.0-
|
|
3
|
+
"version": "0.0.0-bdc07c1-20250506013835",
|
|
4
4
|
"main": "src/main.tsx",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"devDependencies": {
|
|
7
|
-
"@types/react": "^18.3.
|
|
8
|
-
"@types/react-dom": "^18.3.
|
|
9
|
-
"typescript": "^5.
|
|
7
|
+
"@types/react": "^18.3.18",
|
|
8
|
+
"@types/react-dom": "^18.3.5",
|
|
9
|
+
"typescript": "^5.7.3"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"@graphiql/toolkit": "0.8.4",
|
|
@@ -20,9 +20,9 @@
|
|
|
20
20
|
"react": "^18.3.1",
|
|
21
21
|
"react-dom": "^18.3.1",
|
|
22
22
|
"react-router-dom": "6.3.0",
|
|
23
|
-
"typescript": "^5.
|
|
24
|
-
"zod": "^3.
|
|
25
|
-
"@tinacms/mdx": "
|
|
26
|
-
"tinacms": "0.0.0-
|
|
23
|
+
"typescript": "^5.7.3",
|
|
24
|
+
"zod": "^3.24.2",
|
|
25
|
+
"@tinacms/mdx": "0.0.0-bdc07c1-20250506013835",
|
|
26
|
+
"tinacms": "0.0.0-bdc07c1-20250506013835"
|
|
27
27
|
}
|
|
28
28
|
}
|
package/src/App.tsx
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import React, { Suspense } from 'react'
|
|
2
|
-
import TinaCMS, { TinaAdmin, useCMS, MdxFieldPluginExtendible } from 'tinacms'
|
|
3
|
-
import { Preview } from './preview'
|
|
4
|
-
import Playground from './Playground'
|
|
1
|
+
import React, { Suspense } from 'react';
|
|
2
|
+
import TinaCMS, { TinaAdmin, useCMS, MdxFieldPluginExtendible } from 'tinacms';
|
|
3
|
+
import { Preview } from './preview';
|
|
4
|
+
import Playground from './Playground';
|
|
5
5
|
|
|
6
6
|
// TODO: Resolve this to local file in tsconfig.json
|
|
7
7
|
// @ts-expect-error
|
|
8
|
-
import config from 'TINA_IMPORT'
|
|
8
|
+
import config from 'TINA_IMPORT';
|
|
9
9
|
// @ts-expect-error
|
|
10
|
-
import schemaJson from 'SCHEMA_IMPORT'
|
|
10
|
+
import schemaJson from 'SCHEMA_IMPORT';
|
|
11
11
|
// @ts-expect-error
|
|
12
|
-
import staticMedia from 'STATIC_MEDIA_IMPORT'
|
|
12
|
+
import staticMedia from 'STATIC_MEDIA_IMPORT';
|
|
13
13
|
|
|
14
|
-
const RawEditor = React.lazy(() => import('./fields/rich-text'))
|
|
14
|
+
const RawEditor = React.lazy(() => import('./fields/rich-text'));
|
|
15
15
|
|
|
16
16
|
const Editor = (props) => {
|
|
17
|
-
const [rawMode, setRawMode] = React.useState(false)
|
|
17
|
+
const [rawMode, setRawMode] = React.useState(false);
|
|
18
18
|
return (
|
|
19
19
|
<MdxFieldPluginExtendible.Component
|
|
20
20
|
rawMode={rawMode}
|
|
@@ -26,32 +26,32 @@ const Editor = (props) => {
|
|
|
26
26
|
</Suspense>
|
|
27
27
|
}
|
|
28
28
|
/>
|
|
29
|
-
)
|
|
30
|
-
}
|
|
29
|
+
);
|
|
30
|
+
};
|
|
31
31
|
|
|
32
32
|
const SetPreview = () => {
|
|
33
|
-
const cms = useCMS()
|
|
33
|
+
const cms = useCMS();
|
|
34
34
|
React.useEffect(() => {
|
|
35
35
|
// Override original 'rich-text' field with one that has raw mode support
|
|
36
36
|
cms.fields.add({
|
|
37
37
|
...MdxFieldPluginExtendible,
|
|
38
38
|
Component: Editor,
|
|
39
|
-
})
|
|
40
|
-
const basePath = __BASE_PATH__.replace(/^\/|\/$/g, '')
|
|
41
|
-
cms.flags.set('tina-basepath', basePath)
|
|
39
|
+
});
|
|
40
|
+
const basePath = __BASE_PATH__.replace(/^\/|\/$/g, '');
|
|
41
|
+
cms.flags.set('tina-basepath', basePath);
|
|
42
42
|
cms.flags.set(
|
|
43
43
|
'tina-preview',
|
|
44
44
|
`${basePath ? `${basePath}/` : ''}${config.build.outputFolder.replace(
|
|
45
45
|
/^\/|\/$/g,
|
|
46
46
|
''
|
|
47
47
|
)}`
|
|
48
|
-
)
|
|
49
|
-
}, [])
|
|
50
|
-
return null
|
|
51
|
-
}
|
|
48
|
+
);
|
|
49
|
+
}, []);
|
|
50
|
+
return null;
|
|
51
|
+
};
|
|
52
52
|
|
|
53
53
|
export const TinaAdminWrapper = () => {
|
|
54
|
-
const schema = { ...config?.schema, config }
|
|
54
|
+
const schema = { ...config?.schema, config };
|
|
55
55
|
return (
|
|
56
56
|
// @ts-ignore JSX element type 'TinaCMS' does not have any construct or call signatures.ts(2604)
|
|
57
57
|
<TinaCMS
|
|
@@ -70,10 +70,10 @@ export const TinaAdminWrapper = () => {
|
|
|
70
70
|
schemaJson={schemaJson}
|
|
71
71
|
/>
|
|
72
72
|
</TinaCMS>
|
|
73
|
-
)
|
|
74
|
-
}
|
|
73
|
+
);
|
|
74
|
+
};
|
|
75
75
|
|
|
76
76
|
function App() {
|
|
77
|
-
return <TinaAdminWrapper
|
|
77
|
+
return <TinaAdminWrapper />;
|
|
78
78
|
}
|
|
79
|
-
export default App
|
|
79
|
+
export default App;
|
package/src/Playground.tsx
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import { createGraphiQLFetcher } from '@graphiql/toolkit'
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
7
|
-
import {
|
|
1
|
+
import { createGraphiQLFetcher } from '@graphiql/toolkit';
|
|
2
|
+
import { FolderIcon } from '@heroicons/react/outline';
|
|
3
|
+
import { queries } from 'CLIENT_IMPORT';
|
|
4
|
+
import { GraphiQL } from 'graphiql';
|
|
5
|
+
import { parse, print } from 'graphql';
|
|
6
|
+
import React from 'react';
|
|
7
|
+
import { useCMS } from 'tinacms';
|
|
8
8
|
|
|
9
|
-
import 'graphiql/graphiql.min.css'
|
|
9
|
+
import 'graphiql/graphiql.min.css';
|
|
10
10
|
|
|
11
11
|
const Playground = () => {
|
|
12
|
-
const cms = useCMS()
|
|
13
|
-
const [query, setQuery] = React.useState('')
|
|
14
|
-
const [variables, setVariables] = React.useState('')
|
|
15
|
-
const [autoQueries, setAutoQueries] = React.useState()
|
|
12
|
+
const cms = useCMS();
|
|
13
|
+
const [query, setQuery] = React.useState('');
|
|
14
|
+
const [variables, setVariables] = React.useState('');
|
|
15
|
+
const [autoQueries, setAutoQueries] = React.useState();
|
|
16
16
|
const [collectionInfo, setCollectionInfo] = React.useState<{
|
|
17
17
|
collections: {
|
|
18
|
-
name: string
|
|
19
|
-
documents: { edges: { node: { _sys: { relativePath: string } } }[] }
|
|
20
|
-
}[]
|
|
21
|
-
}>()
|
|
18
|
+
name: string;
|
|
19
|
+
documents: { edges: { node: { _sys: { relativePath: string } } }[] };
|
|
20
|
+
}[];
|
|
21
|
+
}>();
|
|
22
22
|
React.useEffect(() => {
|
|
23
23
|
const run = async () => {
|
|
24
24
|
if (queries) {
|
|
25
|
-
const q = queries({ request: async () => query })
|
|
25
|
+
const q = queries({ request: async () => query });
|
|
26
26
|
setCollectionInfo(
|
|
27
27
|
await cms.api.tina.request(
|
|
28
28
|
`
|
|
@@ -45,52 +45,52 @@ const Playground = () => {
|
|
|
45
45
|
`,
|
|
46
46
|
{ variables: {} }
|
|
47
47
|
)
|
|
48
|
-
)
|
|
49
|
-
setAutoQueries(q)
|
|
48
|
+
);
|
|
49
|
+
setAutoQueries(q);
|
|
50
50
|
} else {
|
|
51
|
-
setAutoQueries({})
|
|
51
|
+
setAutoQueries({});
|
|
52
52
|
}
|
|
53
|
-
}
|
|
54
|
-
run()
|
|
55
|
-
}, [])
|
|
53
|
+
};
|
|
54
|
+
run();
|
|
55
|
+
}, []);
|
|
56
56
|
|
|
57
|
-
const ref = React.useRef()
|
|
57
|
+
const ref = React.useRef();
|
|
58
58
|
|
|
59
59
|
const getToken = () => {
|
|
60
|
-
return JSON.parse(localStorage.getItem('tinacms-auth') || '{}')?.id_token
|
|
61
|
-
}
|
|
60
|
+
return JSON.parse(localStorage.getItem('tinacms-auth') || '{}')?.id_token;
|
|
61
|
+
};
|
|
62
62
|
|
|
63
63
|
if (!autoQueries) {
|
|
64
|
-
return null
|
|
64
|
+
return null;
|
|
65
65
|
}
|
|
66
66
|
|
|
67
67
|
const Plugin = () => {
|
|
68
|
-
const noAutoQueries = Object.keys(autoQueries).length === 0
|
|
68
|
+
const noAutoQueries = Object.keys(autoQueries).length === 0;
|
|
69
69
|
return (
|
|
70
70
|
<div>
|
|
71
|
-
<div className=
|
|
72
|
-
<div className=
|
|
73
|
-
<div className=
|
|
71
|
+
<div className='graphiql-doc-explorer-title'>Queries</div>
|
|
72
|
+
<div className='graphiql-doc-explorer-content'>
|
|
73
|
+
<div className='graphiql-markdown-description'>
|
|
74
74
|
{noAutoQueries
|
|
75
75
|
? 'No auto-generated queries found, the Tina config is likely set to client.skip = true'
|
|
76
76
|
: "Tina's auto-generated queries can be found here as well as any queries you may have defined yourself."}{' '}
|
|
77
|
-
<a href=
|
|
77
|
+
<a href='https://tina.io/docs/data-fetching/custom-queries/'>
|
|
78
78
|
Learn more here
|
|
79
79
|
</a>
|
|
80
80
|
</div>
|
|
81
|
-
<nav className=
|
|
81
|
+
<nav className='space-y-1' aria-label='Sidebar'>
|
|
82
82
|
<ul>
|
|
83
83
|
{Object.entries(autoQueries).map(([key, value]) => {
|
|
84
84
|
const collection = collectionInfo?.collections.find(
|
|
85
85
|
({ name }) => name === key
|
|
86
|
-
)
|
|
87
|
-
let variables = ''
|
|
88
|
-
let relativePath = ''
|
|
86
|
+
);
|
|
87
|
+
let variables = '';
|
|
88
|
+
let relativePath = '';
|
|
89
89
|
if (collection) {
|
|
90
90
|
relativePath =
|
|
91
91
|
collection?.documents?.edges[0]?.node?._sys.relativePath ||
|
|
92
|
-
''
|
|
93
|
-
variables = JSON.stringify({ relativePath }, null, 2)
|
|
92
|
+
'';
|
|
93
|
+
variables = JSON.stringify({ relativePath }, null, 2);
|
|
94
94
|
}
|
|
95
95
|
return (
|
|
96
96
|
<li>
|
|
@@ -104,43 +104,43 @@ const Playground = () => {
|
|
|
104
104
|
)}
|
|
105
105
|
onClick={async () => {
|
|
106
106
|
if (typeof value === 'function') {
|
|
107
|
-
const v = await value({})
|
|
108
|
-
const ast = parse(v.query)
|
|
109
|
-
setVariables(variables)
|
|
110
|
-
setQuery(print(ast))
|
|
107
|
+
const v = await value({});
|
|
108
|
+
const ast = parse(v.query);
|
|
109
|
+
setVariables(variables);
|
|
110
|
+
setQuery(print(ast));
|
|
111
111
|
}
|
|
112
112
|
}}
|
|
113
113
|
>
|
|
114
|
-
<span className=
|
|
114
|
+
<span className='truncate'>
|
|
115
115
|
{key}{' '}
|
|
116
116
|
{relativePath && (
|
|
117
|
-
<span className=
|
|
117
|
+
<span className='pl-2 text-sm text-gray-300'>
|
|
118
118
|
({relativePath})
|
|
119
119
|
</span>
|
|
120
120
|
)}{' '}
|
|
121
121
|
</span>
|
|
122
122
|
</button>
|
|
123
123
|
</li>
|
|
124
|
-
)
|
|
124
|
+
);
|
|
125
125
|
})}
|
|
126
126
|
</ul>
|
|
127
127
|
</nav>
|
|
128
128
|
</div>
|
|
129
129
|
</div>
|
|
130
|
-
)
|
|
131
|
-
}
|
|
130
|
+
);
|
|
131
|
+
};
|
|
132
132
|
return (
|
|
133
133
|
<div style={{ height: '100vh' }}>
|
|
134
134
|
<GraphiQL
|
|
135
135
|
fetcher={async (params, options) => {
|
|
136
136
|
const fetcher = createGraphiQLFetcher({
|
|
137
|
-
url: __API_URL__,
|
|
137
|
+
url: cms.api.tina.contentApiUrl || __API_URL__,
|
|
138
138
|
headers: { Authorization: `Bearer ${getToken()}` },
|
|
139
|
-
})
|
|
140
|
-
return fetcher(params, options)
|
|
139
|
+
});
|
|
140
|
+
return fetcher(params, options);
|
|
141
141
|
}}
|
|
142
142
|
query={query}
|
|
143
|
-
defaultEditorToolsVisibility=
|
|
143
|
+
defaultEditorToolsVisibility='variables'
|
|
144
144
|
isHeadersEditorEnabled={false}
|
|
145
145
|
defaultTabs={[]}
|
|
146
146
|
plugins={[
|
|
@@ -153,11 +153,11 @@ const Playground = () => {
|
|
|
153
153
|
variables={variables}
|
|
154
154
|
></GraphiQL>
|
|
155
155
|
</div>
|
|
156
|
-
)
|
|
157
|
-
}
|
|
156
|
+
);
|
|
157
|
+
};
|
|
158
158
|
|
|
159
|
-
export default Playground
|
|
159
|
+
export default Playground;
|
|
160
160
|
|
|
161
161
|
function classNames(...classes: string[]) {
|
|
162
|
-
return classes.filter(Boolean).join(' ')
|
|
162
|
+
return classes.filter(Boolean).join(' ');
|
|
163
163
|
}
|
package/src/dummy-client.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export const queries = false
|
|
1
|
+
export const queries = false;
|
|
@@ -3,45 +3,45 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
*/
|
|
6
|
-
import React from 'react'
|
|
7
|
-
import { XCircleIcon } from '@heroicons/react/solid'
|
|
6
|
+
import React from 'react';
|
|
7
|
+
import { XCircleIcon } from '@heroicons/react/solid';
|
|
8
8
|
import {
|
|
9
9
|
Popover,
|
|
10
10
|
PopoverButton,
|
|
11
11
|
PopoverPanel,
|
|
12
12
|
Transition,
|
|
13
|
-
} from '@headlessui/react'
|
|
14
|
-
import { Fragment } from 'react'
|
|
13
|
+
} from '@headlessui/react';
|
|
14
|
+
import { Fragment } from 'react';
|
|
15
15
|
// import { InvalidMarkdownElement } from '@tinacms/mdx/src/parse/plate'
|
|
16
|
-
export type EmptyTextElement = { type: 'text'; text: '' }
|
|
16
|
+
export type EmptyTextElement = { type: 'text'; text: '' };
|
|
17
17
|
export type PositionItem = {
|
|
18
|
-
line?: number | null
|
|
19
|
-
column?: number | null
|
|
20
|
-
offset?: number | null
|
|
21
|
-
_index?: number | null
|
|
22
|
-
_bufferIndex?: number | null
|
|
23
|
-
}
|
|
18
|
+
line?: number | null;
|
|
19
|
+
column?: number | null;
|
|
20
|
+
offset?: number | null;
|
|
21
|
+
_index?: number | null;
|
|
22
|
+
_bufferIndex?: number | null;
|
|
23
|
+
};
|
|
24
24
|
export type Position = {
|
|
25
|
-
start: PositionItem
|
|
26
|
-
end: PositionItem
|
|
27
|
-
}
|
|
25
|
+
start: PositionItem;
|
|
26
|
+
end: PositionItem;
|
|
27
|
+
};
|
|
28
28
|
export type InvalidMarkdownElement = {
|
|
29
|
-
type: 'invalid_markdown'
|
|
30
|
-
value: string
|
|
31
|
-
message: string
|
|
32
|
-
position?: Position
|
|
33
|
-
children: [EmptyTextElement]
|
|
34
|
-
}
|
|
29
|
+
type: 'invalid_markdown';
|
|
30
|
+
value: string;
|
|
31
|
+
message: string;
|
|
32
|
+
position?: Position;
|
|
33
|
+
children: [EmptyTextElement];
|
|
34
|
+
};
|
|
35
35
|
|
|
36
36
|
type ErrorType = {
|
|
37
|
-
message: string
|
|
37
|
+
message: string;
|
|
38
38
|
position?: {
|
|
39
|
-
startColumn: number
|
|
40
|
-
endColumn: number
|
|
41
|
-
startLineNumber: number
|
|
42
|
-
endLineNumber: number
|
|
43
|
-
}
|
|
44
|
-
}
|
|
39
|
+
startColumn: number;
|
|
40
|
+
endColumn: number;
|
|
41
|
+
startLineNumber: number;
|
|
42
|
+
endLineNumber: number;
|
|
43
|
+
};
|
|
44
|
+
};
|
|
45
45
|
export const buildError = (element: InvalidMarkdownElement): ErrorType => {
|
|
46
46
|
return {
|
|
47
47
|
message: element.message,
|
|
@@ -51,28 +51,28 @@ export const buildError = (element: InvalidMarkdownElement): ErrorType => {
|
|
|
51
51
|
startLineNumber: element.position.start.line,
|
|
52
52
|
endLineNumber: element.position.end.line,
|
|
53
53
|
},
|
|
54
|
-
}
|
|
55
|
-
}
|
|
54
|
+
};
|
|
55
|
+
};
|
|
56
56
|
export const buildErrorMessage = (element: InvalidMarkdownElement): string => {
|
|
57
57
|
if (!element) {
|
|
58
|
-
return ''
|
|
58
|
+
return '';
|
|
59
59
|
}
|
|
60
|
-
const errorMessage = buildError(element)
|
|
60
|
+
const errorMessage = buildError(element);
|
|
61
61
|
const message = errorMessage
|
|
62
62
|
? `${errorMessage.message}${
|
|
63
63
|
errorMessage.position
|
|
64
64
|
? ` at line: ${errorMessage.position.startLineNumber}, column: ${errorMessage.position.startColumn}`
|
|
65
65
|
: ''
|
|
66
66
|
}`
|
|
67
|
-
: null
|
|
68
|
-
return message
|
|
69
|
-
}
|
|
67
|
+
: null;
|
|
68
|
+
return message;
|
|
69
|
+
};
|
|
70
70
|
|
|
71
71
|
export function ErrorMessage({ error }: { error: InvalidMarkdownElement }) {
|
|
72
|
-
const message = buildErrorMessage(error)
|
|
72
|
+
const message = buildErrorMessage(error);
|
|
73
73
|
|
|
74
74
|
return (
|
|
75
|
-
<Popover className=
|
|
75
|
+
<Popover className='relative'>
|
|
76
76
|
{() => (
|
|
77
77
|
<>
|
|
78
78
|
<PopoverButton
|
|
@@ -80,29 +80,29 @@ export function ErrorMessage({ error }: { error: InvalidMarkdownElement }) {
|
|
|
80
80
|
error ? '' : ' opacity-0 hidden '
|
|
81
81
|
}`}
|
|
82
82
|
>
|
|
83
|
-
<span className=
|
|
84
|
-
<XCircleIcon className=
|
|
83
|
+
<span className='sr-only'>Errors</span>
|
|
84
|
+
<XCircleIcon className='h-5 w-5 text-red-400' aria-hidden='true' />
|
|
85
85
|
</PopoverButton>
|
|
86
86
|
<Transition
|
|
87
|
-
enter=
|
|
88
|
-
enterFrom=
|
|
89
|
-
enterTo=
|
|
90
|
-
leave=
|
|
91
|
-
leaveFrom=
|
|
92
|
-
leaveTo=
|
|
87
|
+
enter='transition ease-out duration-200'
|
|
88
|
+
enterFrom='opacity-0 translate-y-1'
|
|
89
|
+
enterTo='opacity-100 translate-y-0'
|
|
90
|
+
leave='transition ease-in duration-150'
|
|
91
|
+
leaveFrom='opacity-100 translate-y-0'
|
|
92
|
+
leaveTo='opacity-0 translate-y-1'
|
|
93
93
|
>
|
|
94
|
-
<PopoverPanel className=
|
|
95
|
-
<div className=
|
|
96
|
-
<div className=
|
|
97
|
-
<div className=
|
|
98
|
-
<div className=
|
|
94
|
+
<PopoverPanel className='absolute top-8 w-[300px] -right-3 z-10 mt-3 px-4 sm:px-0'>
|
|
95
|
+
<div className='overflow-hidden rounded-lg shadow-lg ring-1 ring-black ring-opacity-5'>
|
|
96
|
+
<div className='rounded-md bg-red-50 p-4 overflow-scroll'>
|
|
97
|
+
<div className='flex'>
|
|
98
|
+
<div className='flex-shrink-0'>
|
|
99
99
|
<XCircleIcon
|
|
100
|
-
className=
|
|
101
|
-
aria-hidden=
|
|
100
|
+
className='h-5 w-5 text-red-400'
|
|
101
|
+
aria-hidden='true'
|
|
102
102
|
/>
|
|
103
103
|
</div>
|
|
104
|
-
<div className=
|
|
105
|
-
<h3 className=
|
|
104
|
+
<div className='ml-3'>
|
|
105
|
+
<h3 className='text-sm font-medium text-red-800 whitespace-pre-wrap'>
|
|
106
106
|
{message}
|
|
107
107
|
</h3>
|
|
108
108
|
</div>
|
|
@@ -114,5 +114,5 @@ export function ErrorMessage({ error }: { error: InvalidMarkdownElement }) {
|
|
|
114
114
|
</>
|
|
115
115
|
)}
|
|
116
116
|
</Popover>
|
|
117
|
-
)
|
|
117
|
+
);
|
|
118
118
|
}
|