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

Unable to See topics over the Topic model #4

Open
ARPIT2128 opened this issue Nov 12, 2024 · 2 comments
Open

Unable to See topics over the Topic model #4

ARPIT2128 opened this issue Nov 12, 2024 · 2 comments

Comments

@ARPIT2128
Copy link

ARPIT2128 commented Nov 12, 2024

Issue: Scrollyteller Not Rendering in Page Component and Encountering Missing Name or Derivation Error

Description

While working with the Scrollyteller component in page.tsx using the template from @nomic-ai/atlas-stories-react, I updated the code to include custom styling and additional parameters for Folio. However, upon running npm run dev to test the implementation, the component does not render as expected, and the console displays a critical error: "Must provide either a name or a derivation."

Steps to Reproduce

  1. Update page.tsx with the following code:
    "use client";
    import { Scrollyteller, Folio } from "@nomic-ai/atlas-stories-react";
    import "@nomic-ai/atlas-stories-react/dist/style.css";
    
    export default function Page() {
      console.log({ Scrollyteller });
    
      return (
        <div
          className="main"
          style={{
            margin: "50px",
            maxWidth: "calc(100vw - 100px)",
          }}
        >
          <h1>Atlas story</h1>
          <Scrollyteller map="sm8523/hate-and-harrasment-model-benchmarking/map/43840940-9cf6-42f6-9b05-3540bc7ea226">
            <Folio hash="rvP0" zoom={{ x: [-50, 50], y: [-50, 50] }}>
              This map is made of people. Each dot is a person, and the people are
              organized by similarity. It's like soylent green but with more
              famousness.
            </Folio>
          </Scrollyteller>
        </div>
      );
    }
  • Log snippet
5960-d38e9cff0473c555.js:1 Uncaught (in promise) Error: Must provide either a name or a derivation
    at o (5960-d38e9cff0473c555.js:1:33938)
    at 4391-af646b31f40318e6.js:1:178692
    at 4391-af646b31f40318e6.js:1:178807
    at Array.forEach (<anonymous>)...
  • Screen Output
    Image
@RLesser
Copy link
Collaborator

RLesser commented Nov 15, 2024

Regarding that error, that is a known issue on the Atlas side. I don't believe it should impact the rendering of the map - for instance if you make a selection, save a shared state of that selection and enter it as the new hash, it should show the selection correctly even if the error appears.

Regarding the topic labels on stories, that is currently being worked on and should be default enabled by next week. Will update this issue once it's available.

Please let me know if there were other aspects of this problem I missed, and make additional issues if other problems are found.

@ARPIT2128
Copy link
Author

Thank you for the detailed response, Robert. That clarification about the error and its impact on map rendering is helpful. I'll test the shared state workaround as suggested.

It's great to hear that the topic labels for stories are being addressed and will be enabled soon. I appreciate you keeping me updated on this.

If I encounter any additional aspects of the issue or uncover new problems, I’ll be sure to follow up with separate reports. Thanks again!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants