Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

✨ Enhancement: New 404 Page #1082

Open
IyaadDev opened this issue Oct 29, 2024 · 13 comments
Open

✨ Enhancement: New 404 Page #1082

IyaadDev opened this issue Oct 29, 2024 · 13 comments
Assignees
Labels
✨ Enhancement Indicates that the issue suggests an improvement or new feature. Status: Accepted It's clear what the subject of the issue is about, and what the resolution should be. Status: In Progress This issue is being worked on, and has someone assigned.

Comments

@IyaadDev
Copy link
Contributor

Is your feature request related to a problem? Please describe

Not really, it's just that I find it unusual that the website still appears to be using the default 404 page

image

Describe the solution you'd like

I'd like to design a 404 page incorporating the json-schema branding and theming

Describe alternatives you've considered

No response

Additional context

When a user gets a 404 error, is there any place that the error is being logged? If there is an error detection method in place, the code needs to be incorporated into the new 404 page

Are you working on this?

Yes

@IyaadDev IyaadDev added Status: Triage This is the initial status for an issue that requires triage. ✨ Enhancement Indicates that the issue suggests an improvement or new feature. labels Oct 29, 2024
@IyaadDev
Copy link
Contributor Author

Should I add the navbar on the 404 page?
I'll submit a pr with some first looks soon

@DhairyaMajmudar
Copy link
Member

@IyaadDev it would be really great if you propose some UI designs.

@DhairyaMajmudar DhairyaMajmudar added Status: In Progress This issue is being worked on, and has someone assigned. Status: Accepted It's clear what the subject of the issue is about, and what the resolution should be. and removed Status: Triage This is the initial status for an issue that requires triage. labels Oct 30, 2024
@IyaadDev
Copy link
Contributor Author

👍

@IyaadDev
Copy link
Contributor Author

IyaadDev commented Oct 31, 2024

will provide some later this week*

@IyaadDev
Copy link
Contributor Author

Quick question: [slug].page.tsx seems to cover all pages, I've tried changing the code a bit so that 404 errors are displaying the page on 404.tsx, but it doesn't seem to work... any potential solutions?

export async function getStaticPaths() {
  // Adjusted to extract 'paths' directly
  const { paths } = await getStaticMarkdownPaths('pages');

  return {
    paths,
    fallback: false, // Show 404 for unknown paths
  };
}

export async function getStaticProps(args: any) {
  // Adjusted to extract 'props' directly
  const result = await getStaticMarkdownProps(args, 'pages');

  if (
    !result ||
    !result.props ||
    !result.props.frontmatter ||
    !result.props.content
  ) {
    return {
      notFound: true, // Trigger 404 page
    };
  }

  // Return the 'props' object
  return {
    props: result.props,
  };
}

@DhairyaMajmudar
Copy link
Member

@AQIB-NAWAB
Copy link

@DhairyaMajmudar what do you think of this design?
image

@DhairyaMajmudar
Copy link
Member

@AQIB-NAWAB Looks cool 💯

@AQIB-NAWAB
Copy link

Okk nice , I will develope according to this design

@IyaadDev
Copy link
Contributor Author

IyaadDev commented Nov 6, 2024

I'll be away for a while, @AQIB-NAWAB looks like he's doing a good job so far 👍

@IyaadDev
Copy link
Contributor Author

IyaadDev commented Nov 6, 2024

Just a quick proposal for your design: perhaps change the casing on the "back home" button

@IyaadDev
Copy link
Contributor Author

IyaadDev commented Nov 6, 2024

In addition, installing the 404 page may mean modifying the error handling process in _error, personally, I still haven't figured out how to do it yet...

@DhairyaMajmudar
Copy link
Member

I'll be away for a while, @AQIB-NAWAB looks like he's doing a good job so far 👍

Thank you! @AQIB-NAWAB you can go ahead with your PR.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
✨ Enhancement Indicates that the issue suggests an improvement or new feature. Status: Accepted It's clear what the subject of the issue is about, and what the resolution should be. Status: In Progress This issue is being worked on, and has someone assigned.
Projects
None yet
Development

No branches or pull requests

3 participants