Skip to content

Commit

Permalink
Merge pull request #381 from Steinbeck-Lab/fix-molecule-timeline
Browse files Browse the repository at this point in the history 
Fix molecule timeline
  • Loading branch information
@CS76
CS76 authored Feb 7, 2025
2 parents e8bc93b + 323efd9 commit 843f332
Show file tree
Hide file tree
Showing 2 changed files with 162 additions and 93 deletions.
15 changes: 12 additions & 3 deletions app/Livewire/MoleculeHistoryTimeline.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,9 +32,18 @@ public function getHistory()
$audit_data[$index]['affected_columns'][$affected_column]['new_value'] = $audit->new_values ? array_values($audit->new_values)[0] : null;
} else {
foreach ($audit->getModified() as $affected_column => $value) {

$audit_data[$index]['affected_columns'][$affected_column]['old_value'] = array_key_exists('old', $value) ? $value['old'] : null;
$audit_data[$index]['affected_columns'][$affected_column]['new_value'] = array_key_exists('new', $value) ? $value['new'] : null;
// Pre-process IUPAC names with italic conversion
if ($affected_column === 'iupac_name') {
$audit_data[$index]['affected_columns'][$affected_column]['old_value'] =
array_key_exists('old', $value) ? convert_italics_notation($value['old']) : null;
$audit_data[$index]['affected_columns'][$affected_column]['new_value'] =
array_key_exists('new', $value) ? convert_italics_notation($value['new']) : null;
} else {
$audit_data[$index]['affected_columns'][$affected_column]['old_value'] =
array_key_exists('old', $value) ? $value['old'] : null;
$audit_data[$index]['affected_columns'][$affected_column]['new_value'] =
array_key_exists('new', $value) ? $value['new'] : null;
}
}
}
}
Expand Down
240 changes: 150 additions & 90 deletions resources/views/livewire/molecule-history-timeline.blade.php
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
<!-- molecule-history-timeline.blade.php -->
<div x-data="{ on: false, event: '', column : '', drawerOpen: false, drawerContent: '' }" x-effect="on && $wire.getHistory()" class="mt-5">
<button type="button" x-on:click="on = !on" class="text-base font-semibold text-text-dark hover:text-slate-600" wire:transition="fade">
<span x-show="!on">View complete history →</span>
Expand Down Expand Up @@ -40,102 +41,161 @@
@switch(explode('.',$column_name)[0])
@case('comment')
{{$column_values['new_value'][0]['comment'] ?? 'N/A'}}
@break
@case('active')
@if ($column_values['new_value'])
Activated
@else
Deactivated
@endif
@break
@case('created')
Initial creation of the compound on COCONUT
@break
@case('organisms')
@case('sampleLocations')
@if ($column_values['old_value'])
<span class="font-bold">Detached from:</span> <br /> {{$column_values['old_value']?:'N/A'}} <br />
@endif
@if ($column_values['new_value'])
<span class="font-bold">Attached to:</span> <br /> {{$column_values['new_value']?:'N/A'}} <br />
@endif
@break
@case('synonyms')
@if (array_diff($column_values['old_value'], $column_values['new_value']))
<span class="font-bold">Removed: </span> <br /> {{implode(', ',array_diff($column_values['old_value'], $column_values['new_value']))}} <br />
@endif
@if (array_diff($column_values['new_value'], $column_values['old_value']))
<span class="font-bold">Added: </span> <br /> {{implode(', ',array_diff($column_values['new_value'], $column_values['old_value']))}} <br />
@endif
@break
@case('cas')
@if (array_diff($column_values['old_value'], $column_values['new_value']))
<span class="font-bold">Removed: </span> <br /> {{implode(', ',array_diff($column_values['old_value'], $column_values['new_value']))}} <br />
@endif
@if (array_diff($column_values['new_value'], $column_values['old_value']))
<span class="font-bold">Added: </span> <br /> {{implode(', ',array_diff($column_values['new_value'], $column_values['old_value']))}} <br />
@endif
@break
@case('citations')
@if ($column_values['old_value'])
<span class="font-bold">Detached from:</span> <br /> {{$column_values['old_value']?:'N/A'}} <br />
@endif
@if ($column_values['new_value'])
<span class="font-bold">Attached to:</span> <br /> {{$column_values['new_value']?:'N/A'}} <br />
@endif
@break
@default
Old Value: <br /> {{$column_values['old_value']??'N/A'}} <br />
New Value: <br /> {{$column_values['new_value']??'N/A'}}
@endswitch
</span>
</div> --}}
</div>
@break
@case('active')
@if ($column_values['new_value'])
Activated
@else
Deactivated
@endif
@break
@case('created')
Initial creation of the compound on COCONUT
@break
@case('organisms')
@case('sampleLocations')
@if ($column_values['old_value'])
<span class="font-bold">Detached from:</span> <br /> {{$column_values['old_value']?:'N/A'}} <br />
@endif
@if ($column_values['new_value'])
<span class="font-bold">Attached to:</span> <br /> {{$column_values['new_value']?:'N/A'}} <br />
@endif
@break
@case('synonyms')
@if (array_diff($column_values['old_value'], $column_values['new_value']))
<span class="font-bold">Removed: </span> <br /> {{implode(', ',array_diff($column_values['old_value'], $column_values['new_value']))}} <br />
@endif
@if (array_diff($column_values['new_value'], $column_values['old_value']))
<span class="font-bold">Added: </span> <br /> {{implode(', ',array_diff($column_values['new_value'], $column_values['old_value']))}} <br />
@endif
@break
@case('cas')
@if (array_diff($column_values['old_value'], $column_values['new_value']))
<span class="font-bold">Removed: </span> <br /> {{implode(', ',array_diff($column_values['old_value'], $column_values['new_value']))}} <br />
@endif
@if (array_diff($column_values['new_value'], $column_values['old_value']))
<span class="font-bold">Added: </span> <br /> {{implode(', ',array_diff($column_values['new_value'], $column_values['old_value']))}} <br />
@endif
@break
@case('citations')
@if ($column_values['old_value'])
<span class="font-bold">Detached from:</span> <br /> {{$column_values['old_value']?:'N/A'}} <br />
@endif
@if ($column_values['new_value'])
<span class="font-bold">Attached to:</span> <br /> {{$column_values['new_value']?:'N/A'}} <br />
@endif
@break
@default
Old Value: <br /> {{$column_values['old_value']??'N/A'}} <br />
New Value: <br /> {{$column_values['new_value']??'N/A'}}
@endswitch
</span>
</div> --}}
</div>
@endforeach
</div>
</li>
@endif
@endforeach
</ul>
@endforeach
</div>
</li>
@endif
@endforeach
</ul>
</div>
<div x-show="drawerOpen" class="fixed inset-0 z-50 flex">
<!-- Overlay -->
<div class="fixed inset-0 bg-gray-600 bg-opacity-75" x-on:click="drawerOpen = false"></div>
<!-- Drawer panel -->
<div class="relative bg-white w-full max-w-md ml-auto shadow-xl transform transition-all">
<div class="flex justify-between items-center p-4 border-b">
<h2 class="text-lg font-medium text-gray-900 capitalize" x-text='event'></h2>
<button x-on:click="drawerOpen = false" class="text-gray-400 hover:text-gray-500 focus:ring-2 focus:ring-indigo-500 focus:outline-none">
<span class="sr-only">Close panel</span>
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path>
</svg>
</button>
</div>
<div>
<template x-if="drawerContent">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
</div>
<div x-show="drawerOpen" class="fixed inset-0 z-50 flex">
<!-- Overlay -->
<div class="fixed inset-0 bg-gray-600 bg-opacity-75" x-on:click="drawerOpen = false"></div>
<!-- Drawer panel -->
<div class="relative bg-white w-full max-w-md ml-auto shadow-xl transform transition-all">
<div class="flex justify-between items-center p-4 border-b">
<h2 class="text-lg font-medium text-gray-900 capitalize" x-text='event'></h2>
<button x-on:click="drawerOpen = false" class="text-gray-400 hover:text-gray-500 focus:ring-2 focus:ring-indigo-500 focus:outline-none">
<span class="sr-only">Close panel</span>
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path>
</svg>
</button>
</div>
<div>
<template x-if="drawerContent">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th scope="col" class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Column Name</th>
<th scope="col" class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Old Value</th>
<th scope="col" class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">New Value</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<template x-for="(value, key) in [JSON.parse(drawerContent)]">
<tr>
<th scope="col" class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Column Name</th>
<th scope="col" class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Old Value</th>
<th scope="col" class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">New Value</th>
<td class="px-4 py-2 text-sm text-gray-900" x-text="column"></td>
<td class="px-4 py-2 text-sm text-gray-500 ">
<template x-if="column.startsWith('comment')">
<span x-text="value.old_value?.[0]?.comment || 'N/A'"></span>
</template>
<template x-if="column.startsWith('active')">
<span x-text="value.old_value ? 'Activated' : 'Deactivated'"></span>
</template>
<template x-if="column === 'iupac_name'">
<span x-html="value.old_value || 'N/A'"></span>
</template>
<template x-if="column.startsWith('created')">
<span>N/A</span>
</template>
<template x-if="['organisms', 'sampleLocations', 'citations'].includes(column.split('.')[0])">
<span x-text="value.old_value ? `Detached from: ${value.old_value}` : 'N/A'"></span>
</template>
<template x-if="['synonyms', 'cas'].includes(column.split('.')[0])">
<span x-text="value.old_value ? value.old_value.join(', ') : 'N/A'"></span>
</template>
<template x-if="!['comment', 'active', 'created', 'organisms', 'sampleLocations', 'citations', 'synonyms', 'cas', 'iupac_name]
.includes(column.split('.')[0])">
<span x-text="value.old_value || 'N/A'"></span>
</template>
</td>
<td class="px-4 py-2 text-sm text-gray-500">
<template x-if="column.startsWith('comment')">
<span x-text="value.new_value?.[0]?.comment || 'N/A'"></span>
</template>
<template x-if="column.startsWith('active')">
<span x-text="value.new_value ? 'Activated' : 'Deactivated'"></span>
</template>
<template x-if="column === 'iupac_name'">
<span x-html="value.new_value || 'N/A'"></span>
</template>
<template x-if="column.startsWith('created')">
<span>Initial creation of the compound on COCONUT</span>
</template>
<template x-if="['organisms', 'sampleLocations', 'citations'].includes(column.split('.')[0])">
<span x-text="value.new_value ? `Attached to: ${value.new_value}` : 'N/A'"></span>
</template>
<template x-if="['synonyms', 'cas'].includes(column.split('.')[0])">
<div>
<template x-if="Array.from(new Set((value.old_value || []).filter(x => !(value.new_value || []).includes(x)))).length > 0">
<div>
<span class="font-bold">Removed: </span><br />
<span x-text="Array.from(new Set((value.old_value || []).filter(x => !(value.new_value || []).includes(x)))).join(', ')"></span><br />
</div>
</template>
<template x-if="Array.from(new Set((value.new_value || []).filter(x => !(value.old_value || []).includes(x)))).length > 0">
<div>
<span class="font-bold">Added: </span><br />
<span x-text="Array.from(new Set((value.new_value || []).filter(x => !(value.old_value || []).includes(x)))).join(', ')"></span><br />
</div>
</template>
</div>
</template>
<template x-if="!['comment', 'active', 'created', 'organisms', 'sampleLocations', 'citations', 'synonyms', 'cas', 'iupac_name']
.includes(column.split('.')[0])">
<span x-text="value.new_value || 'N/A'"></span>
</template>
</td>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<template x-for="(value, key) in [JSON.parse(drawerContent)]">
<tr>
<td class="px-4 py-2 text-sm text-gray-900" x-text="column"></td>
<td class="px-4 py-2 text-sm text-gray-500" x-text="value.old_value !== null ? value.old_value : 'N/A'"></td>
<td class="px-4 py-2 text-sm text-gray-500" x-text="value.new_value !== null ? value.new_value : 'N/A'"></td>
</tr>
</template>
</tbody>
</table>
</template>
</div>
</template>
</tbody>
</table>
</template>
</div>
</div>
</div>
</div>

0 comments on commit 843f332

Please sign in to comment.