Extra slashes in URLs when using remix-flat-routes

[lpsinger]

          This works, however, I am using [Remix flat routes](https://github.com/kiliman/remix-flat-routes), and the generated urls in the sitemap will have extra slashes, e.g. `https://abc.com///xyz`. 

I believe this library is assuming that folders like _test+ is a path, when it is not.

Is there a way to remove these? Maybe use a regex to condense any repeated slashes (/) into a single slash?

Originally posted by @684efs3 in #7 (comment)

[kiliman]

I took a look at remix-seo, and I think I've found the issue. NOTE: This is with the current v2.0 code.

The issue is you should be skipping over any route entries where path is undefined. These are pathless layouts and are not included in the URL.

EDIT: also check for index routes (since they also don't have a path)

        const manifestEntry = routes[id]
        if (!manifestEntry) {
          console.warn(`Could not find a manifest entry for ${id}`)
          return
        }
+        // pathless layouts are not included
+        if (!manifestEntry.path && !manifiestEntry.index) {
+          return
+        }

        let parentId = manifestEntry.parentId
        let parent = parentId ? routes[parentId] : null

        while (parent) {
+          // only add the parent path if it has a path
+          if (parent.path) {
            // the root path is '/', so it messes things up if we add another '/'
            const parentPath = removeTrailingSlash(parent.path)
            path = `${parentPath}/${path}`
+          }
          parentId = parent.parentId
          parent = parentId ? routes[parentId] : null
        }

        if (path.includes(':')) return
        if (id === 'root') return

-        const entry: SitemapEntry = { route: removeTrailingSlash(path) }
+        const entry: SitemapEntry = { route: `/${removeTrailingSlash(path)}` }
        return entry

[kiliman]

Given these routes, here is the sitemap.

❯ tree app/routes        
app/routes
├── _auth+
│   ├── _layout.tsx
│   ├── login.tsx
│   └── profile.tsx
├── _blog+
│   └── hello
│       └── route.tsx
├── _index.tsx
├── _marketing+
│   ├── privacy.tsx
│   └── terms.tsx
├── counter.test.tsx
├── counter.tsx
├── resources+
│   └── healthcheck.tsx
└── sitemap[.xml].ts

<Routes>
  <Route file="root.tsx">
    <Route file="routes/_auth+/_layout.tsx">
      <Route path="login" file="routes/_auth+/login.tsx" />
      <Route path="profile" file="routes/_auth+/profile.tsx" />
    </Route>
    <Route path="hello" file="routes/_blog+/hello/route.tsx" />
    <Route index file="routes/_index.tsx" />
    <Route path="privacy" file="routes/_marketing+/privacy.tsx" />
    <Route path="terms" file="routes/_marketing+/terms.tsx" />
    <Route path="counter" file="routes/counter.tsx" />
    <Route path="resources/healthcheck" file="routes/resources+/healthcheck.tsx" />
    <Route path="sitemap.xml" file="routes/sitemap[.xml].ts" />
  </Route>
</Routes>

sitemap

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
  <url>
    <loc>https://remix.run/login</loc>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://remix.run/profile</loc>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://remix.run/hello</loc>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://remix.run/</loc>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://remix.run/privacy</loc>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://remix.run/terms</loc>
    <priority>0.7</priority>
  </url>
  <url>
    <loc>https://remix.run/counter</loc>
    <priority>0.7</priority>
  </url>
</urlset>

[lpsinger]

OK, now we have two possible patches, #10 and #11.

[tb-b]

Any update on this?

Temporary fix:

export async function loader({ request, context }: LoaderFunctionArgs) {
	const sitemapResponse = await generateSitemap(request, routes, {
		siteUrl: "https://yoursite.com",
	});

	// Get the sitemap content as text
	const sitemapString = await sitemapResponse.text();

	// Use a regular expression to replace double slashes with single slashes
	// but not replace the double slash in https://
	const fixedSitemap = sitemapString.replace(/([^:])\/\//g, "$1/");

	// Return the fixed sitemap with the correct content type
	return new Response(fixedSitemap, {
		headers: {
			"Content-Type": "application/xml",
			"xml-version": "1.0",
			encoding: "UTF-8",
		},
	});
}

[lpsinger]

No updates. Please open a PR if you have a fix.

[JustFly1984]

I've made a PR to fix double slash.