Add badge to report issue (#53)

* fix #48

* integrated lang model indicator

* fix #49

src/components/NotebookCard.tsx

@@ -4,11 +4,13 @@ import Link from "./Link.tsx"
 import Avatar from "boring-avatars"
 import { ArrowRight } from "iconoir-react"
 import { DateTime } from "luxon"
+import { OverlayTrigger, Tooltip } from "react-bootstrap"
 
 export interface Notebook {
   slug: string
   href: string
   title: string
+  langModel?: string
   excerpt?: string
   githubUrl?: string
   googleColabUrl?: string
@@ -32,20 +34,33 @@ const NotebookCard: React.FC<{
     accessDateTime,
     "- title:",
     notebook?.title,
+    "notebook.langModel",
+    notebook.langModel
   )
   return (
     <div className={`NotebookCard shadow-sm ${className}`}>
       <div className="px-3 py-2 d-flex align-items-center">
-        <div className="Avatar">
+        <div className="Avatar position-relative">
           <Avatar
             size={40}
             name={notebook.href}
             variant="marble"
             square={false}
           />
+          <div className="LangModelTag">
+            <OverlayTrigger
+              overlay={
+                <Tooltip id="button-tooltip-3">
+                  <span>Model language tag</span>
+                </Tooltip>
+              }
+            >
+              <span className="lang-tag-name">{notebook.langModel}</span>
+            </OverlayTrigger>
+          </div>
         </div>
         <div className="mx-3">
-          <a target="_blank" className="small" href={notebook.googleColabUrl}>
+          <a target="_blank" className="small" href={notebook?.langModel}>
             <img
               src="https://img.shields.io/badge/Open_in_Colab-fafafa?logo=googlecolab"
               alt="Open In Colab"

src/components/NotebookViewer.tsx

@@ -7,6 +7,7 @@ import AuthorCard from "./AuthorCard"
 import Alert from "./Alert"
 import { DateTime } from "luxon"
 import "./NotebookViewer.css"
+import { OverlayTrigger, Tooltip } from "react-bootstrap"
 
 export interface NotebookViewerProps {
   notebook: Notebook
@@ -85,11 +86,27 @@ const NotebookViewer: React.FC<NotebookViewerProps> = ({
       </Row>
       <Row className="my-3">
         <Col lg="7">
-          <section>
-            By{" "}
-            {notebook.authors.map((author) => (
-              <AuthorCard key={author.name} author={author} />
-            ))}
+          <section className="d-flex  justify-content-between">
+            <div>
+              By{" "}
+              {notebook.authors.map((author) => (
+                <AuthorCard key={author.name} author={author} />
+              ))}
+            </div>
+            {notebook.langModel && (
+              <div className="LangModelTag d-flex">
+                <p className="m-0">Language model is in:&nbsp;</p>
+                <OverlayTrigger
+                  overlay={
+                    <Tooltip id="button-tooltip-3">
+                      <span>Language model tag</span>
+                    </Tooltip>
+                  }
+                >
+                  <span className="lang-tag-name">{notebook.langModel}</span>
+                </OverlayTrigger>
+              </div>
+            )}
           </section>
           <section className="d-flex gap-2 align-items-center">
             {notebook.googleColabUrl ? (

src/content/config.ts

@@ -12,6 +12,7 @@ const notebooks = defineCollection({
   schema: z.object({
     title: z.string().optional(),
     url: z.string().url().optional(),
+    langModel: z.string().optional(),
     githubUrl: z.string().url().optional(),
     googleColabUrl: z.string().url().optional(),
     sha: z.string().optional(),
@@ -42,7 +43,7 @@ const plans = defineCollection({
           status: z.string().optional(),
           iconColor: z.string().optional(),
           icon: z.enum(PlanIcons as any).optional(),
-        }),
+        })
       )
       .optional(),
     requirements: z.array(z.enum(Requirements as any)),

src/content/notebooks/impresso-py-collections.mdx

@@ -5,6 +5,7 @@ authors:
 title: Search collections
 sha: 4a05f4772be7279de1908f46c93dc12de334d112
 date: 2024-10-11T07:37:06Z
+langModel: En
 googleColabUrl: https://colab.research.google.com/github/impresso/impresso-py/blob/main/examples/notebooks/collections.ipynb
 links: []
 excerpt: The notebook shows how to find collections associated with your Impresso account and retrieve details about specific collections using their IDs. Then it demonstrates how to search, get, add, and remove items from collections using the Impresso Python Library.

src/content/notebooks/impresso-py-connect.mdx

@@ -12,6 +12,7 @@ seealso:
   - impresso-py-search
   - impresso-py-collections
 sha: bdbbe27d3eee96af6eebbb69d70cd632f4175925
+langModel: En
 googleColabUrl: https://colab.research.google.com/github/impresso/impresso-datalab-notebooks/blob/main/starter/basics_ImpressoAPI.ipynb
 links:
   - href: https://impresso-project.ch/datalab/

src/content/notebooks/impresso-py-maps.mdx

@@ -5,6 +5,7 @@ authors:
   - impresso-team
 sha: caf4e6e0a677569953b866f9c6ffe0c6d3d12dc5
 date: 2024-10-25T13:17:54Z
+langModel: En
 googleColabUrl: https://colab.research.google.com/github/impresso/impresso-datalab-notebooks/blob/main/explore-vis/place-entities_map.ipynb
 links:
   - href: https://impresso-project.ch/

src/content/notebooks/impresso-py-network.mdx

@@ -5,6 +5,7 @@ authors:
   - impresso-team
 sha: dd13ddcc0ba2f4a2b24face9790c46595dc2ebca
 date: 2024-10-27T13:19:55Z
+langModel: En
 googleColabUrl: https://colab.research.google.com/github/impresso/impresso-datalab-notebooks/blob/main/explore-vis/entity_network.ipynb
 links:
   - href: https://en.wikipedia.org/wiki/Prague_Spring
@@ -15,39 +16,52 @@ seealso:
 
 {/* cell:0 cell_type:markdown */}
 
-<a target="_blank" href="https://colab.research.google.com/github/impresso/impresso-datalab-notebooks/4-impresso-py/network_graph.ipynb">
-  <img src="https://colab.research.google.com/assets/colab-badge.svg" alt="Open In Colab"/>
+<a
+  target="_blank"
+  href="https://colab.research.google.com/github/impresso/impresso-datalab-notebooks/4-impresso-py/network_graph.ipynb"
+>
+  <img
+    src="https://colab.research.google.com/assets/colab-badge.svg"
+    alt="Open In Colab"
+  />
 </a>
 
 {/* cell:1 cell_type:markdown */}
+
 ## Install dependencies
 
 {/* cell:2 cell_type:code */}
+
 ```python
 %pip install -q impresso ipysigma networkx tqdm
 ```
 
 {/* cell:3 cell_type:markdown */}
+
 ## Connect to Impresso
 
 {/* cell:4 cell_type:code */}
+
 ```python
 from impresso import connect, OR, AND
 
 impresso_session = connect()
 ```
 
 {/* cell:5 cell_type:markdown */}
+
 ## Part 1: Get entities and their co-occurrences
 
 ### First, we retrieve all person entities mentioned in all articles that talk about the [Prague Spring](https://en.wikipedia.org/wiki/Prague_Spring).
 
 {/* cell:6 cell_type:code */}
+
 ```python
 query = OR("Prague Spring", "Prager Frühling", "Printemps de Prague")
 ```
 
 {/* cell:7 cell_type:code */}
+
 ```python
 persons = impresso_session.search.facet(
   facet="person",
@@ -59,13 +73,15 @@ persons
 ```
 
 {/* cell:8 cell_type:markdown */}
+
 ### Next, we generate all unique pairs of entities with a mention count higher than `n`.
- 
+
 First, entities that meet the mention threshold are selected, and then all possible pairs are generated using the `itertools.combinations` function.
 
 The `n` value can be adjusted so that we don't get too many entity combinations. A sweet spot is just under 500 combinations.
 
 {/* cell:9 cell_type:code */}
+
 ```python
 import itertools
 
@@ -81,6 +97,7 @@ print(f"Total combinations: {len(person_ids_combinations)}")
 ```
 
 {/* cell:10 cell_type:code */}
+
 ```python
 if len(person_ids_combinations) > 500:
   msg = (
@@ -99,6 +116,7 @@ if len(person_ids_combinations) > 500:
 This piece of code gets a facet for every combination of named entities. It is a single call per combination so it may take a while for a large number of combinations.
 
 {/* cell:12 cell_type:code */}
+
 ```python
 from impresso.util.error import ImpressoError
 from time import sleep
@@ -134,6 +152,7 @@ for idx, combo in tqdm(enumerate(person_ids_combinations), total=len(person_ids_
 We put all in a dataframe
 
 {/* cell:14 cell_type:code */}
+
 ```python
 import pandas as pd
 
@@ -153,6 +172,7 @@ connections_df
 And save the connections to a CSV file that can be visualised independently in Part 2. Provide a name for the file.
 
 {/* cell:16 cell_type:code */}
+
 ```python
 from tempfile import gettempdir
 
@@ -165,9 +185,11 @@ print(f"File saved in {connections_csv_filepath}")
 ```
 
 {/* cell:17 cell_type:markdown */}
+
 ## Part 2: visualise
 
 {/* cell:18 cell_type:code */}
+
 ```python
 import pandas as pd
 
@@ -179,6 +201,7 @@ connections_df
 Group connections counting number of mentions and preserve the URL.
 
 {/* cell:20 cell_type:code */}
+
 ```python
 grouped_connections_df = connections_df.groupby(['node_a', 'node_b']) \
     .agg({'timestamp': lambda x: ', '.join(list(x)), 'count': 'sum', 'url': lambda x: list(set(x))[0]}) \
@@ -187,6 +210,7 @@ grouped_connections_df
 ```
 
 {/* cell:21 cell_type:code */}
+
 ```python
 import networkx as nx
 
@@ -206,6 +230,7 @@ G.nodes
 Save the file so that it could be downloaded and used elsewhere.
 
 {/* cell:23 cell_type:code */}
+
 ```python
 from tempfile import gettempdir
 
@@ -223,6 +248,7 @@ print(f"File saved in {gefx_filepath}")
 If running in Colab - activate custom widgets to allow `ipysigma` to render the graph.
 
 {/* cell:25 cell_type:code */}
+
 ```python
 try:
     from google.colab import output
@@ -235,6 +261,7 @@ except:
 Render the graph.
 
 {/* cell:27 cell_type:code */}
+
 ```python
 import ipywidgets
 
@@ -246,7 +273,7 @@ node_size_widget = ipywidgets.Dropdown(
 )
 ipywidgets.Box(
     [
-        ipywidgets.Label(value='What should represent the size of the nodes:'), 
+        ipywidgets.Label(value='What should represent the size of the nodes:'),
         node_size_widget
     ]
 )
@@ -257,6 +284,7 @@ ipywidgets.Box(
 Refresh the next cell after changing the value above.
 
 {/* cell:29 cell_type:code */}
+
 ```python
 import networkx as nx
 from ipysigma import Sigma