Skip to content

Commit

Permalink
Merge pull request #56 from natrontech/code-tab
Browse files Browse the repository at this point in the history 
fix: bug of going to shell
  • Loading branch information
@janlauber
janlauber authored Nov 7, 2023
2 parents fb20f11 + b28a0e6 commit 40912fc
Showing 1 changed file with 66 additions and 62 deletions.
128 changes: 66 additions & 62 deletions kubelab-ui/src/lib/components/labs/Lab.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,8 @@
export let this_exercises: ExercisesResponse[] = $sidebar_exercises || [];
export let this_exercise_sessions: ExerciseSessionsResponse[] = $sidebar_exercise_sessions || [];
$: console.log(this_lab_session);
function getDoneExercises() {
let done_exercises: ExercisesResponse[] = [];
// each exercise_session which has an endTimestamp is done
Expand Down Expand Up @@ -54,72 +56,74 @@
export let drawerHidden = true;
</script>

{#key this_lab_session}
<div class="rounded-xl relative bg-white dark:bg-transparent dark:border-2 ">
<div class="flex items-center gap-x-4 border-b-2 p-6">
<div class="text-lg font-bold leading-6">{this_lab.title}</div>
<div class="relative ml-auto">
<button class="btn btn-outline" on:click={() => handleSideBar()}>
<Inspect />
</button>
{#if this_lab_session}
{#key this_lab_session}
<div class="rounded-xl relative bg-white dark:bg-transparent dark:border-2 ">
<div class="flex items-center gap-x-4 border-b-2 p-6">
<div class="text-lg font-bold leading-6">{this_lab.title}</div>
<div class="relative ml-auto">
<button class="btn btn-outline" on:click={() => handleSideBar()}>
<Inspect />
</button>

{#if this_lab_session.clusterRunning}
<span class="absolute flex h-4 w-4 -top-1 -right-1">
<span
class="animate-ping absolute inline-flex h-full w-full rounded-full bg-success opacity-75"
/>
<span class="relative inline-flex rounded-full h-4 w-4 bg-success" />
</span>
{/if}
</div>
</div>
<dl class="-my-3 divide-y divide-gray-100 px-6 py-4 text-sm leading-6">
<div class="flex justify-between gap-x-4 py-3">
<dt class="">Status</dt>
<dd class="badge badge-outline {this_lab_session.clusterRunning ? 'badge-success' : ''}">
{#if this_lab_session.clusterRunning}
<Play class="w-4 h-4 mr-1 inline-block" />
{:else}
<Pause class="w-4 h-4 mr-1 inline-block" />
<span class="absolute flex h-4 w-4 -top-1 -right-1">
<span
class="animate-ping absolute inline-flex h-full w-full rounded-full bg-success opacity-75"
/>
<span class="relative inline-flex rounded-full h-4 w-4 bg-success" />
</span>
{/if}
{this_lab_session.clusterRunning ? "Running" : "Stopped"}
</dd>
</div>
</div>
<div class="flex justify-between gap-x-4 py-3">
<dt class="">Time</dt>
<dd class={this_lab_session.clusterRunning ? "text-success" : "text-gray-400"}>
<span class="ml-1 text-xs text-primary">
{#if this_lab_session.clusterRunning && this_lab_session.startTime}
since
{getTimeAgo(this_lab_session.startTime)}
{:else if this_lab_session.endTime && !this_lab_session.clusterRunning}
{getTimeAgo(this_lab_session.endTime)}
ago
<dl class="-my-3 divide-y divide-gray-100 px-6 py-4 text-sm leading-6">
<div class="flex justify-between gap-x-4 py-3">
<dt class="">Status</dt>
<dd class="badge badge-outline {this_lab_session.clusterRunning ? 'badge-success' : ''}">
{#if this_lab_session.clusterRunning}
<Play class="w-4 h-4 mr-1 inline-block" />
{:else}
<Pause class="w-4 h-4 mr-1 inline-block" />
{/if}
</span>
</dd>
</div>
<div class="flex justify-between gap-x-4 py-3">
<dt class="">Done Exercises</dt>
<dd class="flex items-start gap-x-2">
{#if getDoneExercises().length == this_exercises.length}
<div class="text-success">
<CheckCircle />
</div>
{:else}
<div class="text-red-500">
<XCircle />
</div>
{/if}
<div
class="font-medium
{this_lab_session.clusterRunning ? "Running" : "Stopped"}
</dd>
</div>
<div class="flex justify-between gap-x-4 py-3">
<dt class="">Time</dt>
<dd class={this_lab_session.clusterRunning ? "text-success" : "text-gray-400"}>
<span class="ml-1 text-xs text-primary">
{#if this_lab_session.clusterRunning && this_lab_session.startTime}
since
{getTimeAgo(this_lab_session.startTime)}
{:else if this_lab_session.endTime && !this_lab_session.clusterRunning}
{getTimeAgo(this_lab_session.endTime)}
ago
{/if}
</span>
</dd>
</div>
<div class="flex justify-between gap-x-4 py-3">
<dt class="">Done Exercises</dt>
<dd class="flex items-start gap-x-2">
{#if getDoneExercises().length == this_exercises.length}
<div class="text-success">
<CheckCircle />
</div>
{:else}
<div class="text-red-500">
<XCircle />
</div>
{/if}
<div
class="font-medium
{getDoneExercises().length == this_exercises.length ? 'text-success' : 'text-red-500'}
"
>
{getDoneExercises().length} / {this_exercises.length}
</div>
</dd>
</div>
</dl>
</div>
{/key}
>
{getDoneExercises().length} / {this_exercises.length}
</div>
</dd>
</div>
</dl>
</div>
{/key}
{/if}

0 comments on commit 40912fc

Please sign in to comment.