Daniel Sousa @TutoDS Posts - Answer Overflow

Topics

Daniel Sousa @TutoDS

Explore posts from servers

SSolidJS RRefine

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

Hi everyone I'm facing an issue where my DEFAULT SEO overrides the ROUTE SEO. I created two components (on the thread): - the default.tsx where I import on app.tsx; - the page.tsx where I import on each route. But, when I see the meta tags, they are from the default.tsx instead of the page.tsx. Any way to keep the default and override it on the routes?

9 replies

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

Hi everyone I'm using cache to request my sanity data, but who I can "forgot" the cache when update something on the sanity?

16 replies

•Created by Daniel Sousa @TutoDS on 10/20/2024 in #support

Add scripts to header from string

Hi everyone I want to add a few scripts to my header, but I want to receive these scripts from Sanity CMS, so I will receive it as string. Any way to do it?

19 replies

•Created by Daniel Sousa @TutoDS on 9/23/2024 in #support

Filtering projects not working

Hi everyone I'm trying to filtering my projects list according to a "tabs", where I click and set the searchParam tab, but isn't working. Only works if I refresh the page. This is my createAsync:

  const data = createAsync(async () => {
    let currentPage = searchParams.page ? Number(searchParams.page) : 1;
    const pages = await getPaginatedProjects(currentPage, DEFAULT_PAGINATION_OFFSET);
    const numberOfPages = Math.ceil(pages.total / DEFAULT_PAGINATION_OFFSET);

    if (currentPage > pages.total) {
      currentPage = numberOfPages;
    }

    if (currentTab() !== 'all') {
      const { data, total } = await getPaginatedProjectsByService(
        currentTab(),
        currentPage,
        DEFAULT_PAGINATION_OFFSET,
      );

      return {
        data,
        total,
        currentPage,
      };
    }

    const { data, total } = await getPaginatedProjects(
      currentPage,
      DEFAULT_PAGINATION_OFFSET,
    );

    return {
      data,
      total,
      currentPage,
    };
  });

  const data = createAsync(async () => {
    let currentPage = searchParams.page ? Number(searchParams.page) : 1;
    const pages = await getPaginatedProjects(currentPage, DEFAULT_PAGINATION_OFFSET);
    const numberOfPages = Math.ceil(pages.total / DEFAULT_PAGINATION_OFFSET);

    if (currentPage > pages.total) {
      currentPage = numberOfPages;
    }

    if (currentTab() !== 'all') {
      const { data, total } = await getPaginatedProjectsByService(
        currentTab(),
        currentPage,
        DEFAULT_PAGINATION_OFFSET,
      );

      return {
        data,
        total,
        currentPage,
      };
    }

    const { data, total } = await getPaginatedProjects(
      currentPage,
      DEFAULT_PAGINATION_OFFSET,
    );

    return {
      data,
      total,
      currentPage,
    };
  });

I will leave the rest of the code in the thread

3 replies

•Created by Daniel Sousa @TutoDS on 9/13/2024 in #support

App errors because nodemailer

No description

16 replies

•Created by Daniel Sousa @TutoDS on 9/10/2024 in #support

`createAsync` crashing my app

Hi everyone. When I add this second createAsync my app crashes:

const contactsAndSocial = createAsync(() => getSocialNetworksAndContacts());

const contactsAndSocial = createAsync(() => getSocialNetworksAndContacts());

__vite_ssr_import_7__.getSocialNetworksAndContacts is not a function

Code:

// getSocialNetworksAndContacts
const getSocialNetworksAndContacts = cache(
  async (): Promise<SocialNetworksAndContacts> => {
    'use server';

    try {
      return client.fetch<SocialNetworksAndContacts>(getSocialNetworksAndContactsQuery);
    } catch {
      return {
        social: [],
        contacts: [],
      };
    }
  },
  'social-networks-and-contacts',
);

// getSocialNetworksAndContactsQuery
const getSocialNetworksAndContactsQuery = `
  *[_type == "settings"] [0] {
    "contacts": coalesce(contacts, []),
    "social": coalesce(social, [])
  }
`;

// getSocialNetworksAndContacts
const getSocialNetworksAndContacts = cache(
  async (): Promise<SocialNetworksAndContacts> => {
    'use server';

    try {
      return client.fetch<SocialNetworksAndContacts>(getSocialNetworksAndContactsQuery);
    } catch {
      return {
        social: [],
        contacts: [],
      };
    }
  },
  'social-networks-and-contacts',
);

// getSocialNetworksAndContactsQuery
const getSocialNetworksAndContactsQuery = `
  *[_type == "settings"] [0] {
    "contacts": coalesce(contacts, []),
    "social": coalesce(social, [])
  }
`;

10 replies

•Created by Daniel Sousa @TutoDS on 8/19/2024 in #support

Cookies banner

Hi everyone Anyone already implemented a Cookies banner on Solid Start to follow the GDPR rules? If yes, what you have used?

6 replies

•Created by Daniel Sousa @TutoDS on 8/18/2024 in #support

SEO

Hi everyone It's possible to generate the robots.txt and sitemap.xml files on Solid Start project?

14 replies

•Created by Daniel Sousa @TutoDS on 8/15/2024 in #support

Deploy

Hi everyone I'm deplyong my first solid start website, but the data seems to be static. I change it on the Sanity CMS, but when I come to the page the data remains the same. Any idea how to solve it?

145 replies

•Created by Daniel Sousa @TutoDS on 8/12/2024 in #support

Solid Form

Hi everyone I'm trying to use solid-form for the first time, but I'm facing this error:

[vite] Error when evaluating SSR module src/routes/contactos.tsx?pick=default&pick=$css: failed to import "solid-forms"
|- /node_modules/.pnpm/[email protected][email protected]/node_modules/solid-forms/dist/public-api/index.module.js:1
import { isAbstractControlContainer } from 'solid-forms/core';

[vite] Error when evaluating SSR module src/routes/contactos.tsx?pick=default&pick=$css: failed to import "solid-forms"
|- /node_modules/.pnpm/[email protected][email protected]/node_modules/solid-forms/dist/public-api/index.module.js:1
import { isAbstractControlContainer } from 'solid-forms/core';

This is my form:

function ContactFormSection() {
  return (
    <form onSubmit={handleSubmit} class={'space-y-4'}>
      <BaseInput
        name={'name'}
        control={group.controls.name}
        id={group.controls.name.id.toString()}
      />

      <BaseInput
        type={'email'}
        name={'name'}
        control={group.controls.email}
        pattern={'^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$'}
        id={group.controls.email.id.toString()}
      />

      <BaseInput
        type={'tel'}
        name={'phone'}
        control={group.controls.phone}
        pattern={'d{9}'}
        id={group.controls.phone.id.toString()}
      />

      <TextArea
        name={'message'}
        control={group.controls.message}
        id={group.controls.message.id.toString()}
      />

      <Checkbox name={'acceptance'} id={group.controls.acceptance.id.toString()}>
 I accept the terms and conditions
      </Checkbox>
    </form>
  );
}

function ContactFormSection() {
  return (
    <form onSubmit={handleSubmit} class={'space-y-4'}>
      <BaseInput
        name={'name'}
        control={group.controls.name}
        id={group.controls.name.id.toString()}
      />

      <BaseInput
        type={'email'}
        name={'name'}
        control={group.controls.email}
        pattern={'^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$'}
        id={group.controls.email.id.toString()}
      />

      <BaseInput
        type={'tel'}
        name={'phone'}
        control={group.controls.phone}
        pattern={'d{9}'}
        id={group.controls.phone.id.toString()}
      />

      <TextArea
        name={'message'}
        control={group.controls.message}
        id={group.controls.message.id.toString()}
      />

      <Checkbox name={'acceptance'} id={group.controls.acceptance.id.toString()}>
 I accept the terms and conditions
      </Checkbox>
    </form>
  );
}

3 replies

•Created by Daniel Sousa @TutoDS on 8/9/2024 in #support

Footer

No description

69 replies

•Created by Daniel Sousa @TutoDS on 8/4/2024 in #support

Dynamic `<head>`

Hi everyone Is possible to put on app.tsx a dynamic <head> tags (Title, Meta, ...)? Basically I have all my content manage on a CMS, and I want to se the base title, the base meta tags fetching from CMS, but if I try to use createResource on app.tsx gives me an error. Any suggestion

6 replies

•Created by Daniel Sousa @TutoDS on 8/4/2024 in #support

How to send emails

Hi everyone. How I can send emails from a contact form? What should I use? Thanks

40 replies

•Created by Daniel Sousa @TutoDS on 8/2/2024 in #support

Embla Carousel

No description

4 replies

•Created by Daniel Sousa @TutoDS on 8/2/2024 in #support

Corvu Dialog

Hi everyone How I can receive the Dialog.Trigger from the @corvu/dialog by props?

<Dialog.Trigger as={'button'} type={'button'}></Dialog.Trigger>

<Dialog.Trigger as={'button'} type={'button'}></Dialog.Trigger>

Basically what I want is customize the button that is rendered on the Dialog.Trigger

8 replies

•Created by Daniel Sousa @TutoDS on 8/1/2024 in #support

AOS alternative

Hi everyone Any package to something like AOS: https://github.com/michalsnik/aos/tree/v2 in SolidJS/Solid Start? I'm not good with animations and AOS is very simple. Can anyone suggest me a package for do this please?

4 replies

•Created by Daniel Sousa @TutoDS on 7/31/2024 in #support

Image optimization & createAsync saying that can be null

No description

2 replies

•Created by Daniel Sousa @TutoDS on 7/23/2024 in #support

Slider packages

Hi everyone Any package like https://keen-slider.io/ or others to create sliders and carousels? Thanks 🙏

54 replies

•Created by Daniel Sousa @TutoDS on 7/23/2024 in #support

Optimize image loading

Hi everyone I'm trying to create an image component to be optimized the loading, etc. I see this repository on a video: https://github.com/w3cj/solid-vs-react/blob/main/solid-image-search/src/components/ImageLoader.tsx But I'm trying to use it and facing an error: IntersectionObserver is not defined I need to do someting on SolidStart?

14 replies

•Created by Daniel Sousa @TutoDS on 7/23/2024 in #support

Hydration Mismatch. Unable to find DOM nodes for hydration key

Hi everyone After create my "card" to list all projects I starting having the error Hydration Mismatch. Unable to find DOM nodes for hydration key, initial I suspect that is because I'm trying to use createPagination primitive, but after comment the code related with the pagination the error persists. I will leave the code on the thread

35 replies