I am trying to create a database using notion sdk and in this is what my payload looks like:
parent: {
type: "page_id",
page_id: process.env.PAGE_ID,
},
icon: {
type: "emoji",
emoji: "🐽",
},
title: [
{
type: "text",
text: {
content: "DB Title",
},
},
],
properties: {
"Prop-1": {
date: {},
},
"Prop-2": {
multi_select: {
options: [
{
name: "option-1",
color: "green",
},
{
name: "option-2",
color: "gray",
},
{
name: "option-3",
color: "pink",
},
],
},
},
"prop-3": {
multi_select: {
options: [],
},
},
},
I have already added title which can be seen above however the response give 400 status code.
#notionhq/client warn: request fail { code: 'validation_error', message: 'Title is not provided' }
Can't figure our where am I going wrong.
You also need to add a title column to your properties. Look at the example payload in the docs, you will see a "Name" title column.
https://developers.notion.com/reference/create-a-database
Related
I have created a sanity schema which works perfectly according to the tutorial. However I have a leaflet.js plugin and I am trying to get it to auto find my location when I create a new template in the sanity studio. This was already done in the tutorial below, but when I do it, I get the sanity map showing up but I do not get the marker on my current location. Instead I get the default San-Francisco.
In the tutorial the lady gets allows the browser to share her location. However I do not get that prompt. Is this something to do with localhost?
I am following this tutorial but I don't know what I missed.
Relevant parts from 31.00-37.00. Tutorial below:
https://www.youtube.com/watch?v=YtFfUER8ta8
Below is my posts.js
const getPosition = (options) => {
if (navigator.geolocation) {
return new Promise((resolve, reject) => {
navigator.geolocation.getCurrentPosition(resolve, reject, options);
});
}
};
export default {
name: "post",
title: "Blog Post",
type: "document",
initialvalue: async () => ({
postedAt: await getPosition()
.then(({ coords }) => {
const { latitude, longtitude, altitude } = coords;
return {
_type: "geopoint",
lat: latitude,
lng: longtitude,
alt: altitude || undefined,
};
})
.catch(() => undefined),
}),
fields: [
{
name: "title",
title: "Title",
type: "string",
},
{
name: "postedAt",
type: "geopoint",
title: "Location",
},
{
name: "slug",
title: "Slug",
type: "slug",
options: {
source: "title",
maxLength: 96,
},
},
{
name: "author",
title: "Author",
type: "reference",
to: { type: "author" },
},
{
name: "mainImage",
title: "Main image",
type: "image",
options: {
hotspot: true,
},
},
{
name: "categories",
title: "Categories",
type: "array",
of: [{ type: "reference", to: { type: "category" } }],
},
{
name: "publishedAt",
title: "Published at",
type: "datetime",
},
{
name: "body",
title: "Body",
type: "blockContent",
},
],
preview: {
select: {
title: "title",
author: "author.name",
media: "mainImage",
},
prepare(selection) {
const { author } = selection;
return Object.assign({}, selection, {
subtitle: author && `by ${author}`,
});
},
},
};
leaflet-input.json
{
"tileLayer": {
"attribution": "© OpenStreetMap contributors",
"url": "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
}
}
I have the following ContextualMenu structure inside my SPFx Extension build with Fluent UI React:
const menuProps: IContextualMenuProps = {
items: [
{
key: 'Access',
itemType: ContextualMenuItemType.Section,
sectionProps: {
topDivider: true,
bottomDivider: true,
title: 'Sites you have access to',
items: [
{ key: 'DynamicValue1.1', text: 'DynamicValue1.2' },
{ key: 'DynamicValue2.1', text: 'DynamicValue2.2' },
],
},
},
],
};
I also a MS Graph call running getting me some SharePoint Sites & Teams.
I would now like to push those dynamic responses to the to the menuProps at the right place.
So basically add the dynamic array into the nested items object.
items: [
{ key: 'DynamicValue1.1', text: 'DynamicValue1.2' },
{ key: 'DynamicValue2.1', text: 'DynamicValue2.2' },
],
How can I target that "object"? (hope I understand correctly and items is an object...)
Is there a way to do this using array.push()?
To make this library agnostic, it would look something like this:
const obj = {
items: [
{
key: 'Access',
itemType: '',
sectionProps: {
topDivider: true,
bottomDivider: true,
title: 'Sites you have access to',
items: [
{ key: 'DynamicValue1.1', text: 'DynamicValue1.2' },
{ key: 'DynamicValue2.1', text: 'DynamicValue2.2' },
],
},
},
],
};
obj.items[0].sectionProps.items.push({ key: 'DynamicValue3.1', text: 'DynamicValue3.2' })
console.log(obj.items[0].sectionProps.items)
Your console.log would return this:
[
{ key: 'DynamicValue1.1', text: 'DynamicValue1.2' },
{ key: 'DynamicValue2.1', text: 'DynamicValue2.2' },
{ key: 'DynamicValue3.1', text: 'DynamicValue3.2' }
]
If you can access menuProps: IContextualMenuProps, then just replace obj with the necessary variable.
As the question states. I'm trying to give a different color to each category in barcharts. It can be easily done in linecharts where we can pass each series as an object. But I haven't been able to do this on barcharts. Please see the picture to get more clarity.
Also, see demo code how I'm trying to achieve it. It looks something like below.
xAxis: {
categories: ['Nominal Bonds', 'Inflation', 'Equity'],
},
series: [
{
data: [{ name:'Nominal Bonds 1',y:5 }, { name:'Nominal Bonds 2',y:23}]
},
{
data: [{ name:'Inflation 1',y:15 }, { name:'Inflation 2',y:12}, { name:'Inflation 3',y:22}]
},
{
data: [{ name:'Equity 1',y:35}, { name:'Equity 2',y:21 }, { name:'Equity 3',y:52 }, { name:'Equity 4',y:31}]
}
]
Any help would be appreciated.
You can do it by using this: xAxis.type: 'category'
Pseudo code below:
xAxis: {
type: 'category',
},
series: [
{
data: [{ name:'Nominal Bonds 1',y:5 }, { name:'Nominal Bonds 2',y:23}]
},
{
data: [{ name:'Inflation 1',y:15 }, { name:'Inflation 2',y:12}, { name:'Inflation 3',y:22}]
},
{
data: [{ name:'Equity 1',y:35}, { name:'Equity 2',y:21 }, { name:'Equity 3',y:52 }, { name:'Equity 4',y:31}]
}
]
Demo: https://jsfiddle.net/BlackLabel/q97vxzct/
I want to show simple charts using Vue 2 and FusionCharts. I'm fetching my data from firebase and I run some calculations before I can fetch this to FusionCharts component. As these calculations are performed the result is stored in values in Vue's data function. I was following this link here. Problem is it defines chartData outside the export default. My question is how do i use values in my data function to populate my chart? My code looks something like this:
export default {
name: "dash",
data: () => ({
users: [],
total: 0,
activeCount: 0,
maleCount: 0,
femaleCount: 0,
newUssrs: 0
}),
computed: {
chartData: [
{
label: "Male",
value: this.maleCount
},
{
label: "Female",
value: this.femaleCount
}
],
dataSrc: {
chart: {
caption: "Total User Count",
subcaption: "",
xaxisname: "Gender",
yaxisname: "User counts",
numbersuffix: "",
theme: "fusion"
},
data: this.chartData
}
},
mounted() {
this.getData();
}
};
computed properties need to be functions which return the computed data. Like:
computed: {
chartData() {
return [
{
label: "Male",
value: this.maleCount
},
{
label: "Female",
value: this.femaleCount
}
]
},
dataSrc() {
return {
chart: {
caption: "Total User Count",
subcaption: "",
xaxisname: "Gender",
yaxisname: "User counts",
numbersuffix: "",
theme: "fusion"
},
data: this.chartData
}
}
},
I am trying to write some meta information for a website (using vue-meta) and I need to add some tags as objects within an array named meta.
The code is like this:
metaInfo() {
return {
htmlAttrs: { lang: "en"
},
title: this.Post.Title,
meta: [
{
name: "description", content: this.Post.Title
},
{
name: "date", content: this.Post.DateCreated
},
{
name: "author", content: this.Post.Author
},
// Now I need multiple objects of: {name: "tag", content: "Tags.TagName"} like this but doesn't work:
function() {
this.Tags.forEach(function (TagName, index) {
{ property: "tag", content: "TagName" }
})
}
],
}
}
How can I create my array so that I end up with this for example:
meta: [
{
name: "description", content: "Javascript question"
},
{
name: "date", content: "20200421"
},
{
name: "author", content: "volumeone"
},
{ property: "tag", content: "Javascript" }
,
{ property: "tag", content: "Programming" }
,
{ property: "tag", content: "Newbie" }
]
you can do such sort of thing.
var meta = [{
name: "description", content: this.Post.Title
},
{
name: "date", content: this.Post.DateCreated
},
{
name: "author", content: this.Post.Author
}]
this.Tags.forEach(function (TagName, index) {
meta.push({ property: "tag", content: "TagName" })
})
metaInfo() {
return {
htmlAttrs: { lang: "en"
},
title: this.Post.Title,
// or you can just write "meta" instead of "meta: meta" its an shorthand // code
meta: meta
}
}
Unless I'm missing something, you can just use push and pass the object.
var meta = [];
meta.push({"property" : "tag","content" : "test"});
console.log(meta);