use APIs

italia · Jul 29, 2024 · 37f5cae · 37f5cae
1 parent f14352f
commit 37f5cae
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 30 deletions.
diff --git a/_layouts/software-details.html b/_layouts/software-details.html
@@ -429,7 +429,7 @@ <h2>
               <div class="col-7 col-sm-7 col-md-3">
                 <p>
                   <span class="label">Stato publiccode.yml</span>
-                  <publiccode-badge repo="{{ page.publiccode.url | escape }}"></publiccode-badge>
+                  <publiccode-badge id="{{ page.id }}"></publiccode-badge>
                 <p>
               </div>
 

diff --git a/assets/js/components/PubliccodeBadge.js b/assets/js/components/PubliccodeBadge.js
@@ -1,5 +1,4 @@
 import React, { useEffect, useState } from 'react';
-import { createUseStyles } from 'react-jss';
 import PropTypes from 'prop-types';
 
 import { Spinner } from './Spinner';
@@ -10,46 +9,30 @@ const stateClass = {
   'error': 'danger',
 };
 
-const useStyle = createUseStyles({
-  placeholder: {
-    height: '100%',
-    width: '100%',
-    marginLeft: 0,
-    objectFit: 'contain',
-  },
-  badge: {
-    // extend: 'placeholder',
-    display: (publiccodeState) => (publiccodeState !== 'loading' ? 'block' : 'none'),
-  },
-});
-
-export const PubliccodeBadge = React.memo(({ repo }) => {
+export const PubliccodeBadge = React.memo(({ id }) => {
   const [publiccodeState, setPubliccodeState] = useState('loading');
 
-  const classes = useStyle(publiccodeState)
-
   useEffect(async () => {
     const res = await fetch(logUrl);
 
     if (res.status >= 200 || res.status <= 299) {
       const data = await res.json();
-      const good = data.find(entry => entry?.message?.includes('activity index in the last'));
+      const good = data[0]?.message.includes('GOOD publiccode.yml');
 
       setPubliccodeState(good ? 'good' : 'error');
     } else {
       setPubliccodeState('error');
     }
-  });
+  }, [logUrl]);
 
-  const repoPath = repo.replaceAll(/^(.+):\/\/|.git$/ig, '');
-  const logUrl = `https://crawler.developers.italia.it/${repoPath}/log.json`
+  const logUrl = `https://api.developers.italia.it/v1/software/${id}/logs`
 
   return (
     <>
       <div className="lead">
+        {publiccodeState !== 'loading' && <Spinner />}
         <span className={`badge badge-${stateClass[publiccodeState]}`}>
-          {publiccodeState === 'loading' && <Spinner />}
-          {publiccodeState !== 'loading' && publiccodeState }
+          {publiccodeState === 'loading' && publiccodeState}
         </span>
       </div>
 
@@ -59,14 +42,14 @@ export const PubliccodeBadge = React.memo(({ repo }) => {
         target="_blank"
         aria-label="Log file of the latest publiccode.yml crawling"
       >
-        (JSON log)
+        (log)
       </a>
     </>
   );
 });
 
 PubliccodeBadge.propTypes = {
-  repo: PropTypes.string.isRequired,
+  id: PropTypes.string.isRequired,
 };
 
 PubliccodeBadge.displayName = 'PubliccodeBadge';
diff --git a/assets/js/components/Spinner.css b/assets/js/components/Spinner.css
@@ -3,14 +3,15 @@
   position: relative;
   width: 80px;
   height: 80px;
+  margin-bottom: 1rem;
 }
 .lds-ellipsis div {
   position: absolute;
-  top: 33px;
-  width: 13px;
-  height: 13px;
+  width: 6px;
+  height: 6px;
   border-radius: 50%;
-  background: #fff;
+  background: gray;
+  top: 0.5rem;
   animation-timing-function: cubic-bezier(0, 1, 1, 0);
 }
 .lds-ellipsis div:nth-child(1) {