chore(sanity): Migrate to Sanity studio v3
This commit is contained in:
Joost De Cock
parent
90ceeccd11
commit
fa5bb742e6
17 changed files with 1949 additions and 5893 deletions
4
.gitignore
vendored
4
.gitignore
vendored
|
|
@ -71,8 +71,8 @@ plugins/*/yarn.lock
|
|||
# NPM lock files for sites (we use yarn)
|
||||
sites/*/package-lock.json
|
||||
|
||||
# Strapi cache
|
||||
sites/strapi/.cache
|
||||
# Sanity cache
|
||||
sites/sanity/.sanity
|
||||
|
||||
# Sites prebuild artifacts
|
||||
sites/*/public/locales/*/*.json
|
||||
|
|
|
|||
|
|
@ -336,21 +336,19 @@ org:
|
|||
|
||||
sanity:
|
||||
_:
|
||||
'@sanity/base': '2.35.0'
|
||||
'@sanity/core': '2.35.0'
|
||||
'@sanity/default-layout': '2.35.0'
|
||||
'@sanity/default-login': '2.35.0'
|
||||
'@sanity/desk-tool': '2.35.0'
|
||||
'@sanity/eslint-config-studio': '2.0.0'
|
||||
'@sanity/vision': '2.35.0'
|
||||
'eslint': '8.6.0'
|
||||
'prop-types': '15.7'
|
||||
'@sanity/vision': &sanity '3.0.0'
|
||||
'react': *react
|
||||
'react-dom': *react
|
||||
'sanity-plugin-markdown': '3.0.1'
|
||||
'react-is': *react
|
||||
'sanity': *sanity
|
||||
'styled-components': '5.2.0'
|
||||
'sanity-plugin-markdown': '3.0.1'
|
||||
dev:
|
||||
'@sanity/cli': '2.35.0'
|
||||
'@sanity/eslint-config-studio': '2.0.1'
|
||||
'eslint': '8.6.0'
|
||||
'prettier': '2.8.1'
|
||||
'typescript': '4.9.4'
|
||||
'@sanity/cli': '3.1.1'
|
||||
|
||||
shared:
|
||||
_:
|
||||
|
|
|
|||
|
|
@ -96,6 +96,6 @@ org:
|
|||
start: *nextStart
|
||||
|
||||
sanity:
|
||||
dev: 'sanity dev'
|
||||
start: 'sanity start'
|
||||
test: 'sanity check'
|
||||
build: 'sanity build -y'
|
||||
|
|
|
|||
0
sites/sanity/dist/.gitkeep
vendored
0
sites/sanity/dist/.gitkeep
vendored
|
|
@ -14,28 +14,26 @@
|
|||
"url": "https://freesewing.org/patrons/join"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "sanity dev",
|
||||
"start": "sanity start",
|
||||
"test": "sanity check",
|
||||
"build": "sanity build -y"
|
||||
},
|
||||
"peerDependencies": {},
|
||||
"dependencies": {
|
||||
"@sanity/base": "2.35.0",
|
||||
"@sanity/core": "2.35.0",
|
||||
"@sanity/default-layout": "2.35.0",
|
||||
"@sanity/default-login": "2.35.2",
|
||||
"@sanity/desk-tool": "2.35.0",
|
||||
"@sanity/eslint-config-studio": "2.0.0",
|
||||
"@sanity/vision": "2.35.0",
|
||||
"eslint": "8.30.0",
|
||||
"prop-types": "15.7",
|
||||
"@sanity/vision": "3.0.0",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"sanity-plugin-markdown": "3.0.1",
|
||||
"styled-components": "5.2.0"
|
||||
"react-is": "18.2.0",
|
||||
"sanity": "3.0.0",
|
||||
"styled-components": "5.2.0",
|
||||
"sanity-plugin-markdown": "3.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sanity/cli": "2.35.0"
|
||||
"@sanity/eslint-config-studio": "2.0.1",
|
||||
"eslint": "8.6.0",
|
||||
"prettier": "2.8.1",
|
||||
"typescript": "4.9.4",
|
||||
"@sanity/cli": "3.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16.0.0",
|
||||
|
|
|
|||
|
|
@ -1,17 +0,0 @@
|
|||
import React from 'react'
|
||||
import StudioRoot from 'part:@sanity/default-layout/root'
|
||||
import {useCurrentUser} from '@sanity/base/hooks'
|
||||
import GetStartedTutorial from './GetStartedTutorial'
|
||||
|
||||
export default function CustomDefaultLayout() {
|
||||
const {value} = useCurrentUser()
|
||||
|
||||
const showTutorial = (value?.roles || []).length > 0
|
||||
|
||||
return (
|
||||
<>
|
||||
{showTutorial && <GetStartedTutorial />}
|
||||
<StudioRoot />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,105 +0,0 @@
|
|||
import React, {useState} from 'react'
|
||||
import {
|
||||
Card,
|
||||
Container,
|
||||
Button,
|
||||
Flex,
|
||||
Label,
|
||||
Heading,
|
||||
Text,
|
||||
Stack,
|
||||
useElementRect,
|
||||
useTheme,
|
||||
} from '@sanity/ui'
|
||||
import {CloseIcon} from '@sanity/icons'
|
||||
import styled, {css} from 'styled-components'
|
||||
|
||||
const BlueColor = css`
|
||||
color: ${({theme}) => theme.sanity.color.muted.primary.enabled.fg};
|
||||
`
|
||||
|
||||
const LabelContainer = styled(Label)`
|
||||
${BlueColor}
|
||||
`
|
||||
|
||||
const TextContainer = styled(Text)`
|
||||
${BlueColor}
|
||||
`
|
||||
|
||||
export const GetStartedTutorial = () => {
|
||||
const [hideTutorial, setShowTutorial] = useState(
|
||||
window.localStorage.getItem('getstarted_closedTutorial') !== null
|
||||
)
|
||||
|
||||
const {sanity} = useTheme()
|
||||
const [rootElement, setRootElement] = useState()
|
||||
const rect = useElementRect(rootElement)
|
||||
const isSmallScreen = rect?.width < sanity.media[1]
|
||||
const isProdEnv = process.env.NODE_ENV !== 'development'
|
||||
|
||||
const onClose = () => {
|
||||
window.localStorage.setItem('getstarted_closedTutorial', 'true')
|
||||
setShowTutorial(true)
|
||||
}
|
||||
|
||||
if (hideTutorial || isProdEnv) {
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<div ref={setRootElement}>
|
||||
<Card tone="primary" padding={isSmallScreen ? 3 : 5} paddingBottom={isSmallScreen ? 4 : 6}>
|
||||
<Flex justify={isSmallScreen ? 'space-between' : 'flex-end'} align="center">
|
||||
{isSmallScreen && (
|
||||
<LabelContainer forwardedAs="p">Your Sanity Studio is all set up!</LabelContainer>
|
||||
)}
|
||||
|
||||
<Button
|
||||
aria-label="Close dialog"
|
||||
icon={CloseIcon}
|
||||
mode="bleed"
|
||||
onClick={onClose}
|
||||
padding={isSmallScreen ? undefined : 3}
|
||||
/>
|
||||
</Flex>
|
||||
<Stack space={5}>
|
||||
{!isSmallScreen && (
|
||||
<>
|
||||
<LabelContainer forwardedAs="p" align="center">
|
||||
Get started with sanity
|
||||
</LabelContainer>
|
||||
|
||||
<Heading as="h1" size={4} align="center">
|
||||
Your Sanity Studio is all set up!
|
||||
</Heading>
|
||||
</>
|
||||
)}
|
||||
|
||||
<Container width={1}>
|
||||
<TextContainer
|
||||
forwardedAs="p"
|
||||
size={isSmallScreen ? 1 : undefined}
|
||||
align={isSmallScreen ? 'start' : 'center'}
|
||||
>
|
||||
Next, our docs will guide you through building schemas, adding content, and connecting
|
||||
a frontend. You’ll see updates reflected in your Studio below.
|
||||
</TextContainer>
|
||||
</Container>
|
||||
|
||||
<Flex justify={isSmallScreen ? 'start' : 'center'}>
|
||||
<Button
|
||||
as="a"
|
||||
href="https://www.sanity.io/docs/create-a-schema-and-configure-sanity-studio"
|
||||
target="_blank"
|
||||
padding={isSmallScreen ? undefined : 4}
|
||||
tone="primary"
|
||||
text="Build a schema"
|
||||
/>
|
||||
</Flex>
|
||||
</Stack>
|
||||
</Card>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default GetStartedTutorial
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
|
||||
/**
|
||||
* Couple of things to note:
|
||||
* - width and height is set to 1em
|
||||
* - fill is `currentColor` - this will ensure that the icon looks uniform and
|
||||
* that the hover/active state works. You can of course render anything you
|
||||
* would like here, but for plugins that are to be used in more than one
|
||||
* studio, we suggest these rules are followed
|
||||
**/
|
||||
export default () => (
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 250 250">
|
||||
<path fill="none" stroke="currentColor" strokeWidth="40" d="M5 5h240v240H5z" />
|
||||
</svg>
|
||||
)
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
import GetStartedTutorial from './GetStartedTutorial'
|
||||
import GetStartedTutorialIcon from './GetStartedTutorialIcon'
|
||||
|
||||
export default {
|
||||
title: 'GetStartedTutorial',
|
||||
name: 'GetStartedtutorial',
|
||||
icon: GetStartedTutorialIcon,
|
||||
component: GetStartedTutorial,
|
||||
}
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
{
|
||||
"parts": [
|
||||
{
|
||||
"implements": "part:@sanity/base/tool",
|
||||
"path": "./index.js"
|
||||
}
|
||||
]
|
||||
}
|
||||
8
sites/sanity/sanity.cli.js
Normal file
8
sites/sanity/sanity.cli.js
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
import { defineCliConfig } from 'sanity/cli'
|
||||
|
||||
export default defineCliConfig({
|
||||
api: {
|
||||
projectId: 'hl5bw8cj',
|
||||
dataset: 'production',
|
||||
},
|
||||
})
|
||||
19
sites/sanity/sanity.config.js
Normal file
19
sites/sanity/sanity.config.js
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
import { defineConfig } from 'sanity'
|
||||
import { deskTool } from 'sanity/desk'
|
||||
import { visionTool } from '@sanity/vision'
|
||||
import { markdownSchema } from 'sanity-plugin-markdown'
|
||||
import { schemaTypes } from './schemas'
|
||||
|
||||
export default defineConfig({
|
||||
name: 'default',
|
||||
title: 'FreeSewing',
|
||||
|
||||
projectId: 'hl5bw8cj',
|
||||
dataset: 'production',
|
||||
|
||||
plugins: [deskTool(), visionTool(), markdownSchema()],
|
||||
|
||||
schema: {
|
||||
types: schemaTypes,
|
||||
},
|
||||
})
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
{
|
||||
"root": true,
|
||||
"project": {
|
||||
"name": "FreeSewing CMS"
|
||||
},
|
||||
"api": {
|
||||
"projectId": "hl5bw8cj",
|
||||
"dataset": "production"
|
||||
},
|
||||
"plugins": [
|
||||
"@sanity/base",
|
||||
"@sanity/default-layout",
|
||||
"@sanity/default-login",
|
||||
"@sanity/desk-tool",
|
||||
"markdown"
|
||||
],
|
||||
"env": {
|
||||
"development": {
|
||||
"plugins": ["@sanity/vision"]
|
||||
}
|
||||
},
|
||||
"parts": [
|
||||
{
|
||||
"name": "part:@sanity/base/schema",
|
||||
"path": "./schemas/schema"
|
||||
},
|
||||
{
|
||||
"implements": "part:@sanity/base/root",
|
||||
"path": "plugins/sanity-plugin-tutorial/CustomDefaultLayout"
|
||||
},
|
||||
{
|
||||
"implements": "part:@sanity/base/brand-logo",
|
||||
"path": "./custom/logo.js"
|
||||
}
|
||||
]
|
||||
}
|
||||
13
sites/sanity/schemas/index.js
Normal file
13
sites/sanity/schemas/index.js
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
import { userimg, personimg } from './avatar.js'
|
||||
import { blogSchemaBuilder } from './blog.js'
|
||||
import { showcaseSchemaBuilder } from './showcase.js'
|
||||
import { newsletter } from './newsletter.js'
|
||||
|
||||
const languages = ['en', 'es', 'fr', 'nl', 'de']
|
||||
|
||||
export const schemaTypes = [
|
||||
userimg,
|
||||
personimg,
|
||||
...languages.map((lang) => blogSchemaBuilder(lang)),
|
||||
...languages.map((lang) => showcaseSchemaBuilder(lang)),
|
||||
]
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
import createSchema from 'part:@sanity/base/schema-creator'
|
||||
import schemaTypes from 'all:part:@sanity/base/schema-type'
|
||||
import { blogSchemaBuilder } from './blog.js'
|
||||
import { showcaseSchemaBuilder } from './showcase.js'
|
||||
import { newsletter } from './newsletter.js'
|
||||
import { userimg, personimg } from './avatar.js'
|
||||
|
||||
const languages = ['en', 'nl', 'de', 'es', 'fr']
|
||||
|
||||
export default createSchema({
|
||||
name: 'default',
|
||||
types: schemaTypes.concat([
|
||||
...languages.map((lang) => blogSchemaBuilder(lang)),
|
||||
...languages.map((lang) => showcaseSchemaBuilder(lang)),
|
||||
newsletter,
|
||||
userimg,
|
||||
personimg,
|
||||
]),
|
||||
})
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Loading…
Add table
Add a link
Reference in a new issue