Unsupported file types found. Prefix with an underscore (`_`) to ignore:- posts/blog.astro | Astro Lounge | Page 1

misty socket Apr 15, 2024, 5:54 PM

#

Why does the terminal give me this output?

[content] Unsupported file types found. Prefix with an underscore (`_`) to ignore:
- posts/blog.astro

nocturne tendonBOT Apr 15, 2024, 5:54 PM

#

Hi @misty socket. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

Astro supports a variety of file types out-of-the-box, including Astro Components (.astro). However, the error message you're seeing typically appears when Astro encounters a file type it doesn't recognize or support in a specific context. In this case, it seems to be having trouble with the posts/blog.astro file.

Astro's Content Collections API, introduced in Astro 2.0, is designed to work with Markdown and MDX files organized into different collections. If you're trying to use an .astro file in a context that expects Markdown or MDX files (like a content collection), you might encounter this error.

If the posts/blog.astro file is not meant to be part of a content collection, you might want to check if it's located in a directory that Astro is treating as a content collection. If that's the case, you could try moving the file to a different location.

If the file is meant to be part of a content collection, you might need to convert it to a supported format (like Markdown or MDX) or adjust your content collection configuration.

Please refer to the following sources for more information:

Astro's Supported File Types (https://docs.astro.build/en/guides/imports#_top)
Astro's Content Collections API (https://astro.build/blog/astro-2#automatic-type-safety-for-markdown--mdx)
Astro's Project Structure Guide (https://docs.astro.build/en/basics/project-structure/#public)

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Apr 15, 2024, 6:16 PM

#

@nocturne tendon Why am I getting this terminal output? ````Astro.glob({})` did not return any matching files. Check the pattern for typos.```

nocturne tendonBOT Apr 15, 2024, 6:16 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message you're seeing, "Astro.glob({}) did not return any matching files. Check the pattern for typos.", is indicating that the Astro.glob() function did not find any files that match the provided glob pattern.

A glob pattern is a file path that supports special wildcard characters, used to reference multiple files in your project at once. For example, the glob pattern ./pages/**/*.{md,mdx} starts within the pages subdirectory, looks through all of its subdirectories (/**), and matches any filename (/*) that ends in either .md or .mdx (.{md,mdx}).

In your case, it seems like you're passing an empty object ({}) as the glob pattern, which is not a valid pattern. The glob pattern must be a string literal and cannot contain any variables.

Here's an example of how to use Astro.glob() correctly:

const files = await Astro.glob('./pages/**/*.md');

This will match all .md files in the pages directory and its subdirectories.

If you're still having trouble, make sure your glob pattern starts with one of the following:

./ (to start in the current directory)
../ (to start in the parent directory)
/ (to start at the root of the project)

For more information, you can refer to the Astro documentation on glob patterns (https://docs.astro.build/en/guides/imports#glob-patterns) and the Astro documentation on the `Astro.glob()` function (https://docs.astro.build/en/reference/errors/astro-glob-no-match#_top).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Apr 17, 2024, 3:09 PM

#

@nocturne tendon Why I can't stylize my main? ```---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro";
import { getCollection } from "astro:content"
import PostList from "../components/PostList.astro";

const posts = await getCollection("posts");
console.log(posts)

main div {
    max-width: 200px;
    margin: 0 auto;
}

</style>```

nocturne tendonBOT Apr 17, 2024, 3:10 PM

#

Let me check the knowledge base for you. One moment! :books:

#

Astro uses scoped styles by default, which means that the CSS rules you define in a <style> tag only apply to the HTML written inside of the same component. In your case, the styles you've defined for the main tag and its div children are scoped to the current component.

However, the PostList component is a child component, and scoped styles won't apply to other Astro components contained inside of your template. If you need to style a child component, consider wrapping that component in a <div> (or other element) that you can then style.

Here's an example of how you can adjust your code:

---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro";
import { getCollection } from "astro:content"
import PostList from "../components/PostList.astro";

const posts = await getCollection("posts");
console.log(posts)
---

<html lang="en">
    <head>
        <BaseHead/>
    </head>
    <body>
        <Header/>
        <main>
            <div>
                <PostList posts={posts}/>
            </div>
        </main>
        <Footer/>
    </body>
</html>

<style>
    main {
        margin: 0 auto;
    }

    main div {
        max-width: 200px;
        margin: 0 auto;
    }
</style>

In this example, the PostList component is wrapped in a div that can be styled by the parent component.

For more information, you can refer to the Astro documentation on scoped styles (https://docs.astro.build/en/guides/styling#scoped-styles).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Apr 19, 2024, 10:44 AM

#

@nocturne tendon Type '{}' is not assignable to type 'IntrinsicAttributes & Props'. Property 'posts' is missing in type '{}' but required in type 'Props'.ts(2322) BlogHighlight.astro(5, 5): 'posts' is declared here.

nocturne tendonBOT Apr 19, 2024, 10:44 AM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message you're seeing is a TypeScript error indicating that a required prop named posts is missing when you're using the BlogHighlight component.

In Astro, when you define a component, you can specify the props it expects. In your case, it seems like the BlogHighlight component expects a prop named posts. When you use this component, you need to pass in the posts prop.

Here's an example of how you might be using the component:

<BlogHighlight />

And here's how you should be using it:

<BlogHighlight posts={yourPostsData} />

In the above example, yourPostsData should be the data you want to pass to the BlogHighlight component as the posts prop.

If you're still having trouble, you might want to check the definition of the BlogHighlight component to see what type of data it expects for the posts prop, and make sure you're passing data of the correct type.

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

misty socket Apr 23, 2024, 5:36 PM

#

@nocturne tendon why my title doesn't show up in h1? ```---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import SlotWrapper from "../components/SlotWrapper.astro";
import Footer from "../components/Footer.astro";

const { title, description } = Astro.props;

<html lang="en">
<head>
<BaseHead />
</head>
<body>
<Header />
<div class = "post">
<div class = "title">
<h1>{title}</h1>
<hr>
</div>
<SlotWrapper>
<slot />
<SlotWrapper>
</div>
<Footer />
</body>

nocturne tendonBOT Apr 23, 2024, 5:36 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The issue you're experiencing might be due to not passing the title prop when you're using this component. In your Astro component, you're destructuring title and description from Astro.props, which means these are expected to be passed in when the component is used.

Here's an example of how you might be using the component:

<MyComponent />

And here's how you should be using it:

<MyComponent title="My Title" description="My Description" />

In the above example, replace MyComponent with the actual name of your component, and replace "My Title" and "My Description" with the actual title and description you want to use.

If you're still having trouble, you might want to check where you're using this component to make sure you're passing in the title and description props correctly.

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Apr 23, 2024, 7:17 PM

#

@nocturne tendon why SlotWrapper style doesn't apply? ```<div>
<slot />
</div>

ul {
    list-style: disc;
    margin-block: 2em;
}

h1 {
    font-size: 2.6rem;
    margin-block: 2em;
}

h2 {
    font-size: 2.1rem;
    margin-block: 1.4em;
}

hr {
    width: 100%;
    margin: 0 auto 4em;
}

</style> ---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import SlotWrapper from "../components/SlotWrapper.astro"
import Footer from "../components/Footer.astro";

const { frontmatter } = Astro.props;
const { title } = Astro.props;

<html lang="en">
<head>
<BaseHead />
</head>
<body>
<Header />
<div class = "post">
<div class = "title">
<span class="date"></span>
<h1>{title}</h1>
<hr>
</div>
<SlotWrapper>
<slot />
</SlotWrapper>
</div>
<Footer />
</body>```

nocturne tendonBOT Apr 23, 2024, 7:17 PM

#

Let me check the knowledge base for you. One moment! :books:

#

Astro uses scoped styles by default, which means that the CSS rules you define in a <style> tag only apply to the HTML written inside of the same component. In your case, the styles you've defined in the SlotWrapper component are scoped to that component.

However, the content you're passing into the SlotWrapper component via the <slot /> tag is not part of the SlotWrapper component itself. It's part of the parent component that's using SlotWrapper. This means that the styles in SlotWrapper won't apply to the slotted content.

If you want to style the slotted content, you have a couple of options:

Define the styles in the parent component that's using SlotWrapper. This will ensure that the styles apply to the slotted content.
Use global styles. Global styles are not scoped to a specific component, so they apply to all elements on the page. You can define global styles in an external CSS file and then link to that file in your HTML.

Here's an example of how you can adjust your code:

---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import SlotWrapper from "../components/SlotWrapper.astro"
import Footer from "../components/Footer.astro";

const { frontmatter } = Astro.props;
const { title } = Astro.props;
---

<html lang="en">
    <head>
        <BaseHead />
    </head>
    <body>
        <Header />
        <div class = "post">
            <div class = "title">
                <span class="date"></span>
                <h1>{title}</h1>
                <hr>
            </div>
            <SlotWrapper>
                <slot />
            </SlotWrapper>
        </div>
        <Footer />
    </body>

    <style>
        li {
            font-size: 1.6rem;
            line-height: 1.6;
            margin-block: 0.5em;
            margin-left: 1.6em;
        }

#

ul {
list-style: disc;
margin-block: 2em;
}

    h1 {
        font-size: 2.6rem;
        margin-block: 2em;
    }

    h2 {
        font-size: 2.1rem;
        margin-block: 1.4em;
    }

    hr {
        width: 100%;
        margin: 0 auto 4em;
    }
</style>

</html>


In this example, the styles are defined in the parent component, so they will apply to the slotted content.

For more information, you can refer to the **Astro documentation on scoped styles** (<https://docs.astro.build/en/guides/styling#scoped-styles>).
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Apr 23, 2024, 8:22 PM

#

@nocturne tendon ```Cannot read properties of undefined (reading 'title')
layouts/PostLayout.astro:19:34
Open in editor

import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro";
import "../styles/slotwrapper.css"

const { frontmatter } = Astro.props;

<html lang="en">
<head>
<BaseHead />
</head>
<body>
<Header />
<div class = "post">
<div class = "title">
<span class="date"></span>
<h1>{frontmatter.title}</h1>
<hr>
</div>
<div class="slot-wrapper">
<slot />
</div>
</div>
<Footer />
</body>

</style>```

nocturne tendonBOT Apr 23, 2024, 8:22 PM

#

Let me check the knowledge base for you. One moment! :books:

#

Sorry @misty socket, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:

Perhaps try again in 15mins?

misty socket Apr 23, 2024, 8:45 PM

#

@nocturne tendon ```Cannot read properties of undefined (reading 'title')
layouts/PostLayout.astro:19:34
Open in editor

import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro";
import "../styles/slotwrapper.css"

const { frontmatter } = Astro.props;

<html lang="en">
<head>
<BaseHead />
</head>
<body>
<Header />
<div class = "post">
<div class = "title">
<span class="date"></span>
<h1>{frontmatter.title}</h1>
<hr>
</div>
<div class="slot-wrapper">
<slot />
</div>
</div>
<Footer />
</body>

</style>```

nocturne tendonBOT Apr 23, 2024, 8:45 PM

#

Let me check the knowledge base for you. One moment! :books:

#

Sorry @misty socket, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:

Perhaps try again in 15mins?

misty socket Apr 29, 2024, 10:44 AM

#

@nocturne tendon Cannot read properties of undefined (reading 'data') ```---
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro";
import "../styles/slotwrapper.css"
import FormattedDate from '../components/FormattedDate.astro';

const { date, title } = Astro.props;

import { type CollectionEntry } from "astro:content"

type Props = {
post: CollectionEntry<"posts">
}

const { post } = Astro.props

<html lang="en">
<head>
<BaseHead />
</head>
<body>
<Header />
<main>
<div class = "post">
<div class = "title">
<span class="date"><FormattedDate date={date}/></span>
<h1>title={post.data.title}</h1>
<hr>
</div>
<div class="slot-wrapper">
<slot />
</div>
</div>
</main>
<Footer />
</body>

</style>

nocturne tendonBOT Apr 29, 2024, 10:44 AM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message "Cannot read properties of undefined (reading 'data')" suggests that post is undefined at the time you're trying to access post.data.title.

In your Astro component, you're destructuring post from Astro.props, which means post is expected to be passed in as a prop when the component is used.

Here's an example of how you might be using the component:

<MyComponent />

And here's how you should be using it:

<MyComponent post={{yourPostData}} />

In the above example, replace MyComponent with the actual name of your component, and replace yourPostData with the actual post data you want to pass to the component as the post prop.

If you're still having trouble, you might want to check where you're using this component to make sure you're passing in the post prop correctly. Also, ensure that the post object has a data property that contains a title.

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket May 25, 2024, 1:32 PM

#

@nocturne tendon why this form which is in html file gives 404 at submission? <form name="contact" method="POST" data-netlify="true"> <p> <label>Your Name: <input type="text" name="name" /></label> </p> <p> <label>Your Email: <input type="email" name="email" /></label> </p> <p> <label>Your Role: <select name="role[]" multiple> <option value="leader">Leader</option> <option value="follower">Follower</option> </select></label> </p> <p> <label>Message: <textarea name="message"></textarea></label> </p> <p> <button type="submit">Send</button> </p> </form>

nocturne tendonBOT May 25, 2024, 1:32 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The form submission might be resulting in a 404 error due to how the form's action is being handled. In your form, you haven't specified an action attribute, which means the form data will be sent to the current page URL by default. If the current page isn't set up to handle form submissions, this could result in a 404 error.

If you're using a service like Netlify to handle form submissions (as indicated by the data-netlify="true" attribute), you might want to check your Netlify settings to make sure everything is configured correctly.

Additionally, there are known issues with form submissions in Astro. For example, if you're using Astro's ViewTransitions and have an HTML input with a name attribute that's either method or action, submitting a form can result in a broken route and a 404 error. This is due to a concept called DOM clobbering and incorrect assumptions about the form.action and form.method properties (source (https://github.com/withastro/astro/issues/10849)).

If you're using Astro and encountering this issue, you might want to follow the workaround suggested in the linked GitHub issue, which involves reading the action and method attributes directly instead of accessing them as properties of the form element.

For more information, you can refer to the Astro documentation on building forms with API routes (https://docs.astro.build/en/recipes/build-forms-api/#_top) and the HTML specification on form submission (https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#form-submission-0).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Jul 23, 2024, 3:10 PM

#

@nocturne tendon Cannot read properties of undefined (reading 'render')
blog/[slug].astro:25:30
Open in editor

import { getCollection, type CollectionEntry } from "astro:content"
import PostLayout from "../../layouts/PostLayout.astro"

export const getStaticPaths = async () => {
const posts = await getCollection("posts")
const paths = posts.map(post => {
return {
params: {
slug: post.slug
},
props: {
post
}
}
})
return paths
}

type Props = {
post: CollectionEntry<"posts">
}

const {post} = Astro.props
const {Content} = await post.render()

nocturne tendonBOT Jul 23, 2024, 3:10 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message "Cannot read properties of undefined (reading 'render')" suggests that post is undefined at the time you're trying to access post.render().

In your Astro component, you're destructuring post from Astro.props, which means post is expected to be passed in as a prop when the component is used.

Here's an example of how you might be using the component:

<MyComponent />

And here's how you should be using it:

<MyComponent post={{yourPostData}} />

In the above example, replace MyComponent with the actual name of your component, and replace yourPostData with the actual post data you want to pass to the component as the post prop.

If you're still having trouble, you might want to check where you're using this component to make sure you're passing in the post prop correctly. Also, ensure that the post object has a render method.

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Aug 6, 2024, 4:03 PM

#

@nocturne tendon TypeError An error occurred. Expected "meetups" to be a stringist/index.js:237:19 Open in editor "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.pathToRegexp = exports.tokensToRegexp = exports.regexpToFunction = exports.match = exports.tokensToFunction = exports.compile = exports.parse = void 0; /**

nocturne tendonBOT Aug 6, 2024, 4:03 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message "Expected 'meetups' to be a string" suggests that a function or method in your code is expecting a string argument named "meetups", but it's receiving a different type of data.

The error seems to be originating from the pathToRegexp function in the index.js file. This function is part of the path-to-regexp library, which is used to convert a URL pattern into a regular expression.

Here's an example of how you might be using the function:

const regexp = pathToRegexp(meetups);

In this example, meetups should be a string representing a URL pattern, like "/user/:name".

If meetups is not a string, you'll need to convert it to a string before passing it to pathToRegexp. If meetups is an array or object, you might need to access a specific property or use a method like Array.join() or JSON.stringify() to convert it to a string.

Without more context, it's hard to provide a more specific solution. You might want to check where you're calling pathToRegexp in your code to make sure you're passing in the correct arguments.

For more information, you can refer to the path-to-regexp documentation (https://github.com/pillarjs/path-to-regexp).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Aug 6, 2024, 4:20 PM

#

Expected "meetups" to be a string``` ```---
import { getCollection, type CollectionEntry } from "astro:content"
import PostLayout from "../../layouts/PostLayout.astro"

export const getStaticPaths = async () => {
    const meetups = await getCollection("meetups")
    const paths = meetups.map(meetup => {
        return {
            params: {
                slug: meetup.slug
            },
            props: {
                meetup
            }
        }
    })
    return paths
}

type Props = {
    meetup: CollectionEntry<"meetups">
}

const { meetup } = Astro.props
const {Content} = await meetup.render()
---
<PostLayout {...meetup.data}>
    <Content />
</PostLayout>```

#

@nocturne tendon 18:18:23 [ERROR] [build] Failed to call getStaticPaths for src/pages/meetups/[meetups].astro Expected "meetups" to be a string ```---
import { getCollection, type CollectionEntry } from "astro:content"
import PostLayout from "../../layouts/PostLayout.astro"

export const getStaticPaths = async () => {
const meetups = await getCollection("meetups")
const paths = meetups.map(meetup => {
return {
params: {
slug: meetup.slug
},
props: {
meetup
}
}
})
return paths
}

type Props = {
meetup: CollectionEntry<"meetups">
}

const { meetup } = Astro.props
const {Content} = await meetup.render()

<PostLayout {...meetup.data}>
<Content />
</PostLayout>```

nocturne tendonBOT Aug 6, 2024, 4:20 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message "Expected 'meetups' to be a string" suggests that the getStaticPaths function is expecting a string for the dynamic route parameter, but it's receiving a different type of data.

In your Astro component, you're defining a dynamic route with the parameter meetups (as indicated by the file name [meetups].astro). However, in your getStaticPaths function, you're returning an array of objects with a params property that includes a slug property, not a meetups property.

Here's the relevant part of your code:

const paths = meetups.map(meetup => {
    return {
        params: {
            slug: meetup.slug
        },
        props: {
            meetup
        }
    }
})

To fix the error, you should change slug to meetups in the params object:

const paths = meetups.map(meetup => {
    return {
        params: {
            meetups: meetup.slug
        },
        props: {
            meetup
        }
    }
})

In this corrected code, each params object includes a meetups property that corresponds to the dynamic route parameter in the file name [meetups].astro.

For more information, you can refer to the Astro documentation on dynamic routes (https://docs.astro.build/en/guides/routing/#dynamic-routes).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Aug 6, 2024, 4:39 PM

#

@nocturne tendon TypeError An error occurred. Cannot read properties of undefined (reading 'slice') ```---
import type { CollectionEntry } from "astro:content";
import Meetup from "./Meetup.astro";

type Props = {
meetups: CollectionEntry<"meetups">[]
}
const { meetups } = Astro.props;

        <div>
          {meetups.slice(0, 3).map((meetup) => <Meetup meetup={meetup} />)}
        </div>```

nocturne tendonBOT Aug 6, 2024, 4:39 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message "Cannot read properties of undefined (reading 'slice')" suggests that meetups is undefined at the time you're trying to call meetups.slice(0, 3).

In your Astro component, you're destructuring meetups from Astro.props, which means meetups is expected to be passed in as a prop when the component is used.

Here's an example of how you might be using the component:

<MyComponent />

And here's how you should be using it:

<MyComponent meetups={{yourMeetupsData}} />

In the above example, replace MyComponent with the actual name of your component, and replace yourMeetupsData with the actual meetups data you want to pass to the component as the meetups prop.

If you're still having trouble, you might want to check where you're using this component to make sure you're passing in the meetups prop correctly. Also, ensure that meetups is an array, as the slice method is only available on arrays.

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Aug 6, 2024, 6:19 PM

#

@nocturne tendon why am i getting (alias) getCollection<"meetups", ({ id: "akcja-sznurek-3.md"; slug: "akcja-sznurek-3"; body: string; collection: "meetups"; data: InferEntrySchema<"meetups">; } & { ...; }) | ({ ...; } & { ...; })>(collection: "meetups", filter?: ((entry: ({ ...; } & { ...; }) | ({ ...; } & { ...; })) => entry is ({ ...; } & { ...; }) | ({ ...; } & { ...; })) | undefined): Promise<...> (+1 overload) import getCollection from const meetups = (await getCollection('meetups')).sort( (a, b) => b.data.date.valueOf() - a.data.date.valueOf() ); I want it to show the frontmatter

nocturne tendonBOT Aug 6, 2024, 6:19 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The getCollection() function in Astro is used to retrieve a list of content collection entries by collection name. It returns all items in the collection by default, and accepts an optional filter function to narrow by entry properties. This allows you to query for only some items in a collection based on id, slug, or frontmatter values via the data object (source (https://docs.astro.build/en/reference/api-reference/#getcollection)).

The frontmatter values of each entry in the collection can be accessed through the data property of the entry. For example, if you have a frontmatter field named date, you can access it like this: entry.data.date.

In your code, you're using getCollection('meetups') to get all entries in the 'meetups' collection, and then you're sorting them based on the date frontmatter field. If you're getting an error, it might be because one or more entries in the 'meetups' collection don't have a date field in their frontmatter.

Here's how you can handle this:

const meetups = (await getCollection('meetups'))
  .filter(meetup => meetup.data.date) // Only include meetups with a date
  .sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());

In this corrected code, the filter method is used to only include meetups that have a date field in their frontmatter. This ensures that when you call date.valueOf() in the sort method, date is not undefined.

For more information, you can refer to the Astro documentation on content collections (https://docs.astro.build/en/guides/content-collections/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Aug 24, 2024, 4:30 PM

#

@nocturne tendon ```date.toISOString is not a function
components/FormattedDate.astro:12:22
Open in editor

interface Props {
date: Date;
}

const { date } = Astro.props;

<time datetime={date.toISOString()}>
{
date.toLocaleDateString('pl-PL', {
year: 'numeric',
month: 'numeric',
day: 'numeric',
})
}
</time>```

nocturne tendonBOT Aug 24, 2024, 4:30 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message "date.toISOString is not a function" suggests that date is not a Date object at the time you're trying to call date.toISOString().

In your Astro component, you're destructuring date from Astro.props, which means date is expected to be passed in as a prop when the component is used.

Here's an example of how you might be using the component:

<FormattedDate />

And here's how you should be using it:

<FormattedDate date={{new Date(yourDateString)}} />

In the above example, replace FormattedDate with the actual name of your component, and replace yourDateString with the actual date string you want to pass to the component as the date prop.

If you're still having trouble, you might want to check where you're using this component to make sure you're passing in the date prop correctly. Also, ensure that date is a Date object, as the toISOString method is only available on Date objects.

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Sep 21, 2024, 7:33 PM

#

@nocturne tendon This Google Analytics script causes errors:  <script async src="https://www.googletagmanager.com/gtag/js?id=G-EZL17G4ED5"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-EZL17G4ED5'); </script> 9:23:53 PM: 2 <script async src="https://www.googletagmanager.com/gtag/js?id=G-EZL17G4ED5"></script> 9:23:53 PM: ~~~~~ 9:23:53 PM: src/components/GoogleAnalytics.astro:8:8 - error ts(2554): Expected 0 arguments, but got 2. 9:23:53 PM: 8 gtag('config', 'G-EZL17G4ED5'); 9:23:53 PM: ~~~~~~~~~~~~~~~~~~~~~~~~ 9:23:53 PM: src/components/GoogleAnalytics.astro:6:8 - error ts(2554): Expected 0 arguments, but got 2. 9:23:53 PM: 6 gtag('js', new Date()); 9:23:53 PM: ~~~~~~~~~~~~~~~~ 9:23:53 PM: src/components/GoogleAnalytics.astro:5:19 - error ts(2304): Cannot find name 'dataLayer'. 9:23:53 PM: 5 function gtag(){dataLayer.push(arguments);} 9:23:53 PM: ~~~~~~~~~ 9:23:53 PM: src/components/GoogleAnalytics.astro:4:29 - error ts(2339): Property 'dataLayer' does not exist on type 'Window & typeof globalThis'. 9:23:53 PM: 4 window.dataLayer = window.dataLayer || []; 9:23:53 PM: ~~~~~~~~~ 9:23:53 PM: src/components/GoogleAnalytics.astro:4:10 - error ts(2339): Property 'dataLayer' does not exist on type 'Window & typeof globalThis'. 9:23:53 PM: 4 window.dataLayer = window.dataLayer || [];

nocturne tendonBOT Sep 21, 2024, 7:33 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The errors you're seeing are TypeScript errors. TypeScript is a statically typed superset of JavaScript, which means it adds static types to the language. This can help prevent errors at runtime by catching them at compile time.

In your case, TypeScript is complaining because it doesn't know about the dataLayer property on the window object and the gtag function. These are specific to Google Analytics and are not part of the standard JavaScript window object or global scope, so TypeScript doesn't know about them by default.

To fix these errors, you can tell TypeScript about these Google Analytics-specific properties and functions by declaring them. Here's how you can adjust your code:

<!-- Google tag (gtag.js) -->
<script async src="<https://www.googletagmanager.com/gtag/js?id=G-EZL17G4ED5"></script>>
<script>
  declare global {
    interface Window { dataLayer: any; }
    function gtag(...args: any[]): void;
  }
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-EZL17G4ED5');
</script>

In this corrected code, the declare global block tells TypeScript about the dataLayer property on the window object and the gtag function. This should prevent the TypeScript errors you were seeing.

However, please note that Astro currently doesn't support TypeScript in the <script> tags within .astro files. So, you might want to consider moving your Google Analytics code to a separate .js or .ts file and then importing that file in your Astro component.

#

For more information, you can refer to the Astro documentation on using scripts (https://docs.astro.build/en/guides/client-side-scripts) and the TypeScript documentation on declaration files (https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Sep 21, 2024, 7:41 PM

#

@nocturne tendon it helps but still getting 9:23:53 PM: src/components/GoogleAnalytics.astro:8:8 - error ts(2554): Expected 0 arguments, but got 2. 9:23:53 PM: 8 gtag('config', 'G-EZL17G4ED5'); 9:23:53 PM: ~~~~~~~~~~~~~~~~~~~~~~~~ 9:23:53 PM: src/components/GoogleAnalytics.astro:6:8 - error ts(2554): Expected 0 arguments, but got 2. 9:23:53 PM: 6 gtag('js', new Date()); 9:23:53 PM: ~~~~~~~~~~~~~~~~ error

nocturne tendonBOT Sep 21, 2024, 7:41 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The TypeScript errors you're seeing are because TypeScript expects the gtag function to have no arguments, but you're calling it with two arguments. This is because when you declared the gtag function, you didn't specify any parameters:

function gtag(...args: any[]): void;

To fix these errors, you can adjust your function declaration to expect two arguments:

function gtag(command: string, value: any): void;

Here's how your corrected code might look:

<!-- Google tag (gtag.js) -->
<script async src="<https://www.googletagmanager.com/gtag/js?id=G-EZL17G4ED5"></script>>
<script>
  declare global {{
    interface Window {{ dataLayer: any; }}
    function gtag(command: string, value: any): void;
  }}
  window.dataLayer = window.dataLayer || [];
  function gtag(){{dataLayer.push(arguments);}}
  gtag('js', new Date());
  gtag('config', 'G-EZL17G4ED5');
</script>

In this corrected code, the gtag function is declared to expect two arguments: a command string and a value of any type. This should prevent the TypeScript errors you were seeing.

However, as mentioned before, Astro currently doesn't support TypeScript in the <script> tags within .astro files. So, you might want to consider moving your Google Analytics code to a separate .js or .ts file and then importing that file in your Astro component.

For more information, you can refer to the Astro documentation on using scripts (https://docs.astro.build/en/guides/client-side-scripts) and the TypeScript documentation on function types (https://www.typescriptlang.org/docs/handbook/2/functions.html#function-types).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Sep 21, 2024, 8:10 PM

#

@nocturne tendon ```ReferenceError
An error occurred.
window is not defined
Browser APIs are not available on the server.

If the code is in a framework component, try to access these objects after rendering using lifecycle methods or use a client:only directive to make the component exclusively run on the client.

See https://docs.astro.build/en/guides/troubleshooting/#document-or-window-is-not-defined for more information.```

nocturne tendonBOT Sep 21, 2024, 8:10 PM

#

Let me check the knowledge base for you. One moment! :books:

#

The error message "window is not defined" suggests that you're trying to access the window object on the server. The window object is a browser-specific global object and is not available on the server.

Astro components run on the server, so you can’t access these browser-specific objects within the frontmatter. This error can occur when accessing window during rendering.

Here are some solutions:

Determine the code that calls window. If you aren’t using window directly and still getting this error, check to see if any packages you’re importing are meant to run on the client.
If the code is in an Astro component, move it to a <script> tag outside of the frontmatter. This tells Astro to run this code on the client, where window is available.
If the code is in a framework component, try to access these objects after rendering using lifecycle methods (e.g. useEffect() in React, onMounted() in Vue, and onMount() in Svelte). Tell the framework component to hydrate client-side by using a client: directive, like client:load, to run these lifecycle methods. You can also prevent the component from rendering on the server at all by adding the client:only directive.

For more information, you can refer to the Astro documentation on troubleshooting this error (https://docs.astro.build/en/guides/troubleshooting/#document-or-window-is-not-defined).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Oct 9, 2024, 8:59 PM

#

@nocturne tendon why my js code works in localhost but not when deployed to Netlify?

nocturne tendonBOT Oct 9, 2024, 8:59 PM

#

Let me check the knowledge base for you. One moment! :books:

#

There could be several reasons why your JavaScript code works in your local development environment but not when deployed to Netlify. Here are a few possibilities:

Different Node.js versions: If you're using a legacy build image (Xenial) on Netlify, make sure that your Node.js version is set. Astro requires v18.17.1 or v20.3.0 or higher. You can specify your Node.js version in Netlify using a .nvmrc file in your base directory or a NODE_VERSION environment variable in your site’s settings using the Netlify project dashboard (source (https://docs.astro.build/en/guides/deploy/netlify/#set-a-nodejs-version)).
Build process differences: Some hosts like Netlify will build your site for you and then publish that build output to the web. But, some sites will require you to build locally and then run a deploy command or upload your build output. Make sure you're building your site correctly for Netlify (source (https://docs.astro.build/en/guides/deploy/#building-your-site-locally)).
Environment variables: If your code relies on environment variables, make sure they're set correctly on Netlify. Environment variables can be set in the Netlify dashboard under Site settings > Build & deploy > Environment.
Browser compatibility: If your code uses newer JavaScript features, it might not work in all browsers. Make sure your code is transpiled to a version of JavaScript that's compatible with all the browsers you want to support.
CORS issues: If your code makes requests to other domains, you might run into Cross-Origin Resource Sharing (CORS) issues. These issues can often be resolved by configuring the server to send the appropriate CORS headers.

#

If you're still having trouble, you might want to check the browser console for any error messages when your site is running on Netlify. These error messages can often provide clues about what's going wrong.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket kapa.ai is still learning and improving, please let us know how it did by reacting below

misty socket Oct 22, 2024, 6:21 PM

#

@nocturne tendon {otherAdoptions.slice(0, 4).map((adoption) => (
<AdoptionCard adoption={adoption} key={adoption.slug} />
))} const { title, description, date, pigeon_name, species, breed, gender, pubImage, slug} = Astro.props;

import { getCollection } from "astro:content"
const adoptions = await getCollection("adoptions");
const otherAdoptions = adoptions.filter(adoption => adoption.slug !== slug); Why it doesn't exclude card with the current slug?

nocturne tendonBOT Oct 22, 2024, 6:21 PM

#

Let me check the knowledge base for you again. One moment! :books:

#

The code you've provided is using the filter method to create a new array otherAdoptions that should exclude the adoption with the current slug. If it's not working as expected, there could be a few reasons:

Check the slug value: Make sure the slug value you're comparing against in the filter function is correct. If slug is undefined or not what you expect, the filter function might not work as expected.
Check the adoptions data: Make sure the adoptions data returned by getCollection("adoptions") is what you expect. If the adoptions data doesn't include the adoption with the current slug, the filter function won't be able to exclude it.
Check the filter function: The filter function should return true for elements you want to keep and false for elements you want to exclude. In your case, it should return true when adoption.slug is not equal to slug, and false when adoption.slug is equal to slug. Make sure your filter function is working as expected.

Here's how you can debug this:

console.log(slug); // Check the slug value
console.log(adoptions); // Check the adoptions data
console.log(otherAdoptions); // Check the otherAdoptions data

Add these console.log statements to your code and check the console output. This should give you some clues about what's going wrong.

For more information, you can refer to the Astro documentation on content collections (https://docs.astro.build/en/guides/content-collections/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket Kapa.ai is still learning and improving, please let me know how I did by reacting below.

misty socket Oct 22, 2024, 6:25 PM

#

@nocturne tendon slug is undefined, but how can i get an actual slug if it's AdoptionLayout?

nocturne tendonBOT Oct 22, 2024, 6:25 PM

#

Let me check the knowledge base for you again. One moment! :books:

#

In Astro, you can access the current page's slug using Astro.params. This is particularly useful when you're working with dynamic routes, where the slug is part of the URL.

Here's an example of how you can get the slug in an Astro component:

const { slug } = Astro.params;

In your case, if slug is undefined, it might be because you're trying to access it in a layout component. Layout components are used to wrap other components, and they don't have direct access to the Astro.params of the page they're used on.

If you need to access the slug in a layout component, you should pass it as a prop from the page component to the layout component. Here's an example:

---
// In your page component
import AdoptionLayout from '../layouts/AdoptionLayout.astro';
const { slug } = Astro.params;
---
<AdoptionLayout slug={slug}>
  <!-- Page content here -->
</AdoptionLayout>

Then, in your AdoptionLayout component, you can access the slug prop like this:

---
// In your layout component
const { slug } = Astro.props;
---
<!-- Layout content here -->

For more information, you can refer to the Astro documentation on routing (https://docs.astro.build/en/guides/routing/) and Astro documentation on layouts (https://docs.astro.build/en/core-concepts/layouts/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket Kapa.ai is still learning and improving, please let me know how I did by reacting below.

misty socket Oct 22, 2024, 6:28 PM

#

@nocturne tendon I already have slug in adoption.data <AdoptionLayout {...adoption.data}>
<Content />
</AdoptionLayout>

nocturne tendonBOT Oct 22, 2024, 6:28 PM

#

Let me check the knowledge base for you again. One moment! :books:

#

If you're already passing slug as part of adoption.data to the AdoptionLayout component, you can access it in the AdoptionLayout component using Astro.props. Here's how:

---
// In your layout component
const { slug } = Astro.props;
---
<!-- Layout content here -->

In this code, Astro.props contains all the props passed to the AdoptionLayout component, including slug.

If slug is still undefined, make sure it's included in adoption.data when you're passing it to the AdoptionLayout component. You can check this by logging adoption.data in your page component:

console.log(adoption.data); // Check the adoption.data value

Add this console.log statement to your page component and check the console output. This should give you some clues about what's going wrong.

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@misty socket Kapa.ai is still learning and improving, please let me know how I did by reacting below.

misty socket Oct 25, 2024, 5:26 PM

#

@nocturne tendon if i use astro with ssr netlify adapter, deploy website to netlify and use supabase do i need to host backend on heroku?

nocturne tendonBOT Oct 25, 2024, 5:26 PM

#

Let me check the knowledge base for you again. One moment! :books:

#

Based on the information provided in the knowledge sources, you don't need to host a separate backend on Heroku if you're using Astro with SSR, the Netlify adapter, and Supabase. Here's why:

Astro with SSR: Astro supports server-side rendering (SSR) which allows you to run server-side code directly within your Astro project source (https://docs.astro.build/en/guides/server-side-rendering/).
Netlify adapter: The Netlify adapter allows Astro to deploy your SSR site to Netlify source (https://docs.astro.build/en/guides/integrations-guide/netlify/#_top). This means your server-side code can run on Netlify's infrastructure.
Supabase: Supabase is a Backend-as-a-Service (BaaS) platform that provides a Postgres database, authentication, edge functions, realtime subscriptions, and storage source (https://docs.astro.build/en/guides/backend/supabase/#_top). It acts as your backend without requiring you to set up and manage a separate server.

By using these technologies together, you can create a full-stack application without the need for a separate backend hosted on Heroku. Your Astro SSR functions can interact with Supabase directly, handling any necessary server-side logic, while Supabase provides the database and other backend services.

To set this up, you would:

Use the Netlify adapter in your Astro project for SSR.
Deploy your Astro project to Netlify.
Set up a Supabase project and use its client libraries in your Astro SSR functions to interact with the database and other Supabase services.

#

This setup allows you to have a serverless architecture where Netlify handles your SSR functions and Supabase provides your backend services, eliminating the need for a traditional backend server like one you might host on Heroku.

#Unsupported file types found. Prefix with an underscore (`_`) to ignore:- posts/blog.astro

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on glob patterns (https://docs.astro.build/en/guides/imports#glob-patterns) and the Astro documentation on the Astro.glob() function (https://docs.astro.build/en/reference/errors/astro-glob-no-match#_top).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

const posts = await getCollection("posts"); console.log(posts)

For more information, you can refer to the Astro documentation on scoped styles (https://docs.astro.build/en/guides/styling#scoped-styles).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

const { title, description } = Astro.props;

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

const { frontmatter } = Astro.props; const { title } = Astro.props;

@nocturne tendon ```Cannot read properties of undefined (reading 'title') layouts/PostLayout.astro:19:34 Open in editor

const { frontmatter } = Astro.props;

@nocturne tendon ```Cannot read properties of undefined (reading 'title') layouts/PostLayout.astro:19:34 Open in editor

const { frontmatter } = Astro.props;

const { post } = Astro.props

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on building forms with API routes (https://docs.astro.build/en/recipes/build-forms-api/#_top) and the HTML specification on form submission (https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#form-submission-0).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@nocturne tendon Cannot read properties of undefined (reading 'render') blog/[slug].astro:25:30 Open in editor

const {post} = Astro.props const {Content} = await post.render()

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the path-to-regexp documentation (https://github.com/pillarjs/path-to-regexp).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

const { meetup } = Astro.props const {Content} = await meetup.render()

For more information, you can refer to the Astro documentation on dynamic routes (https://docs.astro.build/en/guides/routing/#dynamic-routes).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

type Props = { meetups: CollectionEntry<"meetups">[] } const { meetups } = Astro.props;

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on content collections (https://docs.astro.build/en/guides/content-collections/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@nocturne tendon ```date.toISOString is not a function components/FormattedDate.astro:12:22 Open in editor

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on using scripts (https://docs.astro.build/en/guides/client-side-scripts) and the TypeScript documentation on declaration files (https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on using scripts (https://docs.astro.build/en/guides/client-side-scripts) and the TypeScript documentation on function types (https://www.typescriptlang.org/docs/handbook/2/functions.html#function-types).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on troubleshooting this error (https://docs.astro.build/en/guides/troubleshooting/#document-or-window-is-not-defined).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

If you're still having trouble, you might want to check the browser console for any error messages when your site is running on Netlify. These error messages can often provide clues about what's going wrong.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on content collections (https://docs.astro.build/en/guides/content-collections/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on routing (https://docs.astro.build/en/guides/routing/) and Astro documentation on layouts (https://docs.astro.build/en/core-concepts/layouts/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on components and props (https://docs.astro.build/en/core-concepts/astro-components).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

This setup allows you to have a serverless architecture where Netlify handles your SSR functions and Supabase provides your backend services, eliminating the need for a traditional backend server like one you might host on Heroku.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

For more information, you can refer to the Astro documentation on glob patterns (https://docs.astro.build/en/guides/imports#glob-patterns) and the Astro documentation on the `Astro.glob()` function (https://docs.astro.build/en/reference/errors/astro-glob-no-match#_top).

const posts = await getCollection("posts");
console.log(posts)

const { frontmatter } = Astro.props;
const { title } = Astro.props;

@nocturne tendon ```Cannot read properties of undefined (reading 'title')
layouts/PostLayout.astro:19:34
Open in editor

@nocturne tendon ```Cannot read properties of undefined (reading 'title')
layouts/PostLayout.astro:19:34
Open in editor

@nocturne tendon Cannot read properties of undefined (reading 'render')
blog/[slug].astro:25:30
Open in editor

const {post} = Astro.props
const {Content} = await post.render()

const { meetup } = Astro.props
const {Content} = await meetup.render()

type Props = {
meetups: CollectionEntry<"meetups">[]
}
const { meetups } = Astro.props;

@nocturne tendon ```date.toISOString is not a function
components/FormattedDate.astro:12:22
Open in editor