refac/fix: sortable items isseu

src/lib/components/admin/Settings/Interface/Banners.svelte

@@ -42,7 +42,7 @@
 		}
 
 		if (bannerListElement) {
-			sortable = Sortable.create(bannerListElement, {
+			sortable = new Sortable(bannerListElement, {
 				animation: 150,
 				handle: '.item-handle',
 				onUpdate: async (event) => {

src/lib/components/admin/Settings/Models/ModelList.svelte

@@ -31,9 +31,9 @@
 		}
 
 		if (modelListElement) {
-			sortable = Sortable.create(modelListElement, {
+			sortable = new Sortable(modelListElement, {
 				animation: 150,
-				handle: '.item-handle',
+				handle: '.model-item-handle',
 				onUpdate: async (event) => {
 					positionChangeHandler();
 				}
@@ -44,11 +44,11 @@
 
 {#if modelIds.length > 0}
 	<div class="flex flex-col -translate-x-1" bind:this={modelListElement}>
-		{#each modelIds as modelId, modelIdx (modelId)}
+		{#each modelIds as modelId, modelIdx (`${modelId}-${modelIdx}`)}
 			<div class=" flex gap-2 w-full justify-between items-center" id="model-item-{modelId}">
 				<Tooltip content={modelId} placement="top-start">
 					<div class="flex items-center gap-1">
-						<EllipsisVertical className="size-4 cursor-move item-handle" />
+						<EllipsisVertical className="size-4 cursor-move model-item-handle" />
 
 						<div class=" text-sm flex-1 py-1 rounded-lg">
 							{#if $models.find((model) => model.id === modelId)}