eec158b32c
This change adds a single page application front-end to GARM. It uses a generated REST client, built from the swagger definitions, the websocket interface for live updates of entities and eager loading of everything except runners, as users may have many runners and we don't want to load hundreds of runners in memory. Proper pagination should be implemented in the API, in future commits, to avoid loading lots of elements for no reason. Signed-off-by: Gabriel Adrian Samfira <gsamfira@cloudbasesolutions.com>
1 line
9.2 KiB
JavaScript
1 line
9.2 KiB
JavaScript
import{I as p,J as l}from"./D8EpLgQ1.js";import{g as d}from"./CiE1LlKV.js";import{w as r}from"./u94nIB4-.js";const f={repositories:[],organizations:[],enterprises:[],pools:[],scalesets:[],credentials:[],endpoints:[],controllerInfo:null,loading:{repositories:!1,organizations:!1,enterprises:!1,pools:!1,scalesets:!1,credentials:!1,endpoints:!1,controllerInfo:!1},loaded:{repositories:!1,organizations:!1,enterprises:!1,pools:!1,scalesets:!1,credentials:!1,endpoints:!1,controllerInfo:!1},errorMessages:{repositories:"",organizations:"",enterprises:"",pools:"",scalesets:"",credentials:"",endpoints:"",controllerInfo:""}},a=p(f);class u{unsubscribers=[];loadingPromises=new Map;retryAttempts=new Map;MAX_RETRIES=3;RETRY_DELAY_MS=1e3;websocketStatusUnsubscriber=null;async loadResource(e,t=!1){if(this.loadingPromises.has(e))return this.loadingPromises.get(e);a.update(o=>({...o,loading:{...o.loading,[e]:!0},errorMessages:{...o.errorMessages,[e]:""}}));const s=this.attemptLoad(e);this.loadingPromises.set(e,s);try{const o=await s;return a.update(n=>({...n,[e]:o,loading:{...n.loading,[e]:!1},loaded:{...n.loaded,[e]:!0},errorMessages:{...n.errorMessages,[e]:""}})),this.retryAttempts.delete(e),t&&this.startBackgroundLoading(e),o}catch(o){const n=o instanceof Error?o.message:"Failed to load data";throw a.update(i=>({...i,loading:{...i.loading,[e]:!1},errorMessages:{...i.errorMessages,[e]:n}})),console.error(`Failed to load ${e}:`,o),o}finally{this.loadingPromises.delete(e)}}async attemptLoad(e){const t=(this.retryAttempts.get(e)||0)+1;this.retryAttempts.set(e,t);try{let s;switch(e){case"repositories":s=d.listRepositories();break;case"organizations":s=d.listOrganizations();break;case"enterprises":s=d.listEnterprises();break;case"pools":s=d.listAllPools();break;case"scalesets":s=d.listScaleSets();break;case"credentials":s=d.listAllCredentials();break;case"endpoints":s=d.listAllEndpoints();break;case"controllerInfo":s=d.getControllerInfo();break;default:throw new Error(`Unknown resource type: ${e}`)}return await s}catch(s){if(t<this.MAX_RETRIES){const o=this.RETRY_DELAY_MS*Math.pow(2,t-1);return console.warn(`Attempt ${t} failed for ${e}, retrying in ${o}ms...`,s),await new Promise(n=>setTimeout(n,o)),this.attemptLoad(e)}else throw console.error(`All ${this.MAX_RETRIES} attempts failed for ${e}:`,s),s}}async startBackgroundLoading(e){const s=["repositories","organizations","enterprises","pools","scalesets","credentials","endpoints"].filter(o=>o!==e);for(const o of s)setTimeout(()=>{this.loadResource(o,!1).catch(n=>{console.warn(`Background loading failed for ${o}:`,n)})},100*s.indexOf(o))}retryResource(e){return this.retryAttempts.delete(e),this.loadResource(e,!0)}setupWebSocketSubscriptions(){this.cleanup();const e=[r.subscribeToEntity("repository",["create","update","delete"],this.handleRepositoryEvent.bind(this)),r.subscribeToEntity("organization",["create","update","delete"],this.handleOrganizationEvent.bind(this)),r.subscribeToEntity("enterprise",["create","update","delete"],this.handleEnterpriseEvent.bind(this)),r.subscribeToEntity("pool",["create","update","delete"],this.handlePoolEvent.bind(this)),r.subscribeToEntity("scaleset",["create","update","delete"],this.handleScaleSetEvent.bind(this)),r.subscribeToEntity("controller",["update"],this.handleControllerEvent.bind(this)),r.subscribeToEntity("github_credentials",["create","update","delete"],this.handleCredentialsEvent.bind(this)),r.subscribeToEntity("gitea_credentials",["create","update","delete"],this.handleCredentialsEvent.bind(this)),r.subscribeToEntity("github_endpoint",["create","update","delete"],this.handleEndpointEvent.bind(this))];this.unsubscribers=e,this.setupWebSocketStatusMonitoring()}setupWebSocketStatusMonitoring(){this.websocketStatusUnsubscriber&&this.websocketStatusUnsubscriber();let e=!1;this.websocketStatusUnsubscriber=r.subscribe(t=>{t.connected&&!e&&(console.log("[EagerCache] WebSocket connected - reinitializing cache"),this.initializeAllResources()),e=t.connected})}async initializeAllResources(){const t=["repositories","organizations","enterprises","pools","scalesets","credentials","endpoints","controllerInfo"].map(s=>this.loadResource(s,!0).catch(o=>{console.warn(`Failed to reload ${s} on WebSocket reconnect:`,o)}));await Promise.allSettled(t)}handleRepositoryEvent(e){a.update(t=>{if(!t.loaded.repositories)return t;const s=[...t.repositories],o=e.payload;if(e.operation==="create")s.push(o);else if(e.operation==="update"){const n=s.findIndex(i=>i.id===o.id);n!==-1&&(s[n]=o)}else if(e.operation==="delete"){const n=typeof o=="object"?o.id:o,i=s.findIndex(c=>c.id===n);i!==-1&&s.splice(i,1)}return{...t,repositories:s}})}handleOrganizationEvent(e){a.update(t=>{if(!t.loaded.organizations)return t;const s=[...t.organizations],o=e.payload;if(e.operation==="create")s.push(o);else if(e.operation==="update"){const n=s.findIndex(i=>i.id===o.id);n!==-1&&(s[n]=o)}else if(e.operation==="delete"){const n=typeof o=="object"?o.id:o,i=s.findIndex(c=>c.id===n);i!==-1&&s.splice(i,1)}return{...t,organizations:s}})}handleEnterpriseEvent(e){a.update(t=>{if(!t.loaded.enterprises)return t;const s=[...t.enterprises],o=e.payload;if(e.operation==="create")s.push(o);else if(e.operation==="update"){const n=s.findIndex(i=>i.id===o.id);n!==-1&&(s[n]=o)}else if(e.operation==="delete"){const n=typeof o=="object"?o.id:o,i=s.findIndex(c=>c.id===n);i!==-1&&s.splice(i,1)}return{...t,enterprises:s}})}handlePoolEvent(e){a.update(t=>{if(!t.loaded.pools)return t;const s=[...t.pools],o=e.payload;if(e.operation==="create")s.push(o);else if(e.operation==="update"){const n=s.findIndex(i=>i.id===o.id);n!==-1&&(s[n]=o)}else if(e.operation==="delete"){const n=typeof o=="object"?o.id:o,i=s.findIndex(c=>c.id===n);i!==-1&&s.splice(i,1)}return{...t,pools:s}})}handleScaleSetEvent(e){a.update(t=>{if(!t.loaded.scalesets)return t;const s=[...t.scalesets],o=e.payload;if(e.operation==="create")s.push(o);else if(e.operation==="update"){const n=s.findIndex(i=>i.id===o.id);n!==-1&&(s[n]=o)}else if(e.operation==="delete"){const n=typeof o=="object"?o.id:o,i=s.findIndex(c=>c.id===n);i!==-1&&s.splice(i,1)}return{...t,scalesets:s}})}handleCredentialsEvent(e){a.update(t=>{if(!t.loaded.credentials)return t;const s=[...t.credentials],o=e.payload;if(e.operation==="create")s.push(o);else if(e.operation==="update"){const n=s.findIndex(i=>i.id===o.id);n!==-1&&(s[n]=o)}else if(e.operation==="delete"){const n=typeof o=="object"?o.id:o,i=s.findIndex(c=>c.id===n);i!==-1&&s.splice(i,1)}return{...t,credentials:s}})}handleEndpointEvent(e){a.update(t=>{if(!t.loaded.endpoints)return t;const s=[...t.endpoints],o=e.payload;if(e.operation==="create")s.push(o);else if(e.operation==="update"){const n=s.findIndex(i=>i.name===o.name);n!==-1&&(s[n]=o)}else if(e.operation==="delete"){const n=typeof o=="object"?o.name:o,i=s.findIndex(c=>c.name===n);i!==-1&&s.splice(i,1)}return{...t,endpoints:s}})}cleanup(){this.unsubscribers.forEach(e=>e()),this.unsubscribers=[],this.websocketStatusUnsubscriber&&(this.websocketStatusUnsubscriber(),this.websocketStatusUnsubscriber=null)}shouldUseCache(){return l(r).connected}async getRepositories(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching repositories directly from API"),await d.listRepositories();const t=l(a);return t.loaded.repositories?t.repositories:this.loadResource("repositories",!0)}async getOrganizations(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching organizations directly from API"),await d.listOrganizations();const t=l(a);return t.loaded.organizations?t.organizations:this.loadResource("organizations",!0)}async getEnterprises(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching enterprises directly from API"),await d.listEnterprises();const t=l(a);return t.loaded.enterprises?t.enterprises:this.loadResource("enterprises",!0)}async getPools(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching pools directly from API"),await d.listAllPools();const t=l(a);return t.loaded.pools?t.pools:this.loadResource("pools",!0)}async getScaleSets(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching scalesets directly from API"),await d.listScaleSets();const t=l(a);return t.loaded.scalesets?t.scalesets:this.loadResource("scalesets",!0)}async getCredentials(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching credentials directly from API"),await d.listAllCredentials();const t=l(a);return t.loaded.credentials?t.credentials:this.loadResource("credentials",!0)}async getEndpoints(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching endpoints directly from API"),await d.listAllEndpoints();const t=l(a);return t.loaded.endpoints?t.endpoints:this.loadResource("endpoints",!0)}async getControllerInfo(){if(!l(r).connected)return console.log("[EagerCache] WebSocket disconnected - fetching controller info directly from API"),await d.getControllerInfo();const t=l(a);return t.loaded.controllerInfo?t.controllerInfo:this.loadResource("controllerInfo",!0)}handleControllerEvent(e){a.update(t=>{if(!t.loaded.controllerInfo)return t;const s=e.payload;return e.operation==="update"?{...t,controllerInfo:s}:t})}}const h=new u;typeof window<"u"&&h.setupWebSocketSubscriptions();export{h as a,a as e};
|