synapse-react-client 4.0.19 → 4.0.21

package/dist/components/SynapseHomepageV2/SynapseByTheNumbers.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseByTheNumbers.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseByTheNumbers.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport { Box } from '@mui/material'\nimport { SynapseByTheNumbersItem } from './SynapseByTheNumbersItem'\n\nexport type SynapseByTheNumbersProps = {\n  metricsTable: string\n}\nconst formatter = Intl.NumberFormat('en')\n\nexport function SynapseByTheNumbers({\n  metricsTable,\n}: SynapseByTheNumbersProps) {\n  const { data } = useGetQueryResultBundleWithAsyncStatus({\n    entityId: metricsTable,\n    query: {\n      sql: `SELECT * FROM ${metricsTable}`,\n      limit: 12, // past year\n      sort: [{ column: 'export_date', direction: 'DESC' }],\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n\n  const rowSet = data?.responseBody?.queryResult?.queryResults\n  const headers = rowSet?.headers\n  const exportDateColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'export_date',\n  )!\n  const totalSizeInPetaBytesColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'total_data_size_in_pib',\n  )!\n  const activeUsersLastMonthColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'active_users_last_month',\n  )!\n  const totalDownloadsLastMonthColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'total_downloads_last_month',\n  )!\n\n  if (!rowSet || rowSet.rows.length == 0) {\n    return <></>\n  }\n  const values = rowSet.rows[0].values\n\n  const totalSizeRawValue = values[totalSizeInPetaBytesColIndex]\n  const totalSize =\n    totalSizeRawValue != null ? Number(totalSizeRawValue).toFixed(2) : '-'\n  const totalDownloadsRawValue = values[totalDownloadsLastMonthColIndex]\n  const totalDownloadsPerMonth =\n    totalDownloadsRawValue != null\n      ? formatter.format(parseInt(totalDownloadsRawValue))\n      : '-'\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        flexWrap: 'wrap',\n        justifyContent: 'space-evenly',\n        gap: '30px',\n      }}\n    >\n      <SynapseByTheNumbersItem\n        title={`${totalSize} Petabytes`}\n        description={'Total data'}\n        rows={rowSet.rows}\n        plotXColIndex={exportDateColIndex}\n        plotYColIndex={totalSizeInPetaBytesColIndex}\n      />\n      <SynapseByTheNumbersItem\n        title={values[activeUsersLastMonthColIndex] ?? '-'}\n        description={'Registered active users per month'}\n        rows={rowSet.rows}\n        plotXColIndex={exportDateColIndex}\n        plotYColIndex={activeUsersLastMonthColIndex}\n      />\n      <SynapseByTheNumbersItem\n        title={totalDownloadsPerMonth}\n        description={'Total downloads per month'}\n        rows={rowSet.rows}\n        plotXColIndex={exportDateColIndex}\n        plotYColIndex={totalDownloadsLastMonthColIndex}\n      />\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAQA,IAAM,IAAY,KAAK,aAAa,KAAK;AAEzC,SAAgB,EAAoB,EAClC,mBAC2B;CAC3B,IAAM,EAAE,YAAS,EAAuC;EACtD,UAAU;EACV,OAAO;GACL,KAAK,iBAAiB;GACtB,OAAO;GACP,MAAM,CAAC;IAAE,QAAQ;IAAe,WAAW;IAAQ,CAAC;GACrD;EACD,UAAA;EACA,cAAc;EACf,CAAC,EAEI,IAAS,GAAM,cAAc,aAAa,cAC1C,IAAU,GAAQ,SAClB,IAAqB,GAAS,WAClC,MAAgB,EAAa,QAAQ,cACtC,EACK,IAA+B,GAAS,WAC5C,MAAgB,EAAa,QAAQ,yBACtC,EACK,IAA+B,GAAS,WAC5C,MAAgB,EAAa,QAAQ,0BACtC,EACK,IAAkC,GAAS,WAC/C,MAAgB,EAAa,QAAQ,6BACtC;AAED,KAAI,CAAC,KAAU,EAAO,KAAK,UAAU,EACnC,QAAO,kBAAA,GAAA,EAAK,CAAA;CAEd,IAAM,IAAS,EAAO,KAAK,GAAG,QAExB,IAAoB,EAAO,IAC3B,IACJ,KAAqB,OAA8C,MAAvC,OAAO,EAAkB,CAAC,QAAQ,EAAE,EAC5D,IAAyB,EAAO,IAChC,IACJ,KAA0B,OAEtB,MADA,EAAU,OAAO,SAAS,EAAuB,CAAC;AAExD,QACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,UAAU;GACV,gBAAgB;GAChB,KAAK;GACN;YANH;GAQE,kBAAC,GAAD;IACE,OAAO,GAAG,EAAU;IACpB,aAAa;IACb,MAAM,EAAO;IACb,eAAe;IACf,eAAe;IACf,CAAA;GACF,kBAAC,GAAD;IACE,OAAO,EAAO,MAAiC;IAC/C,aAAa;IACb,MAAM,EAAO;IACb,eAAe;IACf,eAAe;IACf,CAAA;GACF,kBAAC,GAAD;IACE,OAAO;IACP,aAAa;IACb,MAAM,EAAO;IACb,eAAe;IACf,eAAe;IACf,CAAA;GACE"}
+{"version":3,"file":"SynapseByTheNumbers.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseByTheNumbers.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport { Box } from '@mui/material'\nimport { SynapseByTheNumbersItem } from './SynapseByTheNumbersItem'\n\nexport type SynapseByTheNumbersProps = {\n  metricsTable: string\n}\nconst formatter = Intl.NumberFormat('en')\n\nexport function SynapseByTheNumbers({\n  metricsTable,\n}: SynapseByTheNumbersProps) {\n  const { data } = useGetQueryResultBundleWithAsyncStatus({\n    entityId: metricsTable,\n    query: {\n      sql: `SELECT * FROM ${metricsTable}`,\n      limit: 12, // past year\n      sort: [{ column: 'export_date', direction: 'DESC' }],\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n\n  const rowSet = data?.responseBody?.queryResult?.queryResults\n  const headers = rowSet?.headers\n  const exportDateColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'export_date',\n  )!\n  const totalSizeInPetaBytesColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'total_data_size_in_pib',\n  )!\n  const activeUsersLastMonthColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'active_users_last_month',\n  )!\n  const totalDownloadsLastMonthColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'total_downloads_last_month',\n  )!\n\n  if (!rowSet || rowSet.rows.length == 0) {\n    return <></>\n  }\n  const values = rowSet.rows[0].values\n\n  const totalSizeRawValue = values[totalSizeInPetaBytesColIndex]\n  const totalSize =\n    totalSizeRawValue != null ? Number(totalSizeRawValue).toFixed(2) : '-'\n  const totalDownloadsRawValue = values[totalDownloadsLastMonthColIndex]\n  const totalDownloadsPerMonth =\n    totalDownloadsRawValue != null\n      ? formatter.format(parseInt(totalDownloadsRawValue))\n      : '-'\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        flexWrap: 'wrap',\n        justifyContent: 'space-evenly',\n        gap: '30px',\n      }}\n    >\n      <SynapseByTheNumbersItem\n        title={`${totalSize} Petabytes`}\n        description={'Total data'}\n        rows={rowSet.rows}\n        plotXColIndex={exportDateColIndex}\n        plotYColIndex={totalSizeInPetaBytesColIndex}\n      />\n      <SynapseByTheNumbersItem\n        title={values[activeUsersLastMonthColIndex] ?? '-'}\n        description={'Registered active users per month'}\n        rows={rowSet.rows}\n        plotXColIndex={exportDateColIndex}\n        plotYColIndex={activeUsersLastMonthColIndex}\n      />\n      <SynapseByTheNumbersItem\n        title={totalDownloadsPerMonth}\n        description={'Total downloads per month'}\n        rows={rowSet.rows}\n        plotXColIndex={exportDateColIndex}\n        plotYColIndex={totalDownloadsLastMonthColIndex}\n      />\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAQA,IAAM,IAAY,KAAK,aAAa,IAAI;AAExC,SAAgB,EAAoB,EAClC,mBAC2B;CAC3B,IAAM,EAAE,YAAS,EAAuC;EACtD,UAAU;EACV,OAAO;GACL,KAAK,iBAAiB;GACtB,OAAO;GACP,MAAM,CAAC;IAAE,QAAQ;IAAe,WAAW;GAAO,CAAC;EACrD;EACA,UAAA;EACA,cAAc;CAChB,CAAC,GAEK,IAAS,GAAM,cAAc,aAAa,cAC1C,IAAU,GAAQ,SAClB,IAAqB,GAAS,WAClC,MAAgB,EAAa,QAAQ,aACvC,GACM,IAA+B,GAAS,WAC5C,MAAgB,EAAa,QAAQ,wBACvC,GACM,IAA+B,GAAS,WAC5C,MAAgB,EAAa,QAAQ,yBACvC,GACM,IAAkC,GAAS,WAC/C,MAAgB,EAAa,QAAQ,4BACvC;CAEA,IAAI,CAAC,KAAU,EAAO,KAAK,UAAU,GACnC,OAAO,kBAAA,GAAA,CAAI,CAAA;CAEb,IAAM,IAAS,EAAO,KAAK,GAAG,QAExB,IAAoB,EAAO,IAC3B,IACJ,KAAqB,OAA8C,MAAvC,OAAO,CAAiB,EAAE,QAAQ,CAAC,GAC3D,IAAyB,EAAO,IAChC,IACJ,KAA0B,OAEtB,MADA,EAAU,OAAO,SAAS,CAAsB,CAAC;CAEvD,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,UAAU;GACV,gBAAgB;GAChB,KAAK;EACP;YANF;GAQE,kBAAC,GAAD;IACE,OAAO,GAAG,EAAU;IACpB,aAAa;IACb,MAAM,EAAO;IACb,eAAe;IACf,eAAe;GAChB,CAAA;GACD,kBAAC,GAAD;IACE,OAAO,EAAO,MAAiC;IAC/C,aAAa;IACb,MAAM,EAAO;IACb,eAAe;IACf,eAAe;GAChB,CAAA;GACD,kBAAC,GAAD;IACE,OAAO;IACP,aAAa;IACb,MAAM,EAAO;IACb,eAAe;IACf,eAAe;GAChB,CAAA;EACE;;AAET"}

package/dist/components/SynapseHomepageV2/SynapseByTheNumbersItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseByTheNumbersItem.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseByTheNumbersItem.tsx"],"sourcesContent":["import { Box, Typography } from '@mui/material'\nimport { Row } from '@sage-bionetworks/synapse-types'\nimport Plotly, { Datum } from 'plotly.js-basic-dist'\nimport Plot from '../Plot/Plot'\n\nexport type SynapseByTheNumbersItemProps = {\n  title: string\n  description: string\n  rows: Row[]\n  plotXColIndex: number\n  plotYColIndex: number\n}\n\nexport function SynapseByTheNumbersItem({\n  title,\n  description,\n  rows,\n  plotXColIndex,\n  plotYColIndex,\n}: SynapseByTheNumbersItemProps) {\n  if (rows.length == 0) {\n    return <></>\n  }\n  const xArray: Datum[] = []\n  const yArray: Datum[] = []\n  for (const row of rows) {\n    for (let j = 1; j < row.values.length; j += 1) {\n      // create pairs of data\n      const rowValues = row.values\n      xArray.push(rowValues[plotXColIndex])\n      yArray.push(rowValues[plotYColIndex])\n    }\n  }\n  //convert table data into numbers\n  const yArrayNumbers = yArray.map(v => parseFloat(v!.toString()))\n\n  const plotData: Partial<Plotly.PlotData>[] = [\n    {\n      type: 'scatter',\n      mode: 'lines',\n      fill: 'tozeroy',\n      fillcolor: '#336663',\n      line: {\n        color: '#6ba89d',\n        shape: 'spline', //smooth line, will need to do a more complex cubic spline interpolation (introducing new values between the data points) if we want to really smooth this out\n        smoothing: 1.3,\n      },\n      x: xArray,\n      y: yArrayNumbers,\n      hoverinfo: 'skip', //hide hover over tool tips\n    },\n  ]\n\n  // calculate the y axis range to show off the trend\n  const maxY = Math.max(...yArrayNumbers)\n  const minY = Math.min(...yArrayNumbers)\n  // we're showing a trend, so set the y-axis range minimum to 5% below the minimum point\n  const rangeMinYValue = minY - minY * 0.05\n  const layout: Partial<Plotly.Layout> = {\n    showlegend: false,\n    xaxis: {\n      visible: false, // Hide x-axis\n      showgrid: false, // Hide x-axis grid\n    },\n    yaxis: {\n      visible: false, // Hide y-axis\n      showgrid: false, // Hide y-axis grid\n      range: [rangeMinYValue, maxY], // Set the range from half of minY to maxY\n    },\n    paper_bgcolor: 'rgba(0,0,0,0)', // Transparent background\n    plot_bgcolor: 'rgba(0,0,0,0)', // Transparent plot area\n    width: 170,\n    height: 100,\n    margin: {\n      l: 0,\n      r: 0,\n      t: 0,\n      b: 0,\n      pad: 0,\n    },\n  }\n  const config: Partial<Plotly.Config> = {\n    displayModeBar: false, // Hide Plotly controls\n    staticPlot: true, //disable all interactivity\n  }\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        gap: '15px',\n      }}\n    >\n      <Box>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            fontWeight: 600,\n            fontSize: '32px',\n            lineHeight: '40px',\n            color: 'white',\n          }}\n        >\n          {title}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            fontWeight: 300,\n            fontSize: '16px',\n            lineHeight: '24px',\n            color: 'grey.600',\n            maxWidth: '150px',\n          }}\n        >\n          {description}\n        </Typography>\n      </Box>\n      <Box\n        sx={{\n          //add a linear gradient (fades out near the bottom)\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%)',\n        }}\n      >\n        <Plot layout={layout} data={plotData} config={config} />\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;AAaA,SAAgB,EAAwB,EACtC,UACA,gBACA,SACA,kBACA,oBAC+B;AAC/B,KAAI,EAAK,UAAU,EACjB,QAAO,kBAAA,GAAA,EAAK,CAAA;CAEd,IAAM,IAAkB,EAAE,EACpB,IAAkB,EAAE;AAC1B,MAAK,IAAM,KAAO,EAChB,MAAK,IAAI,IAAI,GAAG,IAAI,EAAI,OAAO,QAAQ,KAAK,GAAG;EAE7C,IAAM,IAAY,EAAI;AAEtB,EADA,EAAO,KAAK,EAAU,GAAe,EACrC,EAAO,KAAK,EAAU,GAAe;;CAIzC,IAAM,IAAgB,EAAO,KAAI,MAAK,WAAW,EAAG,UAAU,CAAC,CAAC,EAE1D,IAAuC,CAC3C;EACE,MAAM;EACN,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;GACJ,OAAO;GACP,OAAO;GACP,WAAW;GACZ;EACD,GAAG;EACH,GAAG;EACH,WAAW;EACZ,CACF,EAGK,IAAO,KAAK,IAAI,GAAG,EAAc,EACjC,IAAO,KAAK,IAAI,GAAG,EAAc,EAGjC,IAAiC;EACrC,YAAY;EACZ,OAAO;GACL,SAAS;GACT,UAAU;GACX;EACD,OAAO;GACL,SAAS;GACT,UAAU;GACV,OAAO,CAVY,IAAO,IAAO,KAUT,EAAK;GAC9B;EACD,eAAe;EACf,cAAc;EACd,OAAO;EACP,QAAQ;EACR,QAAQ;GACN,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,KAAK;GACN;EACF;AAKD,QACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,KAAK;GACN;YALH,CAOE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IACF,YAAY;IACZ,UAAU;IACV,YAAY;IACZ,OAAO;IACR;aAEA;GACU,CAAA,EACb,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IACF,YAAY;IACZ,UAAU;IACV,YAAY;IACZ,OAAO;IACP,UAAU;IACX;aAEA;GACU,CAAA,CACT,EAAA,CAAA,EACN,kBAAC,GAAD;GACE,IAAI,EAEF,WACE,0EACH;aAED,kBAAC,GAAD;IAAc;IAAQ,MAAM;IAAkB,QAAA;KA3ClD,gBAAgB;KAChB,YAAY;KA0CsC;IAAU,CAAA;GACpD,CAAA,CACF"}
+{"version":3,"file":"SynapseByTheNumbersItem.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseByTheNumbersItem.tsx"],"sourcesContent":["import { Box, Typography } from '@mui/material'\nimport { Row } from '@sage-bionetworks/synapse-types'\nimport Plotly, { Datum } from 'plotly.js-basic-dist'\nimport Plot from '../Plot/Plot'\n\nexport type SynapseByTheNumbersItemProps = {\n  title: string\n  description: string\n  rows: Row[]\n  plotXColIndex: number\n  plotYColIndex: number\n}\n\nexport function SynapseByTheNumbersItem({\n  title,\n  description,\n  rows,\n  plotXColIndex,\n  plotYColIndex,\n}: SynapseByTheNumbersItemProps) {\n  if (rows.length == 0) {\n    return <></>\n  }\n  const xArray: Datum[] = []\n  const yArray: Datum[] = []\n  for (const row of rows) {\n    for (let j = 1; j < row.values.length; j += 1) {\n      // create pairs of data\n      const rowValues = row.values\n      xArray.push(rowValues[plotXColIndex])\n      yArray.push(rowValues[plotYColIndex])\n    }\n  }\n  //convert table data into numbers\n  const yArrayNumbers = yArray.map(v => parseFloat(v!.toString()))\n\n  const plotData: Partial<Plotly.PlotData>[] = [\n    {\n      type: 'scatter',\n      mode: 'lines',\n      fill: 'tozeroy',\n      fillcolor: '#336663',\n      line: {\n        color: '#6ba89d',\n        shape: 'spline', //smooth line, will need to do a more complex cubic spline interpolation (introducing new values between the data points) if we want to really smooth this out\n        smoothing: 1.3,\n      },\n      x: xArray,\n      y: yArrayNumbers,\n      hoverinfo: 'skip', //hide hover over tool tips\n    },\n  ]\n\n  // calculate the y axis range to show off the trend\n  const maxY = Math.max(...yArrayNumbers)\n  const minY = Math.min(...yArrayNumbers)\n  // we're showing a trend, so set the y-axis range minimum to 5% below the minimum point\n  const rangeMinYValue = minY - minY * 0.05\n  const layout: Partial<Plotly.Layout> = {\n    showlegend: false,\n    xaxis: {\n      visible: false, // Hide x-axis\n      showgrid: false, // Hide x-axis grid\n    },\n    yaxis: {\n      visible: false, // Hide y-axis\n      showgrid: false, // Hide y-axis grid\n      range: [rangeMinYValue, maxY], // Set the range from half of minY to maxY\n    },\n    paper_bgcolor: 'rgba(0,0,0,0)', // Transparent background\n    plot_bgcolor: 'rgba(0,0,0,0)', // Transparent plot area\n    width: 170,\n    height: 100,\n    margin: {\n      l: 0,\n      r: 0,\n      t: 0,\n      b: 0,\n      pad: 0,\n    },\n  }\n  const config: Partial<Plotly.Config> = {\n    displayModeBar: false, // Hide Plotly controls\n    staticPlot: true, //disable all interactivity\n  }\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        gap: '15px',\n      }}\n    >\n      <Box>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            fontWeight: 600,\n            fontSize: '32px',\n            lineHeight: '40px',\n            color: 'white',\n          }}\n        >\n          {title}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            fontWeight: 300,\n            fontSize: '16px',\n            lineHeight: '24px',\n            color: 'grey.600',\n            maxWidth: '150px',\n          }}\n        >\n          {description}\n        </Typography>\n      </Box>\n      <Box\n        sx={{\n          //add a linear gradient (fades out near the bottom)\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%)',\n        }}\n      >\n        <Plot layout={layout} data={plotData} config={config} />\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;AAaA,SAAgB,EAAwB,EACtC,UACA,gBACA,SACA,kBACA,oBAC+B;CAC/B,IAAI,EAAK,UAAU,GACjB,OAAO,kBAAA,GAAA,CAAI,CAAA;CAEb,IAAM,IAAkB,CAAC,GACnB,IAAkB,CAAC;CACzB,KAAK,IAAM,KAAO,GAChB,KAAK,IAAI,IAAI,GAAG,IAAI,EAAI,OAAO,QAAQ,KAAK,GAAG;EAE7C,IAAM,IAAY,EAAI;EAEtB,AADA,EAAO,KAAK,EAAU,EAAc,GACpC,EAAO,KAAK,EAAU,EAAc;CACtC;CAGF,IAAM,IAAgB,EAAO,KAAI,MAAK,WAAW,EAAG,SAAS,CAAC,CAAC,GAEzD,IAAuC,CAC3C;EACE,MAAM;EACN,MAAM;EACN,MAAM;EACN,WAAW;EACX,MAAM;GACJ,OAAO;GACP,OAAO;GACP,WAAW;EACb;EACA,GAAG;EACH,GAAG;EACH,WAAW;CACb,CACF,GAGM,IAAO,KAAK,IAAI,GAAG,CAAa,GAChC,IAAO,KAAK,IAAI,GAAG,CAAa,GAGhC,IAAiC;EACrC,YAAY;EACZ,OAAO;GACL,SAAS;GACT,UAAU;EACZ;EACA,OAAO;GACL,SAAS;GACT,UAAU;GACV,OAAO,CAVY,IAAO,IAAO,KAUT,CAAI;EAC9B;EACA,eAAe;EACf,cAAc;EACd,OAAO;EACP,QAAQ;EACR,QAAQ;GACN,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,KAAK;EACP;CACF;CAKA,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,KAAK;EACP;YALF,CAOE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IACF,YAAY;IACZ,UAAU;IACV,YAAY;IACZ,OAAO;GACT;aAEC;EACS,CAAA,GACZ,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IACF,YAAY;IACZ,UAAU;IACV,YAAY;IACZ,OAAO;IACP,UAAU;GACZ;aAEC;EACS,CAAA,CACT,EAAA,CAAA,GACL,kBAAC,GAAD;GACE,IAAI,EAEF,WACE,yEACJ;aAEA,kBAAC,GAAD;IAAc;IAAQ,MAAM;IAAkB,QAAA;KA3ClD,gBAAgB;KAChB,YAAY;IA0CsC;GAAS,CAAA;EACpD,CAAA,CACF;;AAET"}

package/dist/components/SynapseHomepageV2/SynapseFeatureItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseFeatureItem.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeatureItem.tsx"],"sourcesContent":["import { useMediaQuery, useTheme } from '@mui/material'\nimport { Box, Button, Typography } from '@mui/material'\nimport { ReactElement } from 'react'\n\nexport type SynapseFeatureItemProps = {\n  title: string\n  subtitle: string\n  description: string\n  featureName: string\n  link: string\n  icons?: ReactElement[]\n  image: ReactElement\n}\n\nexport function SynapseFeatureItem({\n  title,\n  subtitle,\n  description,\n  featureName,\n  link,\n  icons,\n  image,\n}: SynapseFeatureItemProps) {\n  const theme = useTheme()\n  const isSmallView = useMediaQuery(theme.breakpoints.down('md'))\n  return isSmallView ? (\n    <Box\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        rowGap: '20px',\n        p: '50px 15px',\n      }}\n    >\n      <Typography\n        variant=\"headline3\"\n        sx={{\n          color: 'primary.100',\n          fontSize: '36px',\n          lineHeight: '36px',\n          fontWeight: 400,\n          textAlign: 'center',\n        }}\n      >\n        {title}\n      </Typography>\n      <Typography\n        variant=\"headline3\"\n        sx={{\n          color: 'primary.100',\n          fontSize: '24px',\n          fontWeight: 700,\n          lineHeight: '28px',\n          textAlign: 'center',\n        }}\n      >\n        {subtitle}\n      </Typography>\n      <Box\n        sx={{\n          display: 'flex',\n          justifyContent: 'center',\n          alignItems: 'center',\n          columnGap: '20px',\n        }}\n      >\n        {icons && icons.map((icon, index) => <Box key={index}>{icon}</Box>)}\n      </Box>\n      <Box sx={{ svg: { width: '100%', height: 'auto' } }}>{image}</Box>\n      <Typography\n        variant=\"body1\"\n        sx={{\n          color: 'primary.100',\n          fontSize: '16px',\n          mb: '25px',\n        }}\n      >\n        {description}\n      </Typography>\n      <Button\n        variant=\"contained\"\n        color=\"lightPrimary\"\n        href={link}\n        target=\"_blank\"\n        fullWidth\n      >\n        About {featureName}\n      </Button>\n    </Box>\n  ) : (\n    <Box\n      sx={{\n        display: 'grid',\n        gridTemplateColumns: '450px auto',\n        columnGap: {\n          xs: '40px',\n          lg: '120px',\n        },\n        pb: '120px',\n      }}\n    >\n      <Box sx={{ mb: '50px', width: '437px' }}>\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            color: 'primary.100',\n            fontSize: '36px',\n            lineHeight: '24px',\n            mb: '30px',\n            fontWeight: 400,\n          }}\n        >\n          {title}\n        </Typography>\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            color: 'primary.100',\n            fontSize: '24px',\n            lineHeight: '32px',\n            mb: '20px',\n            fontWeight: 700,\n          }}\n        >\n          {subtitle}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            color: 'primary.100',\n            mb: '30px',\n          }}\n        >\n          {description}\n        </Typography>\n        <Box\n          sx={{\n            display: 'flex',\n            gap: '10px',\n            alignItems: 'center',\n            mb: '25px',\n          }}\n        >\n          {icons && icons.map((icon, index) => <Box key={index}>{icon}</Box>)}\n        </Box>\n        <Button\n          variant=\"contained\"\n          size=\"large\"\n          color=\"lightPrimary\"\n          href={link}\n          target=\"_blank\"\n        >\n          About {featureName}\n        </Button>\n      </Box>\n      <Box sx={{ mr: '25px', svg: { width: '100%' } }}>{image}</Box>\n    </Box>\n  )\n}\n"],"mappings":";;;AAcA,SAAgB,EAAmB,EACjC,UACA,aACA,gBACA,gBACA,SACA,UACA,YAC0B;AAG1B,QADoB,EADN,GACoB,CAAM,YAAY,KAAK,KAAK,CACvD,GACL,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,eAAe;GACf,QAAQ;GACR,GAAG;GACJ;YANH;GAQE,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,OAAO;KACP,UAAU;KACV,YAAY;KACZ,YAAY;KACZ,WAAW;KACZ;cAEA;IACU,CAAA;GACb,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,OAAO;KACP,UAAU;KACV,YAAY;KACZ,YAAY;KACZ,WAAW;KACZ;cAEA;IACU,CAAA;GACb,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,gBAAgB;KAChB,YAAY;KACZ,WAAW;KACZ;cAEA,KAAS,EAAM,KAAK,GAAM,MAAU,kBAAC,GAAD,EAAA,UAAkB,GAAW,EAAnB,EAAmB,CAAC;IAC/D,CAAA;GACN,kBAAC,GAAD;IAAK,IAAI,EAAE,KAAK;KAAE,OAAO;KAAQ,QAAQ;KAAQ,EAAE;cAAG;IAAY,CAAA;GAClE,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,OAAO;KACP,UAAU;KACV,IAAI;KACL;cAEA;IACU,CAAA;GACb,kBAAC,GAAD;IACE,SAAQ;IACR,OAAM;IACN,MAAM;IACN,QAAO;IACP,WAAA;cALF,CAMC,UACQ,EACA;;GACL;MAEN,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,qBAAqB;GACrB,WAAW;IACT,IAAI;IACJ,IAAI;IACL;GACD,IAAI;GACL;YATH,CAWE,kBAAC,GAAD;GAAK,IAAI;IAAE,IAAI;IAAQ,OAAO;IAAS;aAAvC;IACE,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;MACZ,IAAI;MACJ,YAAY;MACb;eAEA;KACU,CAAA;IACb,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;MACZ,IAAI;MACJ,YAAY;MACb;eAEA;KACU,CAAA;IACb,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,OAAO;MACP,IAAI;MACL;eAEA;KACU,CAAA;IACb,kBAAC,GAAD;KACE,IAAI;MACF,SAAS;MACT,KAAK;MACL,YAAY;MACZ,IAAI;MACL;eAEA,KAAS,EAAM,KAAK,GAAM,MAAU,kBAAC,GAAD,EAAA,UAAkB,GAAW,EAAnB,EAAmB,CAAC;KAC/D,CAAA;IACN,kBAAC,GAAD;KACE,SAAQ;KACR,MAAK;KACL,OAAM;KACN,MAAM;KACN,QAAO;eALT,CAMC,UACQ,EACA;;IACL;MACN,kBAAC,GAAD;GAAK,IAAI;IAAE,IAAI;IAAQ,KAAK,EAAE,OAAO,QAAQ;IAAE;aAAG;GAAY,CAAA,CAC1D"}
+{"version":3,"file":"SynapseFeatureItem.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeatureItem.tsx"],"sourcesContent":["import { useMediaQuery, useTheme } from '@mui/material'\nimport { Box, Button, Typography } from '@mui/material'\nimport { ReactElement } from 'react'\n\nexport type SynapseFeatureItemProps = {\n  title: string\n  subtitle: string\n  description: string\n  featureName: string\n  link: string\n  icons?: ReactElement[]\n  image: ReactElement\n}\n\nexport function SynapseFeatureItem({\n  title,\n  subtitle,\n  description,\n  featureName,\n  link,\n  icons,\n  image,\n}: SynapseFeatureItemProps) {\n  const theme = useTheme()\n  const isSmallView = useMediaQuery(theme.breakpoints.down('md'))\n  return isSmallView ? (\n    <Box\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        rowGap: '20px',\n        p: '50px 15px',\n      }}\n    >\n      <Typography\n        variant=\"headline3\"\n        sx={{\n          color: 'primary.100',\n          fontSize: '36px',\n          lineHeight: '36px',\n          fontWeight: 400,\n          textAlign: 'center',\n        }}\n      >\n        {title}\n      </Typography>\n      <Typography\n        variant=\"headline3\"\n        sx={{\n          color: 'primary.100',\n          fontSize: '24px',\n          fontWeight: 700,\n          lineHeight: '28px',\n          textAlign: 'center',\n        }}\n      >\n        {subtitle}\n      </Typography>\n      <Box\n        sx={{\n          display: 'flex',\n          justifyContent: 'center',\n          alignItems: 'center',\n          columnGap: '20px',\n        }}\n      >\n        {icons && icons.map((icon, index) => <Box key={index}>{icon}</Box>)}\n      </Box>\n      <Box sx={{ svg: { width: '100%', height: 'auto' } }}>{image}</Box>\n      <Typography\n        variant=\"body1\"\n        sx={{\n          color: 'primary.100',\n          fontSize: '16px',\n          mb: '25px',\n        }}\n      >\n        {description}\n      </Typography>\n      <Button\n        variant=\"contained\"\n        color=\"lightPrimary\"\n        href={link}\n        target=\"_blank\"\n        fullWidth\n      >\n        About {featureName}\n      </Button>\n    </Box>\n  ) : (\n    <Box\n      sx={{\n        display: 'grid',\n        gridTemplateColumns: '450px auto',\n        columnGap: {\n          xs: '40px',\n          lg: '120px',\n        },\n        pb: '120px',\n      }}\n    >\n      <Box sx={{ mb: '50px', width: '437px' }}>\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            color: 'primary.100',\n            fontSize: '36px',\n            lineHeight: '24px',\n            mb: '30px',\n            fontWeight: 400,\n          }}\n        >\n          {title}\n        </Typography>\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            color: 'primary.100',\n            fontSize: '24px',\n            lineHeight: '32px',\n            mb: '20px',\n            fontWeight: 700,\n          }}\n        >\n          {subtitle}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            color: 'primary.100',\n            mb: '30px',\n          }}\n        >\n          {description}\n        </Typography>\n        <Box\n          sx={{\n            display: 'flex',\n            gap: '10px',\n            alignItems: 'center',\n            mb: '25px',\n          }}\n        >\n          {icons && icons.map((icon, index) => <Box key={index}>{icon}</Box>)}\n        </Box>\n        <Button\n          variant=\"contained\"\n          size=\"large\"\n          color=\"lightPrimary\"\n          href={link}\n          target=\"_blank\"\n        >\n          About {featureName}\n        </Button>\n      </Box>\n      <Box sx={{ mr: '25px', svg: { width: '100%' } }}>{image}</Box>\n    </Box>\n  )\n}\n"],"mappings":";;;AAcA,SAAgB,EAAmB,EACjC,UACA,aACA,gBACA,gBACA,SACA,UACA,YAC0B;CAG1B,OADoB,EADN,EACoB,EAAM,YAAY,KAAK,IAAI,CACtD,IACL,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,eAAe;GACf,QAAQ;GACR,GAAG;EACL;YANF;GAQE,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,OAAO;KACP,UAAU;KACV,YAAY;KACZ,YAAY;KACZ,WAAW;IACb;cAEC;GACS,CAAA;GACZ,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,OAAO;KACP,UAAU;KACV,YAAY;KACZ,YAAY;KACZ,WAAW;IACb;cAEC;GACS,CAAA;GACZ,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,gBAAgB;KAChB,YAAY;KACZ,WAAW;IACb;cAEC,KAAS,EAAM,KAAK,GAAM,MAAU,kBAAC,GAAD,EAAA,UAAkB,EAAU,GAAlB,CAAkB,CAAC;GAC/D,CAAA;GACL,kBAAC,GAAD;IAAK,IAAI,EAAE,KAAK;KAAE,OAAO;KAAQ,QAAQ;IAAO,EAAE;cAAI;GAAW,CAAA;GACjE,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,OAAO;KACP,UAAU;KACV,IAAI;IACN;cAEC;GACS,CAAA;GACZ,kBAAC,GAAD;IACE,SAAQ;IACR,OAAM;IACN,MAAM;IACN,QAAO;IACP,WAAA;cALF,CAMC,UACQ,CACD;;EACL;MAEL,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,qBAAqB;GACrB,WAAW;IACT,IAAI;IACJ,IAAI;GACN;GACA,IAAI;EACN;YATF,CAWE,kBAAC,GAAD;GAAK,IAAI;IAAE,IAAI;IAAQ,OAAO;GAAQ;aAAtC;IACE,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;MACZ,IAAI;MACJ,YAAY;KACd;eAEC;IACS,CAAA;IACZ,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;MACZ,IAAI;MACJ,YAAY;KACd;eAEC;IACS,CAAA;IACZ,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,OAAO;MACP,IAAI;KACN;eAEC;IACS,CAAA;IACZ,kBAAC,GAAD;KACE,IAAI;MACF,SAAS;MACT,KAAK;MACL,YAAY;MACZ,IAAI;KACN;eAEC,KAAS,EAAM,KAAK,GAAM,MAAU,kBAAC,GAAD,EAAA,UAAkB,EAAU,GAAlB,CAAkB,CAAC;IAC/D,CAAA;IACL,kBAAC,GAAD;KACE,SAAQ;KACR,MAAK;KACL,OAAM;KACN,MAAM;KACN,QAAO;eALT,CAMC,UACQ,CACD;;GACL;MACL,kBAAC,GAAD;GAAK,IAAI;IAAE,IAAI;IAAQ,KAAK,EAAE,OAAO,OAAO;GAAE;aAAI;EAAW,CAAA,CAC1D;;AAET"}

package/dist/components/SynapseHomepageV2/SynapseFeaturedDatasetItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseFeaturedDatasetItem.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeaturedDatasetItem.tsx"],"sourcesContent":["import { EastTwoTone } from '@mui/icons-material'\nimport { Box, Card, Chip, Link, SxProps, Typography } from '@mui/material'\nimport ImageFromSynapseTable from '../ImageFromSynapseTable'\n\nexport type SynapseFeaturedDatasetItemProps = {\n  sourceTable: string\n  community?: string | null\n  name?: string | null\n  description?: string | null\n  contributors?: string | null\n  keywords?: string | null\n  individuals?: string | null\n  imageFileId?: string | null\n  size?: string | null\n  sizeUnit?: string | null\n  link: string\n}\nconst clampedTextSx: SxProps = {\n  textOverflow: 'ellipsis',\n  overflow: 'hidden',\n  display: '-webkit-box',\n  '-webkit-box-orient': 'vertical',\n  // height: YOUR HEIGHT,\n  // '-webkit-line-clamp': NUMBER OF LINES,\n}\nexport function SynapseFeaturedDatasetItem({\n  sourceTable,\n  name,\n  description,\n  contributors,\n  keywords,\n  imageFileId,\n  individuals,\n  size,\n  sizeUnit,\n  link,\n}: SynapseFeaturedDatasetItemProps) {\n  const tags: string[] = keywords ? JSON.parse(keywords) : []\n  return (\n    <Card\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        rowGap: '30px',\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'column',\n          rowGap: '15px',\n          p: '30px 30px 0px 30px',\n        }}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            flexWrap: 'wrap',\n            rowGap: '5px',\n            minHeight: '70px',\n            overflow: 'hidden',\n          }}\n        >\n          {tags &&\n            tags.map(tag => {\n              return (\n                <Chip\n                  key={tag}\n                  sx={{\n                    mr: '5px',\n                    color: 'secondary.600',\n                    backgroundColor: 'secondary.100',\n                    borderWidth: '0px',\n                  }}\n                  label={tag}\n                />\n              )\n            })}\n        </Box>\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            fontSize: '24px',\n            fontWeight: 600,\n            lineHeight: '32px',\n            ...clampedTextSx,\n            height: '70px',\n            '-webkit-line-clamp': '2',\n          }}\n        >\n          {name}\n        </Typography>\n      </Box>\n      {imageFileId && (\n        <Box sx={{ p: '30px', backgroundColor: 'primary.100' }}>\n          <ImageFromSynapseTable\n            tableId={sourceTable}\n            fileHandleId={imageFileId}\n          />\n        </Box>\n      )}\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'column',\n          p: '0px 30px 30px 30px',\n        }}\n      >\n        <Typography\n          variant=\"body1\"\n          sx={{\n            fontSize: '16px',\n            fontWeight: 400,\n            lineHeight: '24px',\n            mb: '20px',\n            ...clampedTextSx,\n            height: '120px',\n            '-webkit-line-clamp': '5',\n          }}\n        >\n          {description}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{ fontSize: '14px', fontWeight: 700, lineHeight: '20px' }}\n        >\n          Dimensions\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            mb: '20px',\n            ...clampedTextSx,\n            height: '24px',\n            '-webkit-line-clamp': '1',\n          }}\n        >\n          {individuals} individuals, {size}\n          {sizeUnit}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{ fontSize: '14px', fontWeight: 700, lineHeight: '20px' }}\n        >\n          Contributors\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            ...clampedTextSx,\n            height: '48px',\n            '-webkit-line-clamp': '2',\n          }}\n        >\n          {contributors}\n        </Typography>\n        <Box sx={{ mt: '32px' }}>\n          <Link href={link} target=\"_blank\">\n            Explore dataset\n            <EastTwoTone sx={{ mb: '-8px', ml: '6px' }} />\n          </Link>\n        </Box>\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;AAiBA,IAAM,IAAyB;CAC7B,cAAc;CACd,UAAU;CACV,SAAS;CACT,sBAAsB;CAGvB;AACD,SAAgB,EAA2B,EACzC,gBACA,SACA,gBACA,iBACA,aACA,gBACA,gBACA,SACA,aACA,WACkC;CAClC,IAAM,IAAiB,IAAW,KAAK,MAAM,EAAS,GAAG,EAAE;AAC3D,QACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,eAAe;GACf,QAAQ;GACT;YALH;GAOE,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,eAAe;KACf,QAAQ;KACR,GAAG;KACJ;cANH,CAQE,kBAAC,GAAD;KACE,IAAI;MACF,SAAS;MACT,UAAU;MACV,QAAQ;MACR,WAAW;MACX,UAAU;MACX;eAEA,KACC,EAAK,KAAI,MAEL,kBAAC,GAAD;MAEE,IAAI;OACF,IAAI;OACJ,OAAO;OACP,iBAAiB;OACjB,aAAa;OACd;MACD,OAAO;MACP,EARK,EAQL,CAEJ;KACA,CAAA,EACN,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,UAAU;MACV,YAAY;MACZ,YAAY;MACZ,GAAG;MACH,QAAQ;MACR,sBAAsB;MACvB;eAEA;KACU,CAAA,CACT;;GACL,KACC,kBAAC,GAAD;IAAK,IAAI;KAAE,GAAG;KAAQ,iBAAiB;KAAe;cACpD,kBAAC,GAAD;KACE,SAAS;KACT,cAAc;KACd,CAAA;IACE,CAAA;GAER,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,eAAe;KACf,GAAG;KACJ;cALH;KAOE,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,UAAU;OACV,YAAY;OACZ,YAAY;OACZ,IAAI;OACJ,GAAG;OACH,QAAQ;OACR,sBAAsB;OACvB;gBAEA;MACU,CAAA;KACb,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OAAE,UAAU;OAAQ,YAAY;OAAK,YAAY;OAAQ;gBAC9D;MAEY,CAAA;KACb,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,IAAI;OACJ,GAAG;OACH,QAAQ;OACR,sBAAsB;OACvB;gBAPH;OASG;OAAY;OAAe;OAC3B;OACU;;KACb,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OAAE,UAAU;OAAQ,YAAY;OAAK,YAAY;OAAQ;gBAC9D;MAEY,CAAA;KACb,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,GAAG;OACH,QAAQ;OACR,sBAAsB;OACvB;gBAEA;MACU,CAAA;KACb,kBAAC,GAAD;MAAK,IAAI,EAAE,IAAI,QAAQ;gBACrB,kBAAC,GAAD;OAAM,MAAM;OAAM,QAAO;iBAAzB,CAAkC,mBAEhC,kBAAC,GAAD,EAAa,IAAI;QAAE,IAAI;QAAQ,IAAI;QAAO,EAAI,CAAA,CACzC;;MACH,CAAA;KACF;;GACD"}
+{"version":3,"file":"SynapseFeaturedDatasetItem.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeaturedDatasetItem.tsx"],"sourcesContent":["import { EastTwoTone } from '@mui/icons-material'\nimport { Box, Card, Chip, Link, SxProps, Typography } from '@mui/material'\nimport ImageFromSynapseTable from '../ImageFromSynapseTable'\n\nexport type SynapseFeaturedDatasetItemProps = {\n  sourceTable: string\n  community?: string | null\n  name?: string | null\n  description?: string | null\n  contributors?: string | null\n  keywords?: string | null\n  individuals?: string | null\n  imageFileId?: string | null\n  size?: string | null\n  sizeUnit?: string | null\n  link: string\n}\nconst clampedTextSx: SxProps = {\n  textOverflow: 'ellipsis',\n  overflow: 'hidden',\n  display: '-webkit-box',\n  '-webkit-box-orient': 'vertical',\n  // height: YOUR HEIGHT,\n  // '-webkit-line-clamp': NUMBER OF LINES,\n}\nexport function SynapseFeaturedDatasetItem({\n  sourceTable,\n  name,\n  description,\n  contributors,\n  keywords,\n  imageFileId,\n  individuals,\n  size,\n  sizeUnit,\n  link,\n}: SynapseFeaturedDatasetItemProps) {\n  const tags: string[] = keywords ? JSON.parse(keywords) : []\n  return (\n    <Card\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        rowGap: '30px',\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'column',\n          rowGap: '15px',\n          p: '30px 30px 0px 30px',\n        }}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            flexWrap: 'wrap',\n            rowGap: '5px',\n            minHeight: '70px',\n            overflow: 'hidden',\n          }}\n        >\n          {tags &&\n            tags.map(tag => {\n              return (\n                <Chip\n                  key={tag}\n                  sx={{\n                    mr: '5px',\n                    color: 'secondary.600',\n                    backgroundColor: 'secondary.100',\n                    borderWidth: '0px',\n                  }}\n                  label={tag}\n                />\n              )\n            })}\n        </Box>\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            fontSize: '24px',\n            fontWeight: 600,\n            lineHeight: '32px',\n            ...clampedTextSx,\n            height: '70px',\n            '-webkit-line-clamp': '2',\n          }}\n        >\n          {name}\n        </Typography>\n      </Box>\n      {imageFileId && (\n        <Box sx={{ p: '30px', backgroundColor: 'primary.100' }}>\n          <ImageFromSynapseTable\n            tableId={sourceTable}\n            fileHandleId={imageFileId}\n          />\n        </Box>\n      )}\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'column',\n          p: '0px 30px 30px 30px',\n        }}\n      >\n        <Typography\n          variant=\"body1\"\n          sx={{\n            fontSize: '16px',\n            fontWeight: 400,\n            lineHeight: '24px',\n            mb: '20px',\n            ...clampedTextSx,\n            height: '120px',\n            '-webkit-line-clamp': '5',\n          }}\n        >\n          {description}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{ fontSize: '14px', fontWeight: 700, lineHeight: '20px' }}\n        >\n          Dimensions\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            mb: '20px',\n            ...clampedTextSx,\n            height: '24px',\n            '-webkit-line-clamp': '1',\n          }}\n        >\n          {individuals} individuals, {size}\n          {sizeUnit}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{ fontSize: '14px', fontWeight: 700, lineHeight: '20px' }}\n        >\n          Contributors\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          sx={{\n            ...clampedTextSx,\n            height: '48px',\n            '-webkit-line-clamp': '2',\n          }}\n        >\n          {contributors}\n        </Typography>\n        <Box sx={{ mt: '32px' }}>\n          <Link href={link} target=\"_blank\">\n            Explore dataset\n            <EastTwoTone sx={{ mb: '-8px', ml: '6px' }} />\n          </Link>\n        </Box>\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;AAiBA,IAAM,IAAyB;CAC7B,cAAc;CACd,UAAU;CACV,SAAS;CACT,sBAAsB;AAGxB;AACA,SAAgB,EAA2B,EACzC,gBACA,SACA,gBACA,iBACA,aACA,gBACA,gBACA,SACA,aACA,WACkC;CAClC,IAAM,IAAiB,IAAW,KAAK,MAAM,CAAQ,IAAI,CAAC;CAC1D,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,eAAe;GACf,QAAQ;EACV;YALF;GAOE,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,eAAe;KACf,QAAQ;KACR,GAAG;IACL;cANF,CAQE,kBAAC,GAAD;KACE,IAAI;MACF,SAAS;MACT,UAAU;MACV,QAAQ;MACR,WAAW;MACX,UAAU;KACZ;eAEC,KACC,EAAK,KAAI,MAEL,kBAAC,GAAD;MAEE,IAAI;OACF,IAAI;OACJ,OAAO;OACP,iBAAiB;OACjB,aAAa;MACf;MACA,OAAO;KACR,GARM,CAQN,CAEJ;IACA,CAAA,GACL,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,UAAU;MACV,YAAY;MACZ,YAAY;MACZ,GAAG;MACH,QAAQ;MACR,sBAAsB;KACxB;eAEC;IACS,CAAA,CACT;;GACJ,KACC,kBAAC,GAAD;IAAK,IAAI;KAAE,GAAG;KAAQ,iBAAiB;IAAc;cACnD,kBAAC,GAAD;KACE,SAAS;KACT,cAAc;IACf,CAAA;GACE,CAAA;GAEP,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,eAAe;KACf,GAAG;IACL;cALF;KAOE,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,UAAU;OACV,YAAY;OACZ,YAAY;OACZ,IAAI;OACJ,GAAG;OACH,QAAQ;OACR,sBAAsB;MACxB;gBAEC;KACS,CAAA;KACZ,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OAAE,UAAU;OAAQ,YAAY;OAAK,YAAY;MAAO;gBAC7D;KAEW,CAAA;KACZ,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,IAAI;OACJ,GAAG;OACH,QAAQ;OACR,sBAAsB;MACxB;gBAPF;OASG;OAAY;OAAe;OAC3B;MACS;;KACZ,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OAAE,UAAU;OAAQ,YAAY;OAAK,YAAY;MAAO;gBAC7D;KAEW,CAAA;KACZ,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,GAAG;OACH,QAAQ;OACR,sBAAsB;MACxB;gBAEC;KACS,CAAA;KACZ,kBAAC,GAAD;MAAK,IAAI,EAAE,IAAI,OAAO;gBACpB,kBAAC,GAAD;OAAM,MAAM;OAAM,QAAO;iBAAzB,CAAkC,mBAEhC,kBAAC,GAAD,EAAa,IAAI;QAAE,IAAI;QAAQ,IAAI;OAAM,EAAI,CAAA,CACzC;;KACH,CAAA;IACF;;EACD;;AAEV"}

package/dist/components/SynapseHomepageV2/SynapseFeaturedDatasets.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseFeaturedDatasets.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeaturedDatasets.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport {\n  BackendDestinationEnum,\n  getColumnIndex,\n  getEndpoint,\n} from '@/utils/functions/index'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport { Box } from '@mui/material'\nimport { SynapseFeaturedDatasetItem } from './SynapseFeaturedDatasetItem'\n\nexport type SynapseFeaturedDatasetsProps = {\n  sourceTable: string\n}\n\nexport function SynapseFeaturedDatasets({\n  sourceTable,\n}: SynapseFeaturedDatasetsProps) {\n  // TODO: Figure out how we should present the featured datasets.  Random selection?  Paginated with page nav?\n  // TODO: Only show 3 cards, and a \"Show all datasets\" which shows another 3?\n  const { data } = useGetQueryResultBundleWithAsyncStatus({\n    entityId: sourceTable,\n    query: {\n      sql: `SELECT * FROM ${sourceTable} where name is not null and isFeatured = 'true'`,\n      limit: 6,\n      sort: [\n        //TODO: sort?\n        // { column: 'last_updated', direction: 'DESC' },\n      ],\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n\n  const rowSet = data?.responseBody?.queryResult?.queryResults\n  const headers = rowSet?.headers\n  const entityIdColIndex = getColumnIndex('id', headers)!\n  const communityColIndex = getColumnIndex('community', headers)!\n  const nameColIndex = getColumnIndex('name', headers)!\n  const descriptionColIndex = getColumnIndex('description', headers)!\n  const contributorsColIndex = getColumnIndex('contributors', headers)!\n  const keywordsColIndex = getColumnIndex('keywords', headers)!\n  const individualsColIndex = getColumnIndex('individuals', headers)!\n  const imageColIndex = getColumnIndex('image', headers)!\n  const sizeColIndex = getColumnIndex('size', headers)!\n  const sizeUnitColIndex = getColumnIndex('sizeUnit', headers)!\n  const linkColIndex = getColumnIndex('link', headers)!\n\n  if (!rowSet || rowSet.rows.length == 0) {\n    return <></>\n  }\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: '20px',\n        justifyContent: 'center',\n      }}\n    >\n      {rowSet.rows.map((row, index) => {\n        const community = row.values[communityColIndex]\n        const id = row.values[entityIdColIndex]\n        const name = row.values[nameColIndex]\n        const description = row.values[descriptionColIndex]\n        const contributors = row.values[contributorsColIndex]\n        const keywords = row.values[keywordsColIndex]\n        const individuals = row.values[individualsColIndex]\n        const imageFileId = row.values[imageColIndex]\n        const size = row.values[sizeColIndex]\n        const sizeUnit = row.values[sizeUnitColIndex]\n        const linkColumnValue = row.values[linkColIndex]\n\n        const link =\n          linkColumnValue ??\n          `${getEndpoint(BackendDestinationEnum.PORTAL_ENDPOINT)}Synapse:${id}`\n        return (\n          <Box key={index} sx={{ maxWidth: '450px', width: '100%' }}>\n            <SynapseFeaturedDatasetItem\n              sourceTable={sourceTable}\n              community={community}\n              link={link}\n              name={name}\n              description={description}\n              keywords={keywords}\n              individuals={individuals}\n              contributors={contributors}\n              imageFileId={imageFileId}\n              size={size}\n              sizeUnit={sizeUnit}\n            />\n          </Box>\n        )\n      })}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;AAcA,SAAgB,EAAwB,EACtC,kBAC+B;CAG/B,IAAM,EAAE,YAAS,EAAuC;EACtD,UAAU;EACV,OAAO;GACL,KAAK,iBAAiB,EAAY;GAClC,OAAO;GACP,MAAM,EAGL;GACF;EACD,UAAA;EACA,cAAc;EACf,CAAC,EAEI,IAAS,GAAM,cAAc,aAAa,cAC1C,IAAU,GAAQ,SAClB,IAAmB,EAAe,MAAM,EAAQ,EAChD,IAAoB,EAAe,aAAa,EAAQ,EACxD,IAAe,EAAe,QAAQ,EAAQ,EAC9C,IAAsB,EAAe,eAAe,EAAQ,EAC5D,IAAuB,EAAe,gBAAgB,EAAQ,EAC9D,IAAmB,EAAe,YAAY,EAAQ,EACtD,IAAsB,EAAe,eAAe,EAAQ,EAC5D,IAAgB,EAAe,SAAS,EAAQ,EAChD,IAAe,EAAe,QAAQ,EAAQ,EAC9C,IAAmB,EAAe,YAAY,EAAQ,EACtD,IAAe,EAAe,QAAQ,EAAQ;AAKpD,QAHI,CAAC,KAAU,EAAO,KAAK,UAAU,IAC5B,kBAAA,GAAA,EAAK,CAAA,GAGZ,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,UAAU;GACV,KAAK;GACL,gBAAgB;GACjB;YAEA,EAAO,KAAK,KAAK,GAAK,MAAU;GAC/B,IAAM,IAAY,EAAI,OAAO,IACvB,IAAK,EAAI,OAAO,IAChB,IAAO,EAAI,OAAO,IAClB,IAAc,EAAI,OAAO,IACzB,IAAe,EAAI,OAAO,IAC1B,IAAW,EAAI,OAAO,IACtB,IAAc,EAAI,OAAO,IACzB,IAAc,EAAI,OAAO,IACzB,IAAO,EAAI,OAAO,IAClB,IAAW,EAAI,OAAO;AAM5B,UACE,kBAAC,GAAD;IAAiB,IAAI;KAAE,UAAU;KAAS,OAAO;KAAQ;cACvD,kBAAC,GAAD;KACe;KACF;KACL,MAVY,EAAI,OAAO,MAIjC,GAAG,EAAY,EAAuB,gBAAgB,CAAC,UAAU;KAOvD;KACO;KACH;KACG;KACC;KACD;KACP;KACI;KACV,CAAA;IACE,EAdI,EAcJ;IAER;EACE,CAAA"}
+{"version":3,"file":"SynapseFeaturedDatasets.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeaturedDatasets.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport {\n  BackendDestinationEnum,\n  getColumnIndex,\n  getEndpoint,\n} from '@/utils/functions/index'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport { Box } from '@mui/material'\nimport { SynapseFeaturedDatasetItem } from './SynapseFeaturedDatasetItem'\n\nexport type SynapseFeaturedDatasetsProps = {\n  sourceTable: string\n}\n\nexport function SynapseFeaturedDatasets({\n  sourceTable,\n}: SynapseFeaturedDatasetsProps) {\n  // TODO: Figure out how we should present the featured datasets.  Random selection?  Paginated with page nav?\n  // TODO: Only show 3 cards, and a \"Show all datasets\" which shows another 3?\n  const { data } = useGetQueryResultBundleWithAsyncStatus({\n    entityId: sourceTable,\n    query: {\n      sql: `SELECT * FROM ${sourceTable} where name is not null and isFeatured = 'true'`,\n      limit: 6,\n      sort: [\n        //TODO: sort?\n        // { column: 'last_updated', direction: 'DESC' },\n      ],\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n\n  const rowSet = data?.responseBody?.queryResult?.queryResults\n  const headers = rowSet?.headers\n  const entityIdColIndex = getColumnIndex('id', headers)!\n  const communityColIndex = getColumnIndex('community', headers)!\n  const nameColIndex = getColumnIndex('name', headers)!\n  const descriptionColIndex = getColumnIndex('description', headers)!\n  const contributorsColIndex = getColumnIndex('contributors', headers)!\n  const keywordsColIndex = getColumnIndex('keywords', headers)!\n  const individualsColIndex = getColumnIndex('individuals', headers)!\n  const imageColIndex = getColumnIndex('image', headers)!\n  const sizeColIndex = getColumnIndex('size', headers)!\n  const sizeUnitColIndex = getColumnIndex('sizeUnit', headers)!\n  const linkColIndex = getColumnIndex('link', headers)!\n\n  if (!rowSet || rowSet.rows.length == 0) {\n    return <></>\n  }\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: '20px',\n        justifyContent: 'center',\n      }}\n    >\n      {rowSet.rows.map((row, index) => {\n        const community = row.values[communityColIndex]\n        const id = row.values[entityIdColIndex]\n        const name = row.values[nameColIndex]\n        const description = row.values[descriptionColIndex]\n        const contributors = row.values[contributorsColIndex]\n        const keywords = row.values[keywordsColIndex]\n        const individuals = row.values[individualsColIndex]\n        const imageFileId = row.values[imageColIndex]\n        const size = row.values[sizeColIndex]\n        const sizeUnit = row.values[sizeUnitColIndex]\n        const linkColumnValue = row.values[linkColIndex]\n\n        const link =\n          linkColumnValue ??\n          `${getEndpoint(BackendDestinationEnum.PORTAL_ENDPOINT)}Synapse:${id}`\n        return (\n          <Box key={index} sx={{ maxWidth: '450px', width: '100%' }}>\n            <SynapseFeaturedDatasetItem\n              sourceTable={sourceTable}\n              community={community}\n              link={link}\n              name={name}\n              description={description}\n              keywords={keywords}\n              individuals={individuals}\n              contributors={contributors}\n              imageFileId={imageFileId}\n              size={size}\n              sizeUnit={sizeUnit}\n            />\n          </Box>\n        )\n      })}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;AAcA,SAAgB,EAAwB,EACtC,kBAC+B;CAG/B,IAAM,EAAE,YAAS,EAAuC;EACtD,UAAU;EACV,OAAO;GACL,KAAK,iBAAiB,EAAY;GAClC,OAAO;GACP,MAAM,CAGN;EACF;EACA,UAAA;EACA,cAAc;CAChB,CAAC,GAEK,IAAS,GAAM,cAAc,aAAa,cAC1C,IAAU,GAAQ,SAClB,IAAmB,EAAe,MAAM,CAAO,GAC/C,IAAoB,EAAe,aAAa,CAAO,GACvD,IAAe,EAAe,QAAQ,CAAO,GAC7C,IAAsB,EAAe,eAAe,CAAO,GAC3D,IAAuB,EAAe,gBAAgB,CAAO,GAC7D,IAAmB,EAAe,YAAY,CAAO,GACrD,IAAsB,EAAe,eAAe,CAAO,GAC3D,IAAgB,EAAe,SAAS,CAAO,GAC/C,IAAe,EAAe,QAAQ,CAAO,GAC7C,IAAmB,EAAe,YAAY,CAAO,GACrD,IAAe,EAAe,QAAQ,CAAO;CAKnD,OAHI,CAAC,KAAU,EAAO,KAAK,UAAU,IAC5B,kBAAA,GAAA,CAAI,CAAA,IAGX,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,UAAU;GACV,KAAK;GACL,gBAAgB;EAClB;YAEC,EAAO,KAAK,KAAK,GAAK,MAAU;GAC/B,IAAM,IAAY,EAAI,OAAO,IACvB,IAAK,EAAI,OAAO,IAChB,IAAO,EAAI,OAAO,IAClB,IAAc,EAAI,OAAO,IACzB,IAAe,EAAI,OAAO,IAC1B,IAAW,EAAI,OAAO,IACtB,IAAc,EAAI,OAAO,IACzB,IAAc,EAAI,OAAO,IACzB,IAAO,EAAI,OAAO,IAClB,IAAW,EAAI,OAAO;GAM5B,OACE,kBAAC,GAAD;IAAiB,IAAI;KAAE,UAAU;KAAS,OAAO;IAAO;cACtD,kBAAC,GAAD;KACe;KACF;KACL,MAVY,EAAI,OAAO,MAIjC,GAAG,EAAY,EAAuB,eAAe,EAAE,UAAU;KAOvD;KACO;KACH;KACG;KACC;KACD;KACP;KACI;IACX,CAAA;GACE,GAdK,CAcL;EAET,CAAC;CACE,CAAA;AAET"}

package/dist/components/SynapseHomepageV2/SynapseFeatures.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseFeatures.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeatures.tsx"],"sourcesContent":["import { ReactComponent as Fisma } from '@/assets/homepage/fisma.svg'\nimport { ReactComponent as Hipaa } from '@/assets/homepage/hipaa-compliant.svg'\nimport { ReactComponent as PoweredBySynapse } from '@/assets/homepage/powered-by-synapse-feature.svg'\nimport { ReactComponent as PrecisionGovernance } from '@/assets/homepage/precision-governance-feature.svg'\nimport { ReactComponent as Python } from '@/assets/homepage/python.svg'\nimport { ReactComponent as R } from '@/assets/homepage/r.svg'\nimport { ReactComponent as ResearchCredit } from '@/assets/homepage/research-credit-feature.svg'\nimport { ReactComponent as SeamlessIntegration } from '@/assets/homepage/seamless-integration-feature.svg'\nimport { useOneSageURL } from '@/utils/hooks'\nimport { Box } from '@mui/material'\nimport { SynapseFeatureItem } from './SynapseFeatureItem'\n\nexport function SynapseFeatures() {\n  const sageResourcesUrl = useOneSageURL('/sageresources')\n  return (\n    <Box sx={{ position: 'relative' }}>\n      <SynapseFeatureItem\n        title=\"Access or query data\"\n        image={<SeamlessIntegration />}\n        subtitle=\"Seamless Integrations\"\n        description=\"Synapse provides you with APIs to access or query data from your web browser, or programmatically via R, Python, and the command line.\"\n        icons={[<Python key=\"pythonIcon\" />, <R key=\"rIcon\" />]}\n        featureName=\"integrations\"\n        link=\"https://help.synapse.org/docs/API-Clients-and-Documentation.1985446128.html\"\n      />\n      <SynapseFeatureItem\n        title=\"Display your provenance\"\n        image={<ResearchCredit key=\"researchCreditIcon\" />}\n        subtitle=\"Research Credit\"\n        description=\"Synapse records and displays the provenance of your analysis at every step. Analyses, data and code can all be referenced through DOIs (Digital Object Identifiers).\"\n        featureName=\"provenance\"\n        link=\"https://help.synapse.org/docs/Provenance.1972470373.html\"\n      />\n      <SynapseFeatureItem\n        title=\"Safeguard data\"\n        image={<PrecisionGovernance key=\"precisionGovernanceIcon\" />}\n        subtitle=\"Precision Governance\"\n        description=\"Ethical openness is our top priority. Sensitive data is protected through a comprehensive system of access controls, regular audits, and privacy-enhancing technologies. Protect the data, protect the patient.\"\n        icons={[<Fisma key=\"fismaIcon\" />, <Hipaa key=\"hipaaIcon\" />]}\n        featureName=\"governance\"\n        link=\"https://help.synapse.org/docs/Synapse-Governance.2004255211.html\"\n      />\n      <SynapseFeatureItem\n        title=\"Accelerate biomedical progress\"\n        image={<PoweredBySynapse key=\"poweredBySynapseIcon\" />}\n        subtitle=\"Powered by Synapse\"\n        description=\"Synapse portals are the front door to innovation. Vibrant research communities exchange data, tools and ideas to accelerate biomedical progress.\"\n        featureName=\"our portals\"\n        link={sageResourcesUrl.toString()}\n      />\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAYA,SAAgB,IAAkB;CAChC,IAAM,IAAmB,EAAc,iBAAiB;AACxD,QACE,kBAAC,GAAD;EAAK,IAAI,EAAE,UAAU,YAAY;YAAjC;GACE,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,EAAuB,CAAA;IAC9B,UAAS;IACT,aAAY;IACZ,OAAO,CAAC,kBAAC,GAAD,EAA2B,EAAf,aAAe,EAAE,kBAAC,GAAD,EAAiB,EAAV,QAAU,CAAC;IACvD,aAAY;IACZ,MAAK;IACL,CAAA;GACF,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,EAA2C,EAAvB,qBAAuB;IAClD,UAAS;IACT,aAAY;IACZ,aAAY;IACZ,MAAK;IACL,CAAA;GACF,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,EAAqD,EAA5B,0BAA4B;IAC5D,UAAS;IACT,aAAY;IACZ,OAAO,CAAC,kBAAC,GAAD,EAAyB,EAAd,YAAc,EAAE,kBAAC,GAAD,EAAyB,EAAd,YAAc,CAAC;IAC7D,aAAY;IACZ,MAAK;IACL,CAAA;GACF,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,EAA+C,EAAzB,uBAAyB;IACtD,UAAS;IACT,aAAY;IACZ,aAAY;IACZ,MAAM,EAAiB,UAAU;IACjC,CAAA;GACE"}
+{"version":3,"file":"SynapseFeatures.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseFeatures.tsx"],"sourcesContent":["import { ReactComponent as Fisma } from '@/assets/homepage/fisma.svg'\nimport { ReactComponent as Hipaa } from '@/assets/homepage/hipaa-compliant.svg'\nimport { ReactComponent as PoweredBySynapse } from '@/assets/homepage/powered-by-synapse-feature.svg'\nimport { ReactComponent as PrecisionGovernance } from '@/assets/homepage/precision-governance-feature.svg'\nimport { ReactComponent as Python } from '@/assets/homepage/python.svg'\nimport { ReactComponent as R } from '@/assets/homepage/r.svg'\nimport { ReactComponent as ResearchCredit } from '@/assets/homepage/research-credit-feature.svg'\nimport { ReactComponent as SeamlessIntegration } from '@/assets/homepage/seamless-integration-feature.svg'\nimport { useOneSageURL } from '@/utils/hooks'\nimport { Box } from '@mui/material'\nimport { SynapseFeatureItem } from './SynapseFeatureItem'\n\nexport function SynapseFeatures() {\n  const sageResourcesUrl = useOneSageURL('/sageresources')\n  return (\n    <Box sx={{ position: 'relative' }}>\n      <SynapseFeatureItem\n        title=\"Access or query data\"\n        image={<SeamlessIntegration />}\n        subtitle=\"Seamless Integrations\"\n        description=\"Synapse provides you with APIs to access or query data from your web browser, or programmatically via R, Python, and the command line.\"\n        icons={[<Python key=\"pythonIcon\" />, <R key=\"rIcon\" />]}\n        featureName=\"integrations\"\n        link=\"https://help.synapse.org/docs/API-Clients-and-Documentation.1985446128.html\"\n      />\n      <SynapseFeatureItem\n        title=\"Display your provenance\"\n        image={<ResearchCredit key=\"researchCreditIcon\" />}\n        subtitle=\"Research Credit\"\n        description=\"Synapse records and displays the provenance of your analysis at every step. Analyses, data and code can all be referenced through DOIs (Digital Object Identifiers).\"\n        featureName=\"provenance\"\n        link=\"https://help.synapse.org/docs/Provenance.1972470373.html\"\n      />\n      <SynapseFeatureItem\n        title=\"Safeguard data\"\n        image={<PrecisionGovernance key=\"precisionGovernanceIcon\" />}\n        subtitle=\"Precision Governance\"\n        description=\"Ethical openness is our top priority. Sensitive data is protected through a comprehensive system of access controls, regular audits, and privacy-enhancing technologies. Protect the data, protect the patient.\"\n        icons={[<Fisma key=\"fismaIcon\" />, <Hipaa key=\"hipaaIcon\" />]}\n        featureName=\"governance\"\n        link=\"https://help.synapse.org/docs/Synapse-Governance.2004255211.html\"\n      />\n      <SynapseFeatureItem\n        title=\"Accelerate biomedical progress\"\n        image={<PoweredBySynapse key=\"poweredBySynapseIcon\" />}\n        subtitle=\"Powered by Synapse\"\n        description=\"Synapse portals are the front door to innovation. Vibrant research communities exchange data, tools and ideas to accelerate biomedical progress.\"\n        featureName=\"our portals\"\n        link={sageResourcesUrl.toString()}\n      />\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAYA,SAAgB,IAAkB;CAChC,IAAM,IAAmB,EAAc,gBAAgB;CACvD,OACE,kBAAC,GAAD;EAAK,IAAI,EAAE,UAAU,WAAW;YAAhC;GACE,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,CAAsB,CAAA;IAC7B,UAAS;IACT,aAAY;IACZ,OAAO,CAAC,kBAAC,GAAD,CAA0B,GAAd,YAAc,GAAG,kBAAC,GAAD,CAAgB,GAAT,OAAS,CAAC;IACtD,aAAY;IACZ,MAAK;GACN,CAAA;GACD,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,CAA0C,GAAtB,oBAAsB;IACjD,UAAS;IACT,aAAY;IACZ,aAAY;IACZ,MAAK;GACN,CAAA;GACD,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,CAAoD,GAA3B,yBAA2B;IAC3D,UAAS;IACT,aAAY;IACZ,OAAO,CAAC,kBAAC,GAAD,CAAwB,GAAb,WAAa,GAAG,kBAAC,GAAD,CAAwB,GAAb,WAAa,CAAC;IAC5D,aAAY;IACZ,MAAK;GACN,CAAA;GACD,kBAAC,GAAD;IACE,OAAM;IACN,OAAO,kBAAC,GAAD,CAA8C,GAAxB,sBAAwB;IACrD,UAAS;IACT,aAAY;IACZ,aAAY;IACZ,MAAM,EAAiB,SAAS;GACjC,CAAA;EACE;;AAET"}

package/dist/components/SynapseHomepageV2/SynapseHomepageChatSearch.js

@@ -4,30 +4,27 @@ import { useState as n } from "react";
 import { Box as r, FormControl as i, InputAdornment as a, MenuItem as o, OutlinedInput as s, Select as c, useTheme as l } from "@mui/material";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region src/components/SynapseHomepageV2/SynapseHomepageChatSearch.tsx
-var f = /* @__PURE__ */ function(e) {
-	return e[e.SEARCH = 0] = "SEARCH", e[e.CHAT = 1] = "CHAT", e;
-}(f || {});
-function p({ gotoPlace: p }) {
-	let m = l(), [h, g] = n(""), [_, v] = n(""), [y, b] = n(f.SEARCH), x = () => {
-		if (y == f.SEARCH) {
-			let n = h.toLowerCase().trim(), r = e(n);
+function f({ gotoPlace: f }) {
+	let p = l(), [m, h] = n(""), [g, _] = n(""), [v, y] = n(0), b = () => {
+		if (v == 0) {
+			let n = m.toLowerCase().trim(), r = e(n);
 			if (r && r.targetVersionNumber) {
-				p(`/Synapse:${`${r.targetId}.${r.targetVersionNumber}`}`);
+				f(`/Synapse:${`${r.targetId}.${r.targetVersionNumber}`}`);
 				return;
 			}
-			p(`/SearchV2:default?query=${t(n.split(/[ ,]+/))}`);
-		} else p(`/Chat:initialMessage=${encodeURIComponent(_)}`);
+			f(`/SearchV2:default?query=${t(n.split(/[ ,]+/))}`);
+		} else f(`/Chat:initialMessage=${encodeURIComponent(g)}`);
 	};
 	return /* @__PURE__ */ u(r, {
 		component: "form",
 		onSubmit: (e) => {
-			e.preventDefault(), x();
+			e.preventDefault(), b();
 		},
 		children: /* @__PURE__ */ u(i, {
 			fullWidth: !0,
 			sx: { m: 1 },
 			children: /* @__PURE__ */ u(s, {
-				value: y == f.SEARCH ? h : _,
+				value: v == 0 ? m : g,
 				startAdornment: /* @__PURE__ */ u(a, {
 					position: "start",
 					sx: {
@@ -36,42 +33,42 @@ function p({ gotoPlace: p }) {
 						mr: "13px"
 					},
 					children: /* @__PURE__ */ d(c, {
-						value: y,
+						value: v,
 						sx: {
 							fontSize: "24px",
 							fontWeight: 400,
 							minWidth: "125px",
-							color: m.palette.secondary[600],
+							color: p.palette.secondary[600],
 							"& div[role=\"combobox\"]": { p: "14px 12px" }
 						},
 						onChange: (e) => {
-							b(e.target.value);
+							y(e.target.value);
 						},
 						children: [/* @__PURE__ */ u(o, {
-							value: f.SEARCH,
+							value: 0,
 							children: "Search"
 						}), /* @__PURE__ */ u(o, {
-							value: f.CHAT,
+							value: 1,
 							children: "Chat"
 						})]
 					})
 				}),
-				placeholder: y == f.SEARCH ? "Search Synapse" : "Ask a question",
+				placeholder: v == 0 ? "Search Synapse" : "Ask a question",
 				sx: {
 					fontSize: "24px",
 					borderRadius: 96.6
 				},
 				onChange: (e) => {
-					y == f.SEARCH ? g(e.target.value) : v(e.target.value);
+					v == 0 ? h(e.target.value) : _(e.target.value);
 				},
 				onKeyDown: (e) => {
-					e.key === "Enter" && (e.preventDefault(), x());
+					e.key === "Enter" && (e.preventDefault(), b());
 				}
 			})
 		})
 	});
 }
 //#endregion
-export { p as SynapseHomepageChatSearch };
+export { f as SynapseHomepageChatSearch };
 
 //# sourceMappingURL=SynapseHomepageChatSearch.js.map

package/dist/components/SynapseHomepageV2/SynapseHomepageChatSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseHomepageChatSearch.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageChatSearch.tsx"],"sourcesContent":["import {\n  Box,\n  FormControl,\n  InputAdornment,\n  MenuItem,\n  OutlinedInput,\n  Select,\n  useTheme,\n} from '@mui/material'\nimport { Color } from '@mui/material/styles'\nimport { FormEventHandler, KeyboardEventHandler, useState } from 'react'\nimport { getSearchToken } from '../SynapseNavDrawer/SynapseNavDrawer'\nimport { parseSynId } from '@/utils/functions/RegularExpressions'\n\nexport type SynapseHomepageChatSearchProps = {\n  gotoPlace: (href: string) => void\n}\nenum SearchMode {\n  SEARCH = 0,\n  CHAT = 1,\n}\n\n/**\n * Synapse Homepage Search component with a dropdown \"autocomplete\" menu of options.\n * SWC-7005: Not used in the current implementation of the Home Page, but there are plans to utilize it later.\n * @returns\n */\nexport function SynapseHomepageChatSearch({\n  gotoPlace,\n}: SynapseHomepageChatSearchProps) {\n  const theme = useTheme()\n  const [searchValue, setSearchValue] = useState('')\n  const [chatValue, setChatValue] = useState('')\n  const [mode, setMode] = useState(SearchMode.SEARCH)\n\n  const executeSearch = () => {\n    if (mode == SearchMode.SEARCH) {\n      const searchValueCleaned = searchValue.toLowerCase().trim()\n\n      // Check if the input is a valid Synapse ID with version\n      const parsedSynId = parseSynId(searchValueCleaned)\n      if (parsedSynId && parsedSynId.targetVersionNumber) {\n        const synIdWithVersion = `${parsedSynId.targetId}.${parsedSynId.targetVersionNumber}`\n        gotoPlace(`/Synapse:${synIdWithVersion}`)\n        return\n      }\n      gotoPlace(\n        `/SearchV2:default?query=${getSearchToken(\n          searchValueCleaned.split(/[ ,]+/),\n        )}`,\n      )\n    } else {\n      gotoPlace(`/Chat:initialMessage=${encodeURIComponent(chatValue)}`)\n    }\n  }\n  const handleSubmit: FormEventHandler<HTMLFormElement> = event => {\n    event.preventDefault()\n    executeSearch()\n  }\n  const handleKeyDown: KeyboardEventHandler<\n    HTMLTextAreaElement | HTMLInputElement\n  > = event => {\n    if (event.key === 'Enter') {\n      event.preventDefault()\n      executeSearch()\n    }\n  }\n\n  return (\n    <Box component=\"form\" onSubmit={handleSubmit}>\n      <FormControl fullWidth sx={{ m: 1 }}>\n        <OutlinedInput\n          value={mode == SearchMode.SEARCH ? searchValue : chatValue}\n          startAdornment={\n            <InputAdornment\n              position=\"start\"\n              sx={{ p: '0px', ml: '7px', mr: '13px' }}\n            >\n              <Select\n                value={mode}\n                sx={{\n                  fontSize: '24px',\n                  fontWeight: 400,\n                  minWidth: '125px',\n                  color: (theme.palette.secondary as unknown as Color)[600],\n                  '& div[role=\"combobox\"]': {\n                    p: '14px 12px',\n                  },\n                }}\n                onChange={v => {\n                  setMode(v.target.value as SearchMode)\n                  //restore search or chat value\n                }}\n              >\n                <MenuItem value={SearchMode.SEARCH}>Search</MenuItem>\n                <MenuItem value={SearchMode.CHAT}>Chat</MenuItem>\n              </Select>\n            </InputAdornment>\n          }\n          placeholder={\n            mode == SearchMode.SEARCH ? 'Search Synapse' : 'Ask a question'\n          }\n          sx={{ fontSize: '24px', borderRadius: 96.6 }}\n          onChange={event => {\n            if (mode == SearchMode.SEARCH) {\n              setSearchValue(event.target.value)\n            } else {\n              setChatValue(event.target.value)\n            }\n          }}\n          onKeyDown={handleKeyDown}\n        />\n      </FormControl>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;AAiBA,IAAK,IAAL,yBAAA,GAAA;QACE,EAAA,EAAA,SAAS,KAAA,UACT,EAAA,EAAA,OAAO,KAAA;EAFJ,KAAA,EAAA,CAGJ;AAOD,SAAgB,EAA0B,EACxC,gBACiC;CACjC,IAAM,IAAQ,GAAU,EAClB,CAAC,GAAa,KAAkB,EAAS,GAAG,EAC5C,CAAC,GAAW,KAAgB,EAAS,GAAG,EACxC,CAAC,GAAM,KAAW,EAAS,EAAW,OAAO,EAE7C,UAAsB;AAC1B,MAAI,KAAQ,EAAW,QAAQ;GAC7B,IAAM,IAAqB,EAAY,aAAa,CAAC,MAAM,EAGrD,IAAc,EAAW,EAAmB;AAClD,OAAI,KAAe,EAAY,qBAAqB;AAElD,MAAU,YAAY,GADM,EAAY,SAAS,GAAG,EAAY,wBACvB;AACzC;;AAEF,KACE,2BAA2B,EACzB,EAAmB,MAAM,QAAQ,CAClC,GACF;QAED,GAAU,wBAAwB,mBAAmB,EAAU,GAAG;;AAgBtE,QACE,kBAAC,GAAD;EAAK,WAAU;EAAO,WAdgC,MAAS;AAE/D,GADA,EAAM,gBAAgB,EACtB,GAAe;;YAab,kBAAC,GAAD;GAAa,WAAA;GAAU,IAAI,EAAE,GAAG,GAAG;aACjC,kBAAC,GAAD;IACE,OAAO,KAAQ,EAAW,SAAS,IAAc;IACjD,gBACE,kBAAC,GAAD;KACE,UAAS;KACT,IAAI;MAAE,GAAG;MAAO,IAAI;MAAO,IAAI;MAAQ;eAEvC,kBAAC,GAAD;MACE,OAAO;MACP,IAAI;OACF,UAAU;OACV,YAAY;OACZ,UAAU;OACV,OAAQ,EAAM,QAAQ,UAA+B;OACrD,4BAA0B,EACxB,GAAG,aACJ;OACF;MACD,WAAU,MAAK;AACb,SAAQ,EAAE,OAAO,MAAoB;;gBAZzC,CAgBE,kBAAC,GAAD;OAAU,OAAO,EAAW;iBAAQ;OAAiB,CAAA,EACrD,kBAAC,GAAD;OAAU,OAAO,EAAW;iBAAM;OAAe,CAAA,CAC1C;;KACM,CAAA;IAEnB,aACE,KAAQ,EAAW,SAAS,mBAAmB;IAEjD,IAAI;KAAE,UAAU;KAAQ,cAAc;KAAM;IAC5C,WAAU,MAAS;AACjB,KAAI,KAAQ,EAAW,SACrB,EAAe,EAAM,OAAO,MAAM,GAElC,EAAa,EAAM,OAAO,MAAM;;IAGpC,YAjDJ,MAAS;AACX,KAAI,EAAM,QAAQ,YAChB,EAAM,gBAAgB,EACtB,GAAe;;IA+CX,CAAA;GACU,CAAA;EACV,CAAA"}
+{"version":3,"file":"SynapseHomepageChatSearch.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageChatSearch.tsx"],"sourcesContent":["import {\n  Box,\n  FormControl,\n  InputAdornment,\n  MenuItem,\n  OutlinedInput,\n  Select,\n  useTheme,\n} from '@mui/material'\nimport { Color } from '@mui/material/styles'\nimport { FormEventHandler, KeyboardEventHandler, useState } from 'react'\nimport { getSearchToken } from '../SynapseNavDrawer/SynapseNavDrawer'\nimport { parseSynId } from '@/utils/functions/RegularExpressions'\n\nexport type SynapseHomepageChatSearchProps = {\n  gotoPlace: (href: string) => void\n}\nenum SearchMode {\n  SEARCH = 0,\n  CHAT = 1,\n}\n\n/**\n * Synapse Homepage Search component with a dropdown \"autocomplete\" menu of options.\n * SWC-7005: Not used in the current implementation of the Home Page, but there are plans to utilize it later.\n * @returns\n */\nexport function SynapseHomepageChatSearch({\n  gotoPlace,\n}: SynapseHomepageChatSearchProps) {\n  const theme = useTheme()\n  const [searchValue, setSearchValue] = useState('')\n  const [chatValue, setChatValue] = useState('')\n  const [mode, setMode] = useState(SearchMode.SEARCH)\n\n  const executeSearch = () => {\n    if (mode == SearchMode.SEARCH) {\n      const searchValueCleaned = searchValue.toLowerCase().trim()\n\n      // Check if the input is a valid Synapse ID with version\n      const parsedSynId = parseSynId(searchValueCleaned)\n      if (parsedSynId && parsedSynId.targetVersionNumber) {\n        const synIdWithVersion = `${parsedSynId.targetId}.${parsedSynId.targetVersionNumber}`\n        gotoPlace(`/Synapse:${synIdWithVersion}`)\n        return\n      }\n      gotoPlace(\n        `/SearchV2:default?query=${getSearchToken(\n          searchValueCleaned.split(/[ ,]+/),\n        )}`,\n      )\n    } else {\n      gotoPlace(`/Chat:initialMessage=${encodeURIComponent(chatValue)}`)\n    }\n  }\n  const handleSubmit: FormEventHandler<HTMLFormElement> = event => {\n    event.preventDefault()\n    executeSearch()\n  }\n  const handleKeyDown: KeyboardEventHandler<\n    HTMLTextAreaElement | HTMLInputElement\n  > = event => {\n    if (event.key === 'Enter') {\n      event.preventDefault()\n      executeSearch()\n    }\n  }\n\n  return (\n    <Box component=\"form\" onSubmit={handleSubmit}>\n      <FormControl fullWidth sx={{ m: 1 }}>\n        <OutlinedInput\n          value={mode == SearchMode.SEARCH ? searchValue : chatValue}\n          startAdornment={\n            <InputAdornment\n              position=\"start\"\n              sx={{ p: '0px', ml: '7px', mr: '13px' }}\n            >\n              <Select\n                value={mode}\n                sx={{\n                  fontSize: '24px',\n                  fontWeight: 400,\n                  minWidth: '125px',\n                  color: (theme.palette.secondary as unknown as Color)[600],\n                  '& div[role=\"combobox\"]': {\n                    p: '14px 12px',\n                  },\n                }}\n                onChange={v => {\n                  setMode(v.target.value as SearchMode)\n                  //restore search or chat value\n                }}\n              >\n                <MenuItem value={SearchMode.SEARCH}>Search</MenuItem>\n                <MenuItem value={SearchMode.CHAT}>Chat</MenuItem>\n              </Select>\n            </InputAdornment>\n          }\n          placeholder={\n            mode == SearchMode.SEARCH ? 'Search Synapse' : 'Ask a question'\n          }\n          sx={{ fontSize: '24px', borderRadius: 96.6 }}\n          onChange={event => {\n            if (mode == SearchMode.SEARCH) {\n              setSearchValue(event.target.value)\n            } else {\n              setChatValue(event.target.value)\n            }\n          }}\n          onKeyDown={handleKeyDown}\n        />\n      </FormControl>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;AA2BA,SAAgB,EAA0B,EACxC,gBACiC;CACjC,IAAM,IAAQ,EAAS,GACjB,CAAC,GAAa,KAAkB,EAAS,EAAE,GAC3C,CAAC,GAAW,KAAgB,EAAS,EAAE,GACvC,CAAC,GAAM,KAAW,EAAA,CAA0B,GAE5C,UAAsB;EAC1B,IAAI,KAAA,GAA2B;GAC7B,IAAM,IAAqB,EAAY,YAAY,EAAE,KAAK,GAGpD,IAAc,EAAW,CAAkB;GACjD,IAAI,KAAe,EAAY,qBAAqB;IAElD,EAAU,YAAY,GADM,EAAY,SAAS,GAAG,EAAY,uBACxB;IACxC;GACF;GACA,EACE,2BAA2B,EACzB,EAAmB,MAAM,OAAO,CAClC,GACF;EACF,OACE,EAAU,wBAAwB,mBAAmB,CAAS,GAAG;CAErE;CAcA,OACE,kBAAC,GAAD;EAAK,WAAU;EAAO,WAdgC,MAAS;GAE/D,AADA,EAAM,eAAe,GACrB,EAAc;EAChB;YAYI,kBAAC,GAAD;GAAa,WAAA;GAAU,IAAI,EAAE,GAAG,EAAE;aAChC,kBAAC,GAAD;IACE,OAAO,KAAA,IAA4B,IAAc;IACjD,gBACE,kBAAC,GAAD;KACE,UAAS;KACT,IAAI;MAAE,GAAG;MAAO,IAAI;MAAO,IAAI;KAAO;eAEtC,kBAAC,GAAD;MACE,OAAO;MACP,IAAI;OACF,UAAU;OACV,YAAY;OACZ,UAAU;OACV,OAAQ,EAAM,QAAQ,UAA+B;OACrD,4BAA0B,EACxB,GAAG,YACL;MACF;MACA,WAAU,MAAK;OACb,EAAQ,EAAE,OAAO,KAAmB;MAEtC;gBAdF,CAgBE,kBAAC,GAAD;OAAU,OAAA;iBAA0B;MAAgB,CAAA,GACpD,kBAAC,GAAD;OAAU,OAAA;iBAAwB;MAAc,CAAA,CAC1C;;IACM,CAAA;IAElB,aACE,KAAA,IAA4B,mBAAmB;IAEjD,IAAI;KAAE,UAAU;KAAQ,cAAc;IAAK;IAC3C,WAAU,MAAS;KACjB,AAAI,KAAA,IACF,EAAe,EAAM,OAAO,KAAK,IAEjC,EAAa,EAAM,OAAO,KAAK;IAEnC;IACA,YAjDJ,MAAS;KACX,AAAI,EAAM,QAAQ,YAChB,EAAM,eAAe,GACrB,EAAc;IAElB;GA6CO,CAAA;EACU,CAAA;CACV,CAAA;AAET"}

package/dist/components/SynapseHomepageV2/SynapseHomepageNavBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseHomepageNavBar.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageNavBar.tsx"],"sourcesContent":["import SynapseFullLogo from '@/assets/icons/SynapseFullLogo'\nimport { useSynapseContext } from '@/utils'\nimport { useOneSageURL } from '@/utils/hooks'\nimport { Close, MenuOutlined } from '@mui/icons-material'\nimport {\n  Box,\n  Button,\n  Divider,\n  IconButton,\n  Menu,\n  MenuItem,\n  styled,\n  SxProps,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material'\nimport type { Color } from '@mui/material/styles'\nimport { MouseEvent, useState } from 'react'\nimport SageResourcesPopover from '../SageResourcesPopover'\n\nconst LOGIN_LINK = '/LoginPlace:0'\nconst HOMEPAGE_LINK = '/Home:x'\nexport const PLANS_LINK = '/Plans:0'\nconst DASHBOARD_LINK = '/Profile:v/projects/all'\n\nconst navTextButtonSx: SxProps = {\n  fontSize: '18px',\n  lineHeight: '24px',\n  fontWeight: 400,\n}\nconst navButtonSx: SxProps = {\n  borderRadius: '0',\n  p: {\n    xs: '7px 10px',\n    sm: '7px 30px',\n  },\n}\nconst StyledMenu = styled(Menu)(() => ({\n  '& .MuiPaper-root': {\n    width: '100vw',\n    height: '100vh',\n    maxWidth: '100vw',\n    maxHeight: '100vh',\n    margin: 0,\n    top: '0 !important',\n    left: '0 !important',\n    transform: 'none',\n  },\n}))\n\nconst StyledMenuItem = styled(MenuItem)(() => ({\n  fontSize: '36px',\n  fontWeight: 200,\n  lineHeight: '32px',\n  height: '80px',\n  paddingLeft: '30px',\n}))\n\nexport type SynapseHomepageNavBarProps = {\n  gotoPlace: (href: string) => void\n}\n\nexport function SynapseHomepageNavBar({\n  gotoPlace,\n}: SynapseHomepageNavBarProps) {\n  const { isAuthenticated } = useSynapseContext()\n  const registrationLink = useOneSageURL('/register1')\n  const theme = useTheme()\n  const isSmallView = useMediaQuery(theme.breakpoints.down('md'))\n  const sageResourcesURL = useOneSageURL('/sageresources')\n  // mobile view nav bar menu\n  const [mobileMenuAnchorEl, setMobileMenuAnchorEl] =\n    useState<null | HTMLElement>(null)\n  const handleClickMobileMenu = (event: MouseEvent<HTMLButtonElement>) => {\n    setMobileMenuAnchorEl(event.currentTarget)\n  }\n  const handleCloseMobileMenu = () => {\n    setMobileMenuAnchorEl(null)\n  }\n\n  // Portals dropdown\n  const [portalResourcesAnchorEl, setPortalResourcesAnchorEl] =\n    useState<HTMLElement | null>(null)\n  const handleClosePortalResources = () => {\n    setPortalResourcesAnchorEl(null)\n  }\n\n  // Sage solutions dropdown\n  const [sageSolutionsAnchorEl, setSageSolutionsAnchorEl] =\n    useState<HTMLElement | null>(null)\n  const handleCloseSageSolutions = () => {\n    setSageSolutionsAnchorEl(null)\n  }\n\n  const onLoginClicked = () => {\n    // Navigate to the LoginPlace, which will set a cookie that will be used to redirect back from OneSage\n    gotoPlace(LOGIN_LINK)\n  }\n\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        alignItems: 'center',\n        columnGap: '5px',\n        p: {\n          xs: '10px 5px',\n          sm: '20px 15px',\n        },\n      }}\n    >\n      {/* Logo */}\n      <a onClick={() => gotoPlace(HOMEPAGE_LINK)}>\n        <SynapseFullLogo\n          color={(theme.palette.primary as unknown as Color)[900]}\n        />\n      </a>\n      {/* Menu Items */}\n      {/* Desktop nav bar, and a mobile hamburger dropdown menu nav bar that contain the same options */}\n      {!isSmallView && (\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'flex-end',\n            alignItems: 'center',\n            gap: '20px',\n          }}\n        >\n          <Button sx={navTextButtonSx} onClick={() => gotoPlace(PLANS_LINK)}>\n            Plans\n          </Button>\n          <Button\n            sx={navTextButtonSx}\n            onClick={event => setPortalResourcesAnchorEl(event.currentTarget)}\n          >\n            Portals\n          </Button>\n          <Button\n            sx={navTextButtonSx}\n            onClick={event => setSageSolutionsAnchorEl(event.currentTarget)}\n          >\n            Applications\n          </Button>\n          <Button\n            sx={{ ...navTextButtonSx, mr: '15px' }}\n            href=\"https://sagebionetworks.org/\"\n            target=\"_blank\"\n          >\n            Sage Bionetworks\n          </Button>\n          {!isAuthenticated && (\n            <Button\n              size=\"large\"\n              variant=\"outlined\"\n              color=\"secondary\"\n              sx={navButtonSx}\n              onClick={onLoginClicked}\n            >\n              Login\n            </Button>\n          )}\n          {!isAuthenticated && (\n            <Button\n              size=\"large\"\n              variant=\"contained\"\n              color=\"secondary\"\n              sx={navButtonSx}\n              href={registrationLink.toString()}\n            >\n              Register Now\n            </Button>\n          )}\n          {isAuthenticated && (\n            <Button\n              size=\"large\"\n              variant=\"outlined\"\n              color=\"secondary\"\n              sx={navButtonSx}\n              onClick={() => {\n                gotoPlace(DASHBOARD_LINK)\n              }}\n            >\n              View Dashboard\n            </Button>\n          )}\n        </Box>\n      )}\n      <SageResourcesPopover\n        anchorEl={portalResourcesAnchorEl}\n        onClose={handleClosePortalResources}\n        filterByType=\"SynapsePortal\"\n        allResourcesUrl={sageResourcesURL.toString()}\n      />\n      <SageResourcesPopover\n        anchorEl={sageSolutionsAnchorEl}\n        onClose={handleCloseSageSolutions}\n        filterByType=\"SageSolution\"\n        resourceName=\"Applications\"\n        description=\"Innovative tools in the Synapse ecosystem promoting crowd-sourced data science competitions, translational research, and more\"\n      />\n      {isSmallView && (\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'flex-end',\n            columnGap: '10px',\n          }}\n        >\n          <IconButton\n            color=\"secondary\"\n            sx={{\n              borderWidth: 1,\n              borderStyle: 'solid',\n              borderRadius: '0',\n              ml: '70px',\n            }}\n            onClick={handleClickMobileMenu}\n          >\n            <MenuOutlined />\n          </IconButton>\n          <StyledMenu\n            anchorEl={mobileMenuAnchorEl}\n            anchorOrigin={{\n              vertical: 'top',\n              horizontal: 'right',\n            }}\n            keepMounted\n            transformOrigin={{\n              vertical: 'top',\n              horizontal: 'right',\n            }}\n            open={Boolean(mobileMenuAnchorEl)}\n            onClose={handleCloseMobileMenu}\n            MenuListProps={{\n              style: {\n                width: '100%',\n                height: '100%',\n              },\n            }}\n          >\n            <IconButton\n              onClick={handleCloseMobileMenu}\n              sx={{\n                position: 'absolute',\n                top: 5,\n                right: 5,\n                zIndex: 1,\n                color: 'secondary.main',\n                borderWidth: 1,\n                borderStyle: 'solid',\n                borderRadius: '0',\n              }}\n            >\n              <Close />\n            </IconButton>\n            <StyledMenuItem\n              sx={{ mt: '70px' }}\n              onClick={() => {\n                gotoPlace(PLANS_LINK)\n                handleCloseMobileMenu()\n              }}\n            >\n              Plans\n            </StyledMenuItem>\n            <StyledMenuItem\n              onClick={event => {\n                setPortalResourcesAnchorEl(event.currentTarget)\n                handleCloseMobileMenu()\n              }}\n            >\n              Portals\n            </StyledMenuItem>\n            <StyledMenuItem\n              onClick={event => {\n                setSageSolutionsAnchorEl(event.currentTarget)\n                handleCloseMobileMenu()\n              }}\n            >\n              Applications\n            </StyledMenuItem>\n            <StyledMenuItem\n              onClick={() => {\n                window.open('https://sagebionetworks.org/', '_blank')\n                handleCloseMobileMenu()\n              }}\n            >\n              Sage Bionetworks\n            </StyledMenuItem>\n\n            <Divider sx={{ pt: '100px' }} />\n            {!isAuthenticated && (\n              <StyledMenuItem\n                sx={{ mt: '30px', color: 'secondary.main' }}\n                onClick={() => {\n                  window.open(registrationLink.toString(), '_blank')\n                  handleCloseMobileMenu()\n                }}\n              >\n                Register Now\n              </StyledMenuItem>\n            )}\n            {!isAuthenticated && (\n              <StyledMenuItem\n                sx={{ mb: '40px' }}\n                onClick={() => {\n                  handleCloseMobileMenu()\n                  onLoginClicked()\n                }}\n              >\n                Log In\n              </StyledMenuItem>\n            )}\n            {isAuthenticated && (\n              <StyledMenuItem\n                sx={{ mb: '40px', color: 'secondary.main' }}\n                onClick={() => {\n                  handleCloseMobileMenu()\n                  gotoPlace(DASHBOARD_LINK)\n                }}\n              >\n                View Dashboard\n              </StyledMenuItem>\n            )}\n          </StyledMenu>\n        </Box>\n      )}\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"SynapseHomepageNavBar.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageNavBar.tsx"],"sourcesContent":["import SynapseFullLogo from '@/assets/icons/SynapseFullLogo'\nimport { useSynapseContext } from '@/utils'\nimport { useOneSageURL } from '@/utils/hooks'\nimport { Close, MenuOutlined } from '@mui/icons-material'\nimport {\n  Box,\n  Button,\n  Divider,\n  IconButton,\n  Menu,\n  MenuItem,\n  styled,\n  SxProps,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material'\nimport type { Color } from '@mui/material/styles'\nimport { MouseEvent, useState } from 'react'\nimport SageResourcesPopover from '../SageResourcesPopover'\n\nconst LOGIN_LINK = '/LoginPlace:0'\nconst HOMEPAGE_LINK = '/Home:x'\nexport const PLANS_LINK = '/Plans:0'\nconst DASHBOARD_LINK = '/Profile:v/projects/all'\n\nconst navTextButtonSx: SxProps = {\n  fontSize: '18px',\n  lineHeight: '24px',\n  fontWeight: 400,\n}\nconst navButtonSx: SxProps = {\n  borderRadius: '0',\n  p: {\n    xs: '7px 10px',\n    sm: '7px 30px',\n  },\n}\nconst StyledMenu = styled(Menu)(() => ({\n  '& .MuiPaper-root': {\n    width: '100vw',\n    height: '100vh',\n    maxWidth: '100vw',\n    maxHeight: '100vh',\n    margin: 0,\n    top: '0 !important',\n    left: '0 !important',\n    transform: 'none',\n  },\n}))\n\nconst StyledMenuItem = styled(MenuItem)(() => ({\n  fontSize: '36px',\n  fontWeight: 200,\n  lineHeight: '32px',\n  height: '80px',\n  paddingLeft: '30px',\n}))\n\nexport type SynapseHomepageNavBarProps = {\n  gotoPlace: (href: string) => void\n}\n\nexport function SynapseHomepageNavBar({\n  gotoPlace,\n}: SynapseHomepageNavBarProps) {\n  const { isAuthenticated } = useSynapseContext()\n  const registrationLink = useOneSageURL('/register1')\n  const theme = useTheme()\n  const isSmallView = useMediaQuery(theme.breakpoints.down('md'))\n  const sageResourcesURL = useOneSageURL('/sageresources')\n  // mobile view nav bar menu\n  const [mobileMenuAnchorEl, setMobileMenuAnchorEl] =\n    useState<null | HTMLElement>(null)\n  const handleClickMobileMenu = (event: MouseEvent<HTMLButtonElement>) => {\n    setMobileMenuAnchorEl(event.currentTarget)\n  }\n  const handleCloseMobileMenu = () => {\n    setMobileMenuAnchorEl(null)\n  }\n\n  // Portals dropdown\n  const [portalResourcesAnchorEl, setPortalResourcesAnchorEl] =\n    useState<HTMLElement | null>(null)\n  const handleClosePortalResources = () => {\n    setPortalResourcesAnchorEl(null)\n  }\n\n  // Sage solutions dropdown\n  const [sageSolutionsAnchorEl, setSageSolutionsAnchorEl] =\n    useState<HTMLElement | null>(null)\n  const handleCloseSageSolutions = () => {\n    setSageSolutionsAnchorEl(null)\n  }\n\n  const onLoginClicked = () => {\n    // Navigate to the LoginPlace, which will set a cookie that will be used to redirect back from OneSage\n    gotoPlace(LOGIN_LINK)\n  }\n\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        alignItems: 'center',\n        columnGap: '5px',\n        p: {\n          xs: '10px 5px',\n          sm: '20px 15px',\n        },\n      }}\n    >\n      {/* Logo */}\n      <a onClick={() => gotoPlace(HOMEPAGE_LINK)}>\n        <SynapseFullLogo\n          color={(theme.palette.primary as unknown as Color)[900]}\n        />\n      </a>\n      {/* Menu Items */}\n      {/* Desktop nav bar, and a mobile hamburger dropdown menu nav bar that contain the same options */}\n      {!isSmallView && (\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'flex-end',\n            alignItems: 'center',\n            gap: '20px',\n          }}\n        >\n          <Button sx={navTextButtonSx} onClick={() => gotoPlace(PLANS_LINK)}>\n            Plans\n          </Button>\n          <Button\n            sx={navTextButtonSx}\n            onClick={event => setPortalResourcesAnchorEl(event.currentTarget)}\n          >\n            Portals\n          </Button>\n          <Button\n            sx={navTextButtonSx}\n            onClick={event => setSageSolutionsAnchorEl(event.currentTarget)}\n          >\n            Applications\n          </Button>\n          <Button\n            sx={{ ...navTextButtonSx, mr: '15px' }}\n            href=\"https://sagebionetworks.org/\"\n            target=\"_blank\"\n          >\n            Sage Bionetworks\n          </Button>\n          {!isAuthenticated && (\n            <Button\n              size=\"large\"\n              variant=\"outlined\"\n              color=\"secondary\"\n              sx={navButtonSx}\n              onClick={onLoginClicked}\n            >\n              Login\n            </Button>\n          )}\n          {!isAuthenticated && (\n            <Button\n              size=\"large\"\n              variant=\"contained\"\n              color=\"secondary\"\n              sx={navButtonSx}\n              href={registrationLink.toString()}\n            >\n              Register Now\n            </Button>\n          )}\n          {isAuthenticated && (\n            <Button\n              size=\"large\"\n              variant=\"outlined\"\n              color=\"secondary\"\n              sx={navButtonSx}\n              onClick={() => {\n                gotoPlace(DASHBOARD_LINK)\n              }}\n            >\n              View Dashboard\n            </Button>\n          )}\n        </Box>\n      )}\n      <SageResourcesPopover\n        anchorEl={portalResourcesAnchorEl}\n        onClose={handleClosePortalResources}\n        filterByType=\"SynapsePortal\"\n        allResourcesUrl={sageResourcesURL.toString()}\n      />\n      <SageResourcesPopover\n        anchorEl={sageSolutionsAnchorEl}\n        onClose={handleCloseSageSolutions}\n        filterByType=\"SageSolution\"\n        resourceName=\"Applications\"\n        description=\"Innovative tools in the Synapse ecosystem promoting crowd-sourced data science competitions, translational research, and more\"\n      />\n      {isSmallView && (\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'flex-end',\n            columnGap: '10px',\n          }}\n        >\n          <IconButton\n            color=\"secondary\"\n            sx={{\n              borderWidth: 1,\n              borderStyle: 'solid',\n              borderRadius: '0',\n              ml: '70px',\n            }}\n            onClick={handleClickMobileMenu}\n          >\n            <MenuOutlined />\n          </IconButton>\n          <StyledMenu\n            anchorEl={mobileMenuAnchorEl}\n            anchorOrigin={{\n              vertical: 'top',\n              horizontal: 'right',\n            }}\n            keepMounted\n            transformOrigin={{\n              vertical: 'top',\n              horizontal: 'right',\n            }}\n            open={Boolean(mobileMenuAnchorEl)}\n            onClose={handleCloseMobileMenu}\n            MenuListProps={{\n              style: {\n                width: '100%',\n                height: '100%',\n              },\n            }}\n          >\n            <IconButton\n              onClick={handleCloseMobileMenu}\n              sx={{\n                position: 'absolute',\n                top: 5,\n                right: 5,\n                zIndex: 1,\n                color: 'secondary.main',\n                borderWidth: 1,\n                borderStyle: 'solid',\n                borderRadius: '0',\n              }}\n            >\n              <Close />\n            </IconButton>\n            <StyledMenuItem\n              sx={{ mt: '70px' }}\n              onClick={() => {\n                gotoPlace(PLANS_LINK)\n                handleCloseMobileMenu()\n              }}\n            >\n              Plans\n            </StyledMenuItem>\n            <StyledMenuItem\n              onClick={event => {\n                setPortalResourcesAnchorEl(event.currentTarget)\n                handleCloseMobileMenu()\n              }}\n            >\n              Portals\n            </StyledMenuItem>\n            <StyledMenuItem\n              onClick={event => {\n                setSageSolutionsAnchorEl(event.currentTarget)\n                handleCloseMobileMenu()\n              }}\n            >\n              Applications\n            </StyledMenuItem>\n            <StyledMenuItem\n              onClick={() => {\n                window.open('https://sagebionetworks.org/', '_blank')\n                handleCloseMobileMenu()\n              }}\n            >\n              Sage Bionetworks\n            </StyledMenuItem>\n\n            <Divider sx={{ pt: '100px' }} />\n            {!isAuthenticated && (\n              <StyledMenuItem\n                sx={{ mt: '30px', color: 'secondary.main' }}\n                onClick={() => {\n                  window.open(registrationLink.toString(), '_blank')\n                  handleCloseMobileMenu()\n                }}\n              >\n                Register Now\n              </StyledMenuItem>\n            )}\n            {!isAuthenticated && (\n              <StyledMenuItem\n                sx={{ mb: '40px' }}\n                onClick={() => {\n                  handleCloseMobileMenu()\n                  onLoginClicked()\n                }}\n              >\n                Log In\n              </StyledMenuItem>\n            )}\n            {isAuthenticated && (\n              <StyledMenuItem\n                sx={{ mb: '40px', color: 'secondary.main' }}\n                onClick={() => {\n                  handleCloseMobileMenu()\n                  gotoPlace(DASHBOARD_LINK)\n                }}\n              >\n                View Dashboard\n              </StyledMenuItem>\n            )}\n          </StyledMenu>\n        </Box>\n      )}\n    </Box>\n  )\n}\n"],"mappings":"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"}

package/dist/components/SynapseHomepageV2/SynapseHomepageSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseHomepageSearch.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageSearch.tsx"],"sourcesContent":["import React from 'react'\nimport { Search } from '@/assets/themed_icons'\nimport { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { SynapseConstants } from '@/utils'\nimport {\n  Autocomplete,\n  Box,\n  Color,\n  FormControl,\n  InputAdornment,\n  Popper,\n  PopperProps,\n  styled,\n  TextField,\n  useTheme,\n} from '@mui/material'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { useState } from 'react'\n\nexport type SynapseHomepageSearchProps = {\n  sourceTable: string\n  gotoPlace: (href: string) => void\n}\n\nconst boxShadow =\n  '0px 4px 4px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.05)'\nconst StyledPopper = styled(Popper)(() => ({\n  '& .MuiAutocomplete-paper': {\n    borderRadius: '0px 0px 40px 40px',\n    p: '0px 20px 20px 20px',\n    boxShadow,\n  },\n}))\n\nconst PopperAlwaysPlacedBelow = (props: PopperProps): React.ReactNode => {\n  // Modifier necessary to force placement to remain on the bottom of the anchor element, despite not having enough space to render\n  return (\n    <StyledPopper\n      {...props}\n      placement=\"bottom\"\n      modifiers={[{ name: 'flip', enabled: false }]}\n    />\n  )\n}\n\n/**\n * Synapse Homepage Search component with a dropdown \"autocomplete\" menu of options.\n * SWC-7005: Not used in the current implementation of the Home Page, but there are plans to utilize it later.\n * @returns\n */\nexport function SynapseHomepageSearch({\n  sourceTable,\n  gotoPlace,\n}: SynapseHomepageSearchProps) {\n  const [isPopperOpen, setIsPopperOpen] = useState(false)\n  const theme = useTheme()\n  const partMask = SynapseConstants.BUNDLE_MASK_QUERY_RESULTS\n  const request: QueryBundleRequest = {\n    partMask,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    entityId: sourceTable,\n    query: {\n      sql: `SELECT * FROM ${sourceTable}`,\n      limit: 10,\n    },\n  }\n  const { data: queryResultResponse, isLoading } =\n    useGetQueryResultBundleWithAsyncStatus(request)\n\n  const rowSet = queryResultResponse?.responseBody?.queryResult?.queryResults\n  const headers = rowSet?.headers\n  const topSearchedColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'top_searched',\n  )!\n  return (\n    <FormControl fullWidth sx={{ m: 1 }}>\n      <Autocomplete\n        freeSolo\n        disableClearable\n        // disable filtering\n        filterOptions={options => options}\n        options={\n          rowSet && !isLoading\n            ? rowSet.rows.map(row => row.values[topSearchedColIndex] ?? '')\n            : ['...']\n        }\n        onChange={(_event, newValue: string | null) => {\n          if (newValue) {\n            gotoPlace(`/SearchV2:default?query=${encodeURIComponent(newValue)}`)\n          }\n        }}\n        slots={{\n          popper: PopperAlwaysPlacedBelow,\n        }}\n        onOpen={() => setIsPopperOpen(true)}\n        onClose={() => setIsPopperOpen(false)}\n        groupBy={() => 'Most popular searches'}\n        renderInput={params => (\n          <TextField\n            {...params}\n            variant=\"outlined\"\n            placeholder=\"Search Synapse\"\n            slotProps={{\n              input: {\n                sx: {\n                  fontSize: '24px',\n                  borderRadius: isPopperOpen ? '40px 40px 0px 0px' : '40px',\n                  backgroundColor: 'white',\n                  boxShadow,\n                },\n                startAdornment: (\n                  <InputAdornment position=\"start\">\n                    <Box\n                      sx={{\n                        ml: '15px',\n                        display: 'flex',\n                        alignItems: 'center',\n                      }}\n                    >\n                      <Search\n                        size={32}\n                        fill={\n                          (theme.palette.secondary as unknown as Color)[600]\n                        }\n                      />\n                    </Box>\n                  </InputAdornment>\n                ),\n              },\n            }}\n          />\n        )}\n      />\n    </FormControl>\n  )\n}\n"],"mappings":";;;;;;;;;;AAwBA,IAAM,IACJ,4EACI,IAAe,EAAO,EAAO,QAAQ,EACzC,4BAA4B;CAC1B,cAAc;CACd,GAAG;CACH;CACD,EACF,EAAE,EAEG,KAA2B,MAG7B,kBAAC,GAAD;CACE,GAAI;CACJ,WAAU;CACV,WAAW,CAAC;EAAE,MAAM;EAAQ,SAAS;EAAO,CAAC;CAC7C,CAAA;AASN,SAAgB,EAAsB,EACpC,gBACA,gBAC6B;CAC7B,IAAM,CAAC,GAAc,KAAmB,EAAS,GAAM,EACjD,IAAQ,GAAU,EAWlB,EAAE,MAAM,GAAqB,iBACjC,EAAuC;EATvC,UAAA;EACA,cAAc;EACd,UAAU;EACV,OAAO;GACL,KAAK,iBAAiB;GACtB,OAAO;GACR;EAGsC,CAAQ,EAE3C,IAAS,GAAqB,cAAc,aAAa,cAEzD,KADU,GAAQ,UACa,WACnC,MAAgB,EAAa,QAAQ,eACtC;AACD,QACE,kBAAC,GAAD;EAAa,WAAA;EAAU,IAAI,EAAE,GAAG,GAAG;YACjC,kBAAC,GAAD;GACE,UAAA;GACA,kBAAA;GAEA,gBAAe,MAAW;GAC1B,SACE,KAAU,CAAC,IACP,EAAO,KAAK,KAAI,MAAO,EAAI,OAAO,MAAwB,GAAG,GAC7D,CAAC,MAAM;GAEb,WAAW,GAAQ,MAA4B;AAC7C,IAAI,KACF,EAAU,2BAA2B,mBAAmB,EAAS,GAAG;;GAGxE,OAAO,EACL,QAAQ,GACT;GACD,cAAc,EAAgB,GAAK;GACnC,eAAe,EAAgB,GAAM;GACrC,eAAe;GACf,cAAa,MACX,kBAAC,GAAD;IACE,GAAI;IACJ,SAAQ;IACR,aAAY;IACZ,WAAW,EACT,OAAO;KACL,IAAI;MACF,UAAU;MACV,cAAc,IAAe,sBAAsB;MACnD,iBAAiB;MACjB;MACD;KACD,gBACE,kBAAC,GAAD;MAAgB,UAAS;gBACvB,kBAAC,GAAD;OACE,IAAI;QACF,IAAI;QACJ,SAAS;QACT,YAAY;QACb;iBAED,kBAAC,GAAD;QACE,MAAM;QACN,MACG,EAAM,QAAQ,UAA+B;QAEhD,CAAA;OACE,CAAA;MACS,CAAA;KAEpB,EACF;IACD,CAAA;GAEJ,CAAA;EACU,CAAA"}
+{"version":3,"file":"SynapseHomepageSearch.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageSearch.tsx"],"sourcesContent":["import React from 'react'\nimport { Search } from '@/assets/themed_icons'\nimport { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { SynapseConstants } from '@/utils'\nimport {\n  Autocomplete,\n  Box,\n  Color,\n  FormControl,\n  InputAdornment,\n  Popper,\n  PopperProps,\n  styled,\n  TextField,\n  useTheme,\n} from '@mui/material'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { useState } from 'react'\n\nexport type SynapseHomepageSearchProps = {\n  sourceTable: string\n  gotoPlace: (href: string) => void\n}\n\nconst boxShadow =\n  '0px 4px 4px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.05)'\nconst StyledPopper = styled(Popper)(() => ({\n  '& .MuiAutocomplete-paper': {\n    borderRadius: '0px 0px 40px 40px',\n    p: '0px 20px 20px 20px',\n    boxShadow,\n  },\n}))\n\nconst PopperAlwaysPlacedBelow = (props: PopperProps): React.ReactNode => {\n  // Modifier necessary to force placement to remain on the bottom of the anchor element, despite not having enough space to render\n  return (\n    <StyledPopper\n      {...props}\n      placement=\"bottom\"\n      modifiers={[{ name: 'flip', enabled: false }]}\n    />\n  )\n}\n\n/**\n * Synapse Homepage Search component with a dropdown \"autocomplete\" menu of options.\n * SWC-7005: Not used in the current implementation of the Home Page, but there are plans to utilize it later.\n * @returns\n */\nexport function SynapseHomepageSearch({\n  sourceTable,\n  gotoPlace,\n}: SynapseHomepageSearchProps) {\n  const [isPopperOpen, setIsPopperOpen] = useState(false)\n  const theme = useTheme()\n  const partMask = SynapseConstants.BUNDLE_MASK_QUERY_RESULTS\n  const request: QueryBundleRequest = {\n    partMask,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    entityId: sourceTable,\n    query: {\n      sql: `SELECT * FROM ${sourceTable}`,\n      limit: 10,\n    },\n  }\n  const { data: queryResultResponse, isLoading } =\n    useGetQueryResultBundleWithAsyncStatus(request)\n\n  const rowSet = queryResultResponse?.responseBody?.queryResult?.queryResults\n  const headers = rowSet?.headers\n  const topSearchedColIndex = headers?.findIndex(\n    selectColumn => selectColumn.name == 'top_searched',\n  )!\n  return (\n    <FormControl fullWidth sx={{ m: 1 }}>\n      <Autocomplete\n        freeSolo\n        disableClearable\n        // disable filtering\n        filterOptions={options => options}\n        options={\n          rowSet && !isLoading\n            ? rowSet.rows.map(row => row.values[topSearchedColIndex] ?? '')\n            : ['...']\n        }\n        onChange={(_event, newValue: string | null) => {\n          if (newValue) {\n            gotoPlace(`/SearchV2:default?query=${encodeURIComponent(newValue)}`)\n          }\n        }}\n        slots={{\n          popper: PopperAlwaysPlacedBelow,\n        }}\n        onOpen={() => setIsPopperOpen(true)}\n        onClose={() => setIsPopperOpen(false)}\n        groupBy={() => 'Most popular searches'}\n        renderInput={params => (\n          <TextField\n            {...params}\n            variant=\"outlined\"\n            placeholder=\"Search Synapse\"\n            slotProps={{\n              input: {\n                sx: {\n                  fontSize: '24px',\n                  borderRadius: isPopperOpen ? '40px 40px 0px 0px' : '40px',\n                  backgroundColor: 'white',\n                  boxShadow,\n                },\n                startAdornment: (\n                  <InputAdornment position=\"start\">\n                    <Box\n                      sx={{\n                        ml: '15px',\n                        display: 'flex',\n                        alignItems: 'center',\n                      }}\n                    >\n                      <Search\n                        size={32}\n                        fill={\n                          (theme.palette.secondary as unknown as Color)[600]\n                        }\n                      />\n                    </Box>\n                  </InputAdornment>\n                ),\n              },\n            }}\n          />\n        )}\n      />\n    </FormControl>\n  )\n}\n"],"mappings":";;;;;;;;;;AAwBA,IAAM,IACJ,4EACI,IAAe,EAAO,CAAM,SAAS,EACzC,4BAA4B;CAC1B,cAAc;CACd,GAAG;CACH;AACF,EACF,EAAE,GAEI,KAA2B,MAG7B,kBAAC,GAAD;CACE,GAAI;CACJ,WAAU;CACV,WAAW,CAAC;EAAE,MAAM;EAAQ,SAAS;CAAM,CAAC;AAC7C,CAAA;AASL,SAAgB,EAAsB,EACpC,gBACA,gBAC6B;CAC7B,IAAM,CAAC,GAAc,KAAmB,EAAS,EAAK,GAChD,IAAQ,EAAS,GAWjB,EAAE,MAAM,GAAqB,iBACjC,EAAuC;EATvC,UAAA;EACA,cAAc;EACd,UAAU;EACV,OAAO;GACL,KAAK,iBAAiB;GACtB,OAAO;EACT;CAGuC,CAAO,GAE1C,IAAS,GAAqB,cAAc,aAAa,cAEzD,KADU,GAAQ,UACa,WACnC,MAAgB,EAAa,QAAQ,cACvC;CACA,OACE,kBAAC,GAAD;EAAa,WAAA;EAAU,IAAI,EAAE,GAAG,EAAE;YAChC,kBAAC,GAAD;GACE,UAAA;GACA,kBAAA;GAEA,gBAAe,MAAW;GAC1B,SACE,KAAU,CAAC,IACP,EAAO,KAAK,KAAI,MAAO,EAAI,OAAO,MAAwB,EAAE,IAC5D,CAAC,KAAK;GAEZ,WAAW,GAAQ,MAA4B;IAC7C,AAAI,KACF,EAAU,2BAA2B,mBAAmB,CAAQ,GAAG;GAEvE;GACA,OAAO,EACL,QAAQ,EACV;GACA,cAAc,EAAgB,EAAI;GAClC,eAAe,EAAgB,EAAK;GACpC,eAAe;GACf,cAAa,MACX,kBAAC,GAAD;IACE,GAAI;IACJ,SAAQ;IACR,aAAY;IACZ,WAAW,EACT,OAAO;KACL,IAAI;MACF,UAAU;MACV,cAAc,IAAe,sBAAsB;MACnD,iBAAiB;MACjB;KACF;KACA,gBACE,kBAAC,GAAD;MAAgB,UAAS;gBACvB,kBAAC,GAAD;OACE,IAAI;QACF,IAAI;QACJ,SAAS;QACT,YAAY;OACd;iBAEA,kBAAC,GAAD;QACE,MAAM;QACN,MACG,EAAM,QAAQ,UAA+B;OAEjD,CAAA;MACE,CAAA;KACS,CAAA;IAEpB,EACF;GACD,CAAA;EAEJ,CAAA;CACU,CAAA;AAEjB"}

package/dist/components/SynapseHomepageV2/SynapseHomepageV2.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseHomepageV2.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageV2.tsx"],"sourcesContent":["import BlinkingLiveIcon from '@/assets/homepage/BlinkingLiveIcon'\nimport { backgroundInlineJpeg } from '@/assets/homepage/header-splash'\nimport image1 from '@/assets/homepage/image1.svg?url'\nimport SageFullLogo from '@/assets/icons/SageFullLogo'\nimport {\n  defaultHomepageText,\n  h2Sx,\n  homepageBodyText,\n  sidePadding,\n  titleSx,\n  visuallyHidden,\n} from '@/components/SynapseHomepageV2/HomepageStyles'\nimport {\n  DATA_CATALOG_PATH_SEGMENT,\n  SAGE_OFFERINGS_HELP_URL,\n} from '@/utils/SynapseConstants'\nimport {\n  Box,\n  Button,\n  Link,\n  Typography,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material'\nimport { useInView } from 'react-intersection-observer'\nimport { TypeAnimation } from 'react-type-animation'\nimport { SynapseByTheNumbers } from './SynapseByTheNumbers'\nimport { SynapseFeaturedDatasets } from './SynapseFeaturedDatasets'\nimport { SynapseFeatures } from './SynapseFeatures'\nimport { SynapseHomepageChatSearch } from './SynapseHomepageChatSearch'\nimport { SynapseHomepageNavBar } from './SynapseHomepageNavBar'\nimport { SynapseHotDrops } from './SynapseHotdrops'\nimport FloatingBlobsBackground from './FloatingBlobsBackground'\nimport { SynapseInAction } from './SynapseInAction'\nimport { SynapsePartners } from './SynapsePartners'\nimport { SynapsePlans } from './SynapsePlans'\nimport { SynapseSearchChips } from './SynapseSearchChips'\nimport { SynapseTrendingProjects } from './SynapseTrendingProjects'\n\nexport const synapseInActionTable = 'syn61670075'\nexport const past30DaysDownloadMetricsTable = 'syn61597084'\nexport const generalStatsMetricsTable = 'syn61588123'\nexport const featuredDatasetsTable = 'syn61609402'\nexport const searchAutocompleteTable = 'syn61670515'\nexport const newAndTrendingTable = 'syn69855119'\n\nexport type SynapseHomepageV2Props = {\n  gotoPlace: (href: string) => void\n}\n\nexport function SynapseHomepageV2({ gotoPlace }: SynapseHomepageV2Props) {\n  const theme = useTheme()\n  const tinyView = useMediaQuery('(max-width:385px)')\n  const isDesktopView = useMediaQuery(theme.breakpoints.up('lg'))\n  //optimization - prioritize loading above-the-fold content (delay loading below the fold)\n  const { ref, inView } = useInView({ triggerOnce: true })\n\n  // Rotating text phrases for the hero section\n  const heroTextPhrases = [\n    'the next cure',\n    'the next diagnostic',\n    'the next preventive therapy',\n  ]\n\n  return (\n    <Box sx={{ overflow: 'hidden' }}>\n      <SynapseHomepageNavBar gotoPlace={gotoPlace} />\n      <Box\n        sx={{\n          position: 'relative',\n          pb: {\n            xs: '30px',\n            md: '80px',\n          },\n        }}\n      >\n        <Box\n          sx={{\n            position: 'absolute',\n            background: `url(${backgroundInlineJpeg}) lightgray 50% / cover no-repeat`,\n            minHeight: {\n              xs: '550px',\n              sm: '400px',\n              md: '600px',\n            },\n            width: '100%',\n            height: '100%',\n            content: \"''\",\n            top: 0,\n            right: 0,\n            bottom: 0,\n            left: 0,\n            zIndex: -1,\n            clipPath: {\n              xs: 'polygon(0 0, 100% 0, 100% 80%, 0% 100%)',\n              md: 'polygon(0 0, 100% 0, 100% 65%, 0% 100%)',\n            },\n          }}\n        >\n          {' '}\n        </Box>\n      </Box>\n\n      <Box\n        sx={{\n          textAlign: 'center',\n          p: {\n            xs: '20px',\n            lg: '80px 0px 0px 0px',\n          },\n          minHeight: tinyView\n            ? '390px'\n            : {\n                xs: '330px',\n                sm: '215px',\n                md: '300px', //larger font\n                lg: undefined,\n              },\n        }}\n      >\n        <Typography variant=\"headline1\" sx={titleSx}>\n          Explore the data <br />\n          behind&nbsp;\n          <TypeAnimation\n            aria-hidden=\"true\"\n            sequence={heroTextPhrases.flatMap(phrase => [phrase, 3000])}\n            wrapper=\"span\"\n            speed={20}\n            repeat={Infinity}\n            style={{\n              color: '#B5D3CE',\n            }}\n          />\n          {/* Screen reader only text */}\n          <Box component=\"span\" sx={visuallyHidden}>\n            {heroTextPhrases.join(', ')}\n          </Box>\n        </Typography>\n      </Box>\n\n      {/* Search */}\n      <Box\n        sx={{\n          pt: { xs: '10px', md: '70px' },\n          pr: '15px',\n          maxWidth: '600px',\n          m: 'auto',\n        }}\n      >\n        <SynapseHomepageChatSearch gotoPlace={gotoPlace} />\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          maxWidth: '1500px',\n          gap: '10px',\n          alignItems: 'center',\n          justifyContent: 'center',\n          mt: '30px',\n          flexWrap: 'wrap',\n          ml: { xs: '5px', md: 'auto' },\n          mr: { xs: '5px', md: 'auto' },\n        }}\n      >\n        {/* Hard-coded popular searches because these Chips are above the fold and immediately visible. Any delay showing these chips is a problem.\n        The hope is that these \"popularSearches\" will not change much over time, since they represent the types of data in the platform.\n        */}\n        <SynapseSearchChips gotoPlace={gotoPlace} />\n      </Box>\n      <Box\n        sx={{\n          backgroundColor: '#F5F9F9',\n          mt: { xs: '50px', md: '100px' },\n        }}\n      >\n        <Box\n          sx={{\n            display: { xs: 'relative', lg: 'grid' },\n            maxWidth: '1500px',\n            gridTemplateColumns: '50% 50%',\n            margin: 'auto',\n            height: { lg: '608px' }, //force container to the same height as the image\n          }}\n        >\n          <Box\n            sx={{\n              p: { xs: '25px', lg: '70px 0px 25px 60px' },\n              svg: {\n                maxWidth: '100%',\n              },\n              display: 'flex',\n              flexDirection: 'column',\n              alignItems: {\n                xs: 'center',\n                md: 'flex-start',\n              },\n            }}\n            ref={ref} // use this UI to trigger loading the rest of the page content\n          >\n            <SageFullLogo width={350} />\n            <Typography\n              variant=\"headline2\"\n              sx={{\n                ...defaultHomepageText,\n                fontSize: {\n                  xs: '24px',\n                  md: '40px',\n                },\n                lineHeight: {\n                  xs: '140%',\n                  md: '60px',\n                },\n                maxWidth: '600px',\n                color: 'secondary.600',\n                mt: '20px',\n                fontWeight: 400,\n                mb: '35px',\n                textAlign: {\n                  xs: 'center',\n                  md: 'left',\n                },\n              }}\n            >\n              Created by <strong>Sage Bionetworks</strong>, Synapse empowers\n              biomedical researchers with tools for open science and\n              collaboration, forging a path to optimal human health.\n            </Typography>\n            <Button\n              size=\"large\"\n              variant=\"contained\"\n              color=\"secondary\"\n              href=\"https://www.sagebionetworks.org\"\n              target=\"_blank\"\n              sx={{\n                p: '5px 25px',\n                width: {\n                  xs: '100%',\n                  md: 'auto',\n                },\n              }}\n            >\n              About Sage Bionetworks\n            </Button>\n          </Box>\n          {isDesktopView && (\n            <Box sx={{ height: '100%', justifySelf: 'end' }}>\n              <img src={image1} alt={''} />\n            </Box>\n          )}\n        </Box>\n      </Box>\n\n      {/* Below the fold content... */}\n      {inView && (\n        <Box>\n          <Box>\n            <Box sx={{ padding: { xs: '45px 40px', md: '80px 25px' } }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...defaultHomepageText,\n                  textAlign: 'center',\n                  mt: '100px',\n                  fontSize: { xs: '32px', md: '40px' },\n                  lineHeight: '42px',\n                  mb: '30px',\n                }}\n              >\n                We partner with scientific leaders\n              </Typography>\n              <Box sx={{ m: 'auto', maxWidth: '750px' }}>\n                <Typography\n                  variant=\"headline1\"\n                  sx={{\n                    ...homepageBodyText,\n                    textAlign: 'center',\n                    mb: '60px',\n                  }}\n                >\n                  Synapse is your ecosystem for responsible data sharing,\n                  innovative data reuse, and collaboration.\n                </Typography>\n              </Box>\n              <SynapsePartners />\n            </Box>\n            <Box\n              sx={{\n                pb: {\n                  xs: '100px',\n                  md: '220px',\n                },\n                clipPath: 'polygon(0 0, 100% 0, 100% 20%, 0% 100%)',\n                backgroundColor: 'white',\n                zIndex: 100,\n              }}\n            />\n            <Box\n              sx={{\n                ...sidePadding,\n                backgroundColor: '#223549',\n                pt: {\n                  xs: '90px',\n                  md: '200px',\n                },\n                mt: {\n                  xs: '-90px',\n                  md: '-200px',\n                },\n                pb: '5px',\n              }}\n            >\n              <Box\n                sx={{\n                  margin: 'auto',\n                  maxWidth: '1500px',\n                }}\n              >\n                <Typography\n                  variant=\"headline1\"\n                  sx={{\n                    ...h2Sx,\n                    textAlign: 'center',\n                    mt: '100px',\n                    mb: '10px',\n                    color: 'white',\n                  }}\n                >\n                  Synapse by the numbers\n                </Typography>\n                <Typography\n                  variant=\"body1\"\n                  sx={{\n                    ...homepageBodyText,\n                    textAlign: 'center',\n                    mb: '70px',\n                    color: 'white',\n                  }}\n                >\n                  <BlinkingLiveIcon sx={{ pt: '7px' }} /> Live\n                </Typography>\n                <SynapseByTheNumbers metricsTable={generalStatsMetricsTable} />\n                <Typography\n                  variant=\"headline2\"\n                  sx={{\n                    ...defaultHomepageText,\n                    textAlign: 'center',\n                    fontSize: '36px',\n                    lineHeight: '40px',\n                    mt: '90px',\n                    mb: '25px',\n                    color: 'white',\n                    fontWeight: 400,\n                  }}\n                >\n                  Projects trending last month\n                </Typography>\n                <SynapseTrendingProjects\n                  past30DaysDownloadMetricsTable={\n                    past30DaysDownloadMetricsTable\n                  }\n                />\n              </Box>\n            </Box>\n            <Box\n              sx={{\n                mt: '-3px',\n                pb: {\n                  xs: '100px',\n                  md: '220px',\n                },\n                clipPath: 'polygon(0 0, 100% 2px, 0 100%, 0% 0%)',\n                backgroundColor: '#223549',\n                zIndex: 100,\n              }}\n            />\n          </Box>\n          <Box sx={{ ml: { xs: '5px', md: '20px' } }}>\n            <Typography\n              variant=\"headline1\"\n              sx={{\n                ...h2Sx,\n                textAlign: 'center',\n                pt: { xs: '45px', md: '75px' },\n                pb: '30px',\n              }}\n            >\n              New &amp; Trending\n            </Typography>\n            <Box sx={{ m: 'auto' }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...homepageBodyText,\n                  textAlign: 'center',\n                  mb: { xs: '30px', md: '60px' },\n                }}\n              >\n                A sample of public projects and datasets recently created on\n                Synapse by researchers like you\n              </Typography>\n            </Box>\n            <Box sx={{ position: 'relative', minHeight: '500px' }}>\n              <FloatingBlobsBackground color1=\"#30b7a8\" color2=\"#296aac\" />\n              <SynapseHotDrops tableId={newAndTrendingTable} />\n            </Box>\n          </Box>\n          <Box\n            sx={{\n              pb: {\n                xs: '100px',\n                md: '220px',\n              },\n              clipPath: 'polygon(0 100%, 100% 0, 100% 100%, 0 100%)',\n              backgroundColor: '#172430',\n              zIndex: 100,\n            }}\n          />\n          <Box\n            sx={{\n              ...sidePadding,\n              backgroundColor: '#172430',\n              mt: '-1px',\n              pt: {\n                xs: '50px',\n                md: '20px',\n              },\n            }}\n          >\n            <Box sx={{ m: 'auto', maxWidth: '1500px' }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...h2Sx,\n                  color: 'white',\n                  maxWidth: '700px',\n                  pb: {\n                    xs: '20px',\n                    sm: '100px',\n                  },\n                  textAlign: {\n                    xs: 'center',\n                    md: 'left',\n                  },\n                }}\n              >\n                Made for biomedical data reuse and discovery\n              </Typography>\n              <SynapseFeatures />\n            </Box>\n          </Box>\n          <Box sx={{ ml: { xs: '5px', md: '20px' } }}>\n            <Typography\n              variant=\"headline1\"\n              sx={{\n                ...h2Sx,\n                textAlign: 'center',\n                padding: { xs: '45px 0', md: '75px 0' },\n              }}\n            >\n              Featured datasets\n            </Typography>\n            <SynapseFeaturedDatasets sourceTable={featuredDatasetsTable} />\n            <Box sx={{ p: '20px 10px' }}>\n              <Button\n                size=\"large\"\n                variant=\"contained\"\n                color=\"secondary\"\n                onClick={() => {\n                  gotoPlace(`/${DATA_CATALOG_PATH_SEGMENT}`)\n                }}\n                sx={{\n                  m: 'auto',\n                  display: 'block',\n                  p: '5px 25px',\n                  width: {\n                    xs: '100%',\n                    md: 'auto',\n                  },\n                }}\n              >\n                View More Datasets\n              </Button>\n            </Box>\n          </Box>\n          <Box\n            sx={{\n              pb: {\n                xs: '100px',\n                md: '220px',\n              },\n              clipPath: 'polygon(0 100%, 100% 0, 100% 100%, 0 100%)',\n              backgroundColor: '#f5f9f9',\n              zIndex: -100,\n              mt: {\n                xs: '-100px',\n                md: '-220px',\n              },\n              position: 'relative',\n            }}\n          />\n          <Box\n            sx={{\n              backgroundColor: '#f5f9f9',\n              pb: { xs: '10px', md: '0px' },\n            }}\n          >\n            <Typography\n              variant=\"headline1\"\n              sx={{\n                ...h2Sx,\n                textAlign: 'center',\n                pt: '75px',\n                position: 'relative',\n                zIndex: 100,\n                backgroundColor: 'rgba(245, 249, 249, .8)',\n                borderRadius: '12px',\n                ml: { xs: '5px', md: '20px' },\n              }}\n            >\n              Synapse in action\n            </Typography>\n            <Box sx={{ m: 'auto', maxWidth: '1100px' }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...homepageBodyText,\n                  textAlign: 'center',\n                  mt: '50px',\n                  mb: '100px',\n                  position: 'relative',\n                  zIndex: 100,\n                  ml: '5px',\n                  mr: '5px',\n                  backgroundColor: 'rgba(245, 249, 249, .8)',\n                  borderRadius: '12px',\n                }}\n              >\n                Explore real-world case studies and success stories showcasing\n                how researchers use Synapse to drive innovative biomedical\n                discoveries and improve health outcomes.\n              </Typography>\n            </Box>\n            <SynapseInAction tableId={synapseInActionTable} />\n          </Box>\n          <Box\n            sx={{\n              ...sidePadding,\n              backgroundColor: '#223549',\n              pb: '200px',\n              position: 'relative',\n              zIndex: 100,\n            }}\n          >\n            <Box\n              sx={{\n                maxWidth: '1200px',\n                m: 'auto',\n              }}\n            >\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...h2Sx,\n                  color: 'white',\n                  pt: '75px',\n                }}\n              >\n                Plans\n              </Typography>\n              <Typography\n                variant=\"body1\"\n                sx={{\n                  ...homepageBodyText,\n                  color: 'white',\n                  pt: '20px',\n                }}\n              >\n                Synapse is free and open source for all. We offer different\n                plans to help you if you need extra storage or help with your\n                data management.\n              </Typography>\n              <Link\n                href={SAGE_OFFERINGS_HELP_URL}\n                target=\"_blank\"\n                sx={{\n                  color: 'white !important',\n                  textDecorationColor: 'white !important',\n                  pt: '20px',\n                  pb: '30px',\n                  display: 'block',\n                }}\n              >\n                Learn more about our plans\n              </Link>\n              <SynapsePlans />\n            </Box>\n          </Box>\n          <Box\n            sx={{\n              pb: {\n                xs: '100px',\n                md: '220px',\n              },\n              clipPath: 'polygon(0 100%, 100% 0, 100% 100%, 0 100%)',\n              backgroundColor: '#172430',\n              zIndex: 101,\n              mt: {\n                xs: '-100px',\n                md: '-220px',\n              },\n              position: 'relative',\n            }}\n          />\n        </Box>\n      )}\n    </Box>\n  )\n}\n\nexport default SynapseHomepageV2\n"],"mappings":"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"}
+{"version":3,"file":"SynapseHomepageV2.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHomepageV2.tsx"],"sourcesContent":["import BlinkingLiveIcon from '@/assets/homepage/BlinkingLiveIcon'\nimport { backgroundInlineJpeg } from '@/assets/homepage/header-splash'\nimport image1 from '@/assets/homepage/image1.svg?url'\nimport SageFullLogo from '@/assets/icons/SageFullLogo'\nimport {\n  defaultHomepageText,\n  h2Sx,\n  homepageBodyText,\n  sidePadding,\n  titleSx,\n  visuallyHidden,\n} from '@/components/SynapseHomepageV2/HomepageStyles'\nimport {\n  DATA_CATALOG_PATH_SEGMENT,\n  SAGE_OFFERINGS_HELP_URL,\n} from '@/utils/SynapseConstants'\nimport {\n  Box,\n  Button,\n  Link,\n  Typography,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material'\nimport { useInView } from 'react-intersection-observer'\nimport { TypeAnimation } from 'react-type-animation'\nimport { SynapseByTheNumbers } from './SynapseByTheNumbers'\nimport { SynapseFeaturedDatasets } from './SynapseFeaturedDatasets'\nimport { SynapseFeatures } from './SynapseFeatures'\nimport { SynapseHomepageChatSearch } from './SynapseHomepageChatSearch'\nimport { SynapseHomepageNavBar } from './SynapseHomepageNavBar'\nimport { SynapseHotDrops } from './SynapseHotdrops'\nimport FloatingBlobsBackground from './FloatingBlobsBackground'\nimport { SynapseInAction } from './SynapseInAction'\nimport { SynapsePartners } from './SynapsePartners'\nimport { SynapsePlans } from './SynapsePlans'\nimport { SynapseSearchChips } from './SynapseSearchChips'\nimport { SynapseTrendingProjects } from './SynapseTrendingProjects'\n\nexport const synapseInActionTable = 'syn61670075'\nexport const past30DaysDownloadMetricsTable = 'syn61597084'\nexport const generalStatsMetricsTable = 'syn61588123'\nexport const featuredDatasetsTable = 'syn61609402'\nexport const searchAutocompleteTable = 'syn61670515'\nexport const newAndTrendingTable = 'syn69855119'\n\nexport type SynapseHomepageV2Props = {\n  gotoPlace: (href: string) => void\n}\n\nexport function SynapseHomepageV2({ gotoPlace }: SynapseHomepageV2Props) {\n  const theme = useTheme()\n  const tinyView = useMediaQuery('(max-width:385px)')\n  const isDesktopView = useMediaQuery(theme.breakpoints.up('lg'))\n  //optimization - prioritize loading above-the-fold content (delay loading below the fold)\n  const { ref, inView } = useInView({ triggerOnce: true })\n\n  // Rotating text phrases for the hero section\n  const heroTextPhrases = [\n    'the next cure',\n    'the next diagnostic',\n    'the next preventive therapy',\n  ]\n\n  return (\n    <Box sx={{ overflow: 'hidden' }}>\n      <SynapseHomepageNavBar gotoPlace={gotoPlace} />\n      <Box\n        sx={{\n          position: 'relative',\n          pb: {\n            xs: '30px',\n            md: '80px',\n          },\n        }}\n      >\n        <Box\n          sx={{\n            position: 'absolute',\n            background: `url(${backgroundInlineJpeg}) lightgray 50% / cover no-repeat`,\n            minHeight: {\n              xs: '550px',\n              sm: '400px',\n              md: '600px',\n            },\n            width: '100%',\n            height: '100%',\n            content: \"''\",\n            top: 0,\n            right: 0,\n            bottom: 0,\n            left: 0,\n            zIndex: -1,\n            clipPath: {\n              xs: 'polygon(0 0, 100% 0, 100% 80%, 0% 100%)',\n              md: 'polygon(0 0, 100% 0, 100% 65%, 0% 100%)',\n            },\n          }}\n        >\n          {' '}\n        </Box>\n      </Box>\n\n      <Box\n        sx={{\n          textAlign: 'center',\n          p: {\n            xs: '20px',\n            lg: '80px 0px 0px 0px',\n          },\n          minHeight: tinyView\n            ? '390px'\n            : {\n                xs: '330px',\n                sm: '215px',\n                md: '300px', //larger font\n                lg: undefined,\n              },\n        }}\n      >\n        <Typography variant=\"headline1\" sx={titleSx}>\n          Explore the data <br />\n          behind&nbsp;\n          <TypeAnimation\n            aria-hidden=\"true\"\n            sequence={heroTextPhrases.flatMap(phrase => [phrase, 3000])}\n            wrapper=\"span\"\n            speed={20}\n            repeat={Infinity}\n            style={{\n              color: '#B5D3CE',\n            }}\n          />\n          {/* Screen reader only text */}\n          <Box component=\"span\" sx={visuallyHidden}>\n            {heroTextPhrases.join(', ')}\n          </Box>\n        </Typography>\n      </Box>\n\n      {/* Search */}\n      <Box\n        sx={{\n          pt: { xs: '10px', md: '70px' },\n          pr: '15px',\n          maxWidth: '600px',\n          m: 'auto',\n        }}\n      >\n        <SynapseHomepageChatSearch gotoPlace={gotoPlace} />\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          maxWidth: '1500px',\n          gap: '10px',\n          alignItems: 'center',\n          justifyContent: 'center',\n          mt: '30px',\n          flexWrap: 'wrap',\n          ml: { xs: '5px', md: 'auto' },\n          mr: { xs: '5px', md: 'auto' },\n        }}\n      >\n        {/* Hard-coded popular searches because these Chips are above the fold and immediately visible. Any delay showing these chips is a problem.\n        The hope is that these \"popularSearches\" will not change much over time, since they represent the types of data in the platform.\n        */}\n        <SynapseSearchChips gotoPlace={gotoPlace} />\n      </Box>\n      <Box\n        sx={{\n          backgroundColor: '#F5F9F9',\n          mt: { xs: '50px', md: '100px' },\n        }}\n      >\n        <Box\n          sx={{\n            display: { xs: 'relative', lg: 'grid' },\n            maxWidth: '1500px',\n            gridTemplateColumns: '50% 50%',\n            margin: 'auto',\n            height: { lg: '608px' }, //force container to the same height as the image\n          }}\n        >\n          <Box\n            sx={{\n              p: { xs: '25px', lg: '70px 0px 25px 60px' },\n              svg: {\n                maxWidth: '100%',\n              },\n              display: 'flex',\n              flexDirection: 'column',\n              alignItems: {\n                xs: 'center',\n                md: 'flex-start',\n              },\n            }}\n            ref={ref} // use this UI to trigger loading the rest of the page content\n          >\n            <SageFullLogo width={350} />\n            <Typography\n              variant=\"headline2\"\n              sx={{\n                ...defaultHomepageText,\n                fontSize: {\n                  xs: '24px',\n                  md: '40px',\n                },\n                lineHeight: {\n                  xs: '140%',\n                  md: '60px',\n                },\n                maxWidth: '600px',\n                color: 'secondary.600',\n                mt: '20px',\n                fontWeight: 400,\n                mb: '35px',\n                textAlign: {\n                  xs: 'center',\n                  md: 'left',\n                },\n              }}\n            >\n              Created by <strong>Sage Bionetworks</strong>, Synapse empowers\n              biomedical researchers with tools for open science and\n              collaboration, forging a path to optimal human health.\n            </Typography>\n            <Button\n              size=\"large\"\n              variant=\"contained\"\n              color=\"secondary\"\n              href=\"https://www.sagebionetworks.org\"\n              target=\"_blank\"\n              sx={{\n                p: '5px 25px',\n                width: {\n                  xs: '100%',\n                  md: 'auto',\n                },\n              }}\n            >\n              About Sage Bionetworks\n            </Button>\n          </Box>\n          {isDesktopView && (\n            <Box sx={{ height: '100%', justifySelf: 'end' }}>\n              <img src={image1} alt={''} />\n            </Box>\n          )}\n        </Box>\n      </Box>\n\n      {/* Below the fold content... */}\n      {inView && (\n        <Box>\n          <Box>\n            <Box sx={{ padding: { xs: '45px 40px', md: '80px 25px' } }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...defaultHomepageText,\n                  textAlign: 'center',\n                  mt: '100px',\n                  fontSize: { xs: '32px', md: '40px' },\n                  lineHeight: '42px',\n                  mb: '30px',\n                }}\n              >\n                We partner with scientific leaders\n              </Typography>\n              <Box sx={{ m: 'auto', maxWidth: '750px' }}>\n                <Typography\n                  variant=\"headline1\"\n                  sx={{\n                    ...homepageBodyText,\n                    textAlign: 'center',\n                    mb: '60px',\n                  }}\n                >\n                  Synapse is your ecosystem for responsible data sharing,\n                  innovative data reuse, and collaboration.\n                </Typography>\n              </Box>\n              <SynapsePartners />\n            </Box>\n            <Box\n              sx={{\n                pb: {\n                  xs: '100px',\n                  md: '220px',\n                },\n                clipPath: 'polygon(0 0, 100% 0, 100% 20%, 0% 100%)',\n                backgroundColor: 'white',\n                zIndex: 100,\n              }}\n            />\n            <Box\n              sx={{\n                ...sidePadding,\n                backgroundColor: '#223549',\n                pt: {\n                  xs: '90px',\n                  md: '200px',\n                },\n                mt: {\n                  xs: '-90px',\n                  md: '-200px',\n                },\n                pb: '5px',\n              }}\n            >\n              <Box\n                sx={{\n                  margin: 'auto',\n                  maxWidth: '1500px',\n                }}\n              >\n                <Typography\n                  variant=\"headline1\"\n                  sx={{\n                    ...h2Sx,\n                    textAlign: 'center',\n                    mt: '100px',\n                    mb: '10px',\n                    color: 'white',\n                  }}\n                >\n                  Synapse by the numbers\n                </Typography>\n                <Typography\n                  variant=\"body1\"\n                  sx={{\n                    ...homepageBodyText,\n                    textAlign: 'center',\n                    mb: '70px',\n                    color: 'white',\n                  }}\n                >\n                  <BlinkingLiveIcon sx={{ pt: '7px' }} /> Live\n                </Typography>\n                <SynapseByTheNumbers metricsTable={generalStatsMetricsTable} />\n                <Typography\n                  variant=\"headline2\"\n                  sx={{\n                    ...defaultHomepageText,\n                    textAlign: 'center',\n                    fontSize: '36px',\n                    lineHeight: '40px',\n                    mt: '90px',\n                    mb: '25px',\n                    color: 'white',\n                    fontWeight: 400,\n                  }}\n                >\n                  Projects trending last month\n                </Typography>\n                <SynapseTrendingProjects\n                  past30DaysDownloadMetricsTable={\n                    past30DaysDownloadMetricsTable\n                  }\n                />\n              </Box>\n            </Box>\n            <Box\n              sx={{\n                mt: '-3px',\n                pb: {\n                  xs: '100px',\n                  md: '220px',\n                },\n                clipPath: 'polygon(0 0, 100% 2px, 0 100%, 0% 0%)',\n                backgroundColor: '#223549',\n                zIndex: 100,\n              }}\n            />\n          </Box>\n          <Box sx={{ ml: { xs: '5px', md: '20px' } }}>\n            <Typography\n              variant=\"headline1\"\n              sx={{\n                ...h2Sx,\n                textAlign: 'center',\n                pt: { xs: '45px', md: '75px' },\n                pb: '30px',\n              }}\n            >\n              New &amp; Trending\n            </Typography>\n            <Box sx={{ m: 'auto' }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...homepageBodyText,\n                  textAlign: 'center',\n                  mb: { xs: '30px', md: '60px' },\n                }}\n              >\n                A sample of public projects and datasets recently created on\n                Synapse by researchers like you\n              </Typography>\n            </Box>\n            <Box sx={{ position: 'relative', minHeight: '500px' }}>\n              <FloatingBlobsBackground color1=\"#30b7a8\" color2=\"#296aac\" />\n              <SynapseHotDrops tableId={newAndTrendingTable} />\n            </Box>\n          </Box>\n          <Box\n            sx={{\n              pb: {\n                xs: '100px',\n                md: '220px',\n              },\n              clipPath: 'polygon(0 100%, 100% 0, 100% 100%, 0 100%)',\n              backgroundColor: '#172430',\n              zIndex: 100,\n            }}\n          />\n          <Box\n            sx={{\n              ...sidePadding,\n              backgroundColor: '#172430',\n              mt: '-1px',\n              pt: {\n                xs: '50px',\n                md: '20px',\n              },\n            }}\n          >\n            <Box sx={{ m: 'auto', maxWidth: '1500px' }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...h2Sx,\n                  color: 'white',\n                  maxWidth: '700px',\n                  pb: {\n                    xs: '20px',\n                    sm: '100px',\n                  },\n                  textAlign: {\n                    xs: 'center',\n                    md: 'left',\n                  },\n                }}\n              >\n                Made for biomedical data reuse and discovery\n              </Typography>\n              <SynapseFeatures />\n            </Box>\n          </Box>\n          <Box sx={{ ml: { xs: '5px', md: '20px' } }}>\n            <Typography\n              variant=\"headline1\"\n              sx={{\n                ...h2Sx,\n                textAlign: 'center',\n                padding: { xs: '45px 0', md: '75px 0' },\n              }}\n            >\n              Featured datasets\n            </Typography>\n            <SynapseFeaturedDatasets sourceTable={featuredDatasetsTable} />\n            <Box sx={{ p: '20px 10px' }}>\n              <Button\n                size=\"large\"\n                variant=\"contained\"\n                color=\"secondary\"\n                onClick={() => {\n                  gotoPlace(`/${DATA_CATALOG_PATH_SEGMENT}`)\n                }}\n                sx={{\n                  m: 'auto',\n                  display: 'block',\n                  p: '5px 25px',\n                  width: {\n                    xs: '100%',\n                    md: 'auto',\n                  },\n                }}\n              >\n                View More Datasets\n              </Button>\n            </Box>\n          </Box>\n          <Box\n            sx={{\n              pb: {\n                xs: '100px',\n                md: '220px',\n              },\n              clipPath: 'polygon(0 100%, 100% 0, 100% 100%, 0 100%)',\n              backgroundColor: '#f5f9f9',\n              zIndex: -100,\n              mt: {\n                xs: '-100px',\n                md: '-220px',\n              },\n              position: 'relative',\n            }}\n          />\n          <Box\n            sx={{\n              backgroundColor: '#f5f9f9',\n              pb: { xs: '10px', md: '0px' },\n            }}\n          >\n            <Typography\n              variant=\"headline1\"\n              sx={{\n                ...h2Sx,\n                textAlign: 'center',\n                pt: '75px',\n                position: 'relative',\n                zIndex: 100,\n                backgroundColor: 'rgba(245, 249, 249, .8)',\n                borderRadius: '12px',\n                ml: { xs: '5px', md: '20px' },\n              }}\n            >\n              Synapse in action\n            </Typography>\n            <Box sx={{ m: 'auto', maxWidth: '1100px' }}>\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...homepageBodyText,\n                  textAlign: 'center',\n                  mt: '50px',\n                  mb: '100px',\n                  position: 'relative',\n                  zIndex: 100,\n                  ml: '5px',\n                  mr: '5px',\n                  backgroundColor: 'rgba(245, 249, 249, .8)',\n                  borderRadius: '12px',\n                }}\n              >\n                Explore real-world case studies and success stories showcasing\n                how researchers use Synapse to drive innovative biomedical\n                discoveries and improve health outcomes.\n              </Typography>\n            </Box>\n            <SynapseInAction tableId={synapseInActionTable} />\n          </Box>\n          <Box\n            sx={{\n              ...sidePadding,\n              backgroundColor: '#223549',\n              pb: '200px',\n              position: 'relative',\n              zIndex: 100,\n            }}\n          >\n            <Box\n              sx={{\n                maxWidth: '1200px',\n                m: 'auto',\n              }}\n            >\n              <Typography\n                variant=\"headline1\"\n                sx={{\n                  ...h2Sx,\n                  color: 'white',\n                  pt: '75px',\n                }}\n              >\n                Plans\n              </Typography>\n              <Typography\n                variant=\"body1\"\n                sx={{\n                  ...homepageBodyText,\n                  color: 'white',\n                  pt: '20px',\n                }}\n              >\n                Synapse is free and open source for all. We offer different\n                plans to help you if you need extra storage or help with your\n                data management.\n              </Typography>\n              <Link\n                href={SAGE_OFFERINGS_HELP_URL}\n                target=\"_blank\"\n                sx={{\n                  color: 'white !important',\n                  textDecorationColor: 'white !important',\n                  pt: '20px',\n                  pb: '30px',\n                  display: 'block',\n                }}\n              >\n                Learn more about our plans\n              </Link>\n              <SynapsePlans />\n            </Box>\n          </Box>\n          <Box\n            sx={{\n              pb: {\n                xs: '100px',\n                md: '220px',\n              },\n              clipPath: 'polygon(0 100%, 100% 0, 100% 100%, 0 100%)',\n              backgroundColor: '#172430',\n              zIndex: 101,\n              mt: {\n                xs: '-100px',\n                md: '-220px',\n              },\n              position: 'relative',\n            }}\n          />\n        </Box>\n      )}\n    </Box>\n  )\n}\n\nexport default SynapseHomepageV2\n"],"mappings":"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"}

package/dist/components/SynapseHomepageV2/SynapseHotdrops.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseHotdrops.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHotdrops.tsx"],"sourcesContent":["import {\n  useGetEntityHeaders,\n  useGetQueryResultBundleWithAsyncStatus,\n} from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport { Box } from '@mui/material'\nimport { SynapseHotDropItem } from './SynapseHotdropsItem'\nimport { ReferenceList } from '@sage-bionetworks/synapse-types'\nimport styles from './HotdropsAndNews.module.scss'\n\nexport type SynapseHotDropsProps = {\n  tableId: string\n}\n\nexport function SynapseHotDrops({ tableId }: SynapseHotDropsProps) {\n  const { data } = useGetQueryResultBundleWithAsyncStatus({\n    entityId: tableId,\n    query: {\n      sql: `SELECT entity_id FROM ${tableId}`,\n      limit: 10,\n      sort: [{ column: 'created_on', direction: 'DESC' }],\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n  const rowSet = data?.responseBody?.queryResult?.queryResults\n\n  const references: ReferenceList = rowSet\n    ? rowSet.rows.map(row => ({\n        targetId: row.values[0]!,\n      }))\n    : []\n  const { data: entityHeaders } = useGetEntityHeaders(references, {\n    enabled: references?.length > 0,\n  })\n  if (!entityHeaders) {\n    return <></>\n  }\n\n  return (\n    <>\n      <Box className={styles.container} sx={{ color: 'primary.100' }}>\n        {entityHeaders.results.map(entityHeader => (\n          <SynapseHotDropItem\n            key={entityHeader.id}\n            entityHeader={entityHeader}\n          />\n        ))}\n      </Box>\n    </>\n  )\n}\n"],"mappings":";;;;;;;;;AAcA,SAAgB,EAAgB,EAAE,cAAiC;CACjE,IAAM,EAAE,YAAS,EAAuC;EACtD,UAAU;EACV,OAAO;GACL,KAAK,yBAAyB;GAC9B,OAAO;GACP,MAAM,CAAC;IAAE,QAAQ;IAAc,WAAW;IAAQ,CAAC;GACpD;EACD,UAAA;EACA,cAAc;EACf,CAAC,EACI,IAAS,GAAM,cAAc,aAAa,cAE1C,IAA4B,IAC9B,EAAO,KAAK,KAAI,OAAQ,EACtB,UAAU,EAAI,OAAO,IACtB,EAAE,GACH,EAAE,EACA,EAAE,MAAM,MAAkB,EAAoB,GAAY,EAC9D,SAAS,GAAY,SAAS,GAC/B,CAAC;AAKF,QAJK,IAKH,kBAAA,GAAA,EAAA,UACE,kBAAC,GAAD;EAAK,WAAW,EAAO;EAAW,IAAI,EAAE,OAAO,eAAe;YAC3D,EAAc,QAAQ,KAAI,MACzB,kBAAC,GAAD,EAEgB,iBACd,EAFK,EAAa,GAElB,CACF;EACE,CAAA,EACL,CAAA,GAbI,kBAAA,GAAA,EAAK,CAAA"}
+{"version":3,"file":"SynapseHotdrops.js","names":[],"sources":["../../../src/components/SynapseHomepageV2/SynapseHotdrops.tsx"],"sourcesContent":["import {\n  useGetEntityHeaders,\n  useGetQueryResultBundleWithAsyncStatus,\n} from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport { Box } from '@mui/material'\nimport { SynapseHotDropItem } from './SynapseHotdropsItem'\nimport { ReferenceList } from '@sage-bionetworks/synapse-types'\nimport styles from './HotdropsAndNews.module.scss'\n\nexport type SynapseHotDropsProps = {\n  tableId: string\n}\n\nexport function SynapseHotDrops({ tableId }: SynapseHotDropsProps) {\n  const { data } = useGetQueryResultBundleWithAsyncStatus({\n    entityId: tableId,\n    query: {\n      sql: `SELECT entity_id FROM ${tableId}`,\n      limit: 10,\n      sort: [{ column: 'created_on', direction: 'DESC' }],\n    },\n    partMask: BUNDLE_MASK_QUERY_RESULTS,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n  })\n  const rowSet = data?.responseBody?.queryResult?.queryResults\n\n  const references: ReferenceList = rowSet\n    ? rowSet.rows.map(row => ({\n        targetId: row.values[0]!,\n      }))\n    : []\n  const { data: entityHeaders } = useGetEntityHeaders(references, {\n    enabled: references?.length > 0,\n  })\n  if (!entityHeaders) {\n    return <></>\n  }\n\n  return (\n    <>\n      <Box className={styles.container} sx={{ color: 'primary.100' }}>\n        {entityHeaders.results.map(entityHeader => (\n          <SynapseHotDropItem\n            key={entityHeader.id}\n            entityHeader={entityHeader}\n          />\n        ))}\n      </Box>\n    </>\n  )\n}\n"],"mappings":";;;;;;;;;AAcA,SAAgB,EAAgB,EAAE,cAAiC;CACjE,IAAM,EAAE,YAAS,EAAuC;EACtD,UAAU;EACV,OAAO;GACL,KAAK,yBAAyB;GAC9B,OAAO;GACP,MAAM,CAAC;IAAE,QAAQ;IAAc,WAAW;GAAO,CAAC;EACpD;EACA,UAAA;EACA,cAAc;CAChB,CAAC,GACK,IAAS,GAAM,cAAc,aAAa,cAE1C,IAA4B,IAC9B,EAAO,KAAK,KAAI,OAAQ,EACtB,UAAU,EAAI,OAAO,GACvB,EAAE,IACF,CAAC,GACC,EAAE,MAAM,MAAkB,EAAoB,GAAY,EAC9D,SAAS,GAAY,SAAS,EAChC,CAAC;CAKD,OAJK,IAKH,kBAAA,GAAA,EAAA,UACE,kBAAC,GAAD;EAAK,WAAW,EAAO;EAAW,IAAI,EAAE,OAAO,cAAc;YAC1D,EAAc,QAAQ,KAAI,MACzB,kBAAC,GAAD,EAEgB,gBACf,GAFM,EAAa,EAEnB,CACF;CACE,CAAA,EACL,CAAA,IAbK,kBAAA,GAAA,CAAI,CAAA;AAef"}