테스트

Author: shimaenaga1123

src/app/components/database/database.component.ts

@@ -43,8 +43,8 @@ import { AdminService, TableInfo, TableData } from '../../services/admin.service
           </div>
           <div class="flex-1 overflow-y-auto">
             <div *ngIf="tables.length > 0" class="space-y-2">
-              <div 
-                *ngFor="let table of tables" 
+              <div
+                *ngFor="let table of tables"
                 [class]="'flex items-center gap-3 p-3 rounded-xl cursor-pointer transition-all duration-200 ' + (selectedTable?.name === table.name ? 'bg-md-sys-color-secondary-container text-md-sys-color-on-secondary-container' : 'hover:bg-md-sys-color-surface-container-high')"
                 (click)="selectTable(table)">
                 <mat-icon class="w-6 h-6 flex-shrink-0" [class.text-md-sys-color-on-secondary-container]="selectedTable?.name === table.name">table_chart</mat-icon>
@@ -97,7 +97,7 @@ import { AdminService, TableInfo, TableData } from '../../services/admin.service
               <p class="md-typescale-body-medium">테이블 데이터를 불러오는 중...</p>
             </div>
 
-            <div *ngIf="tableData && !loadingData" class="flex flex-col h-full overflow-hidden">
+            <div *ngIf="tableData && !loadingData" class="flex flex-col h-full w-full">
               <!-- 컬럼 정보 -->
               <div class="mb-6">
                 <h3 class="md-typescale-title-medium text-md-sys-color-on-surface mb-3 flex items-center gap-2">
@@ -108,10 +108,10 @@ import { AdminService, TableInfo, TableData } from '../../services/admin.service
                   <div *ngFor="let column of tableData.columns" class="p-3 bg-md-sys-color-surface-container-high rounded-xl">
                     <div class="md-typescale-body-large font-medium text-md-sys-color-on-surface mb-2">{{ column.name }}</div>
                     <div class="flex flex-wrap gap-2">
-                      <span class="px-2 py-1 rounded-full text-xs" 
-                            [class]="getColumnTypeColor(column.type) === 'primary' ? 'bg-md-sys-color-primary-container text-md-sys-color-on-primary-container' : 
-                                     getColumnTypeColor(column.type) === 'accent' ? 'bg-md-sys-color-secondary-container text-md-sys-color-on-secondary-container' : 
-                                     getColumnTypeColor(column.type) === 'warn' ? 'bg-md-sys-color-tertiary-container text-md-sys-color-on-tertiary-container' : 
+                      <span class="px-2 py-1 rounded-full text-xs"
+                            [class]="getColumnTypeColor(column.type) === 'primary' ? 'bg-md-sys-color-primary-container text-md-sys-color-on-primary-container' :
+                                     getColumnTypeColor(column.type) === 'accent' ? 'bg-md-sys-color-secondary-container text-md-sys-color-on-secondary-container' :
+                                     getColumnTypeColor(column.type) === 'warn' ? 'bg-md-sys-color-tertiary-container text-md-sys-color-on-tertiary-container' :
                                      'bg-md-sys-color-surface-container text-md-sys-color-on-surface'">
                         {{ column.type }}
                       </span>
@@ -138,16 +138,16 @@ import { AdminService, TableInfo, TableData } from '../../services/admin.service
                       <th mat-header-cell *matHeaderCellDef class="bg-md-sys-color-surface-container-high">
                         <div class="flex items-center gap-2 md-typescale-label-large font-medium text-md-sys-color-on-surface">
                           <span>{{ column.name }}</span>
-                          <mat-icon 
-                            *ngIf="column.key" 
+                          <mat-icon
+                            *ngIf="column.key"
                             class="w-4 h-4 text-md-sys-color-primary"
                             [matTooltip]="getKeyTooltip(column.key)">
                             {{ getKeyIcon(column.key) }}
                           </mat-icon>
                         </div>
                       </th>
                       <td mat-cell *matCellDef="let row" class="border-b border-md-sys-color-outline-variant">
-                        <div class="max-w-48 overflow-hidden text-ellipsis whitespace-nowrap md-typescale-body-medium text-md-sys-color-on-surface" 
+                        <div class="max-w-48 overflow-hidden text-ellipsis whitespace-nowrap md-typescale-body-medium text-md-sys-color-on-surface"
                              [matTooltip]="formatCellValue(row[column.name])">
                           {{ formatCellValue(row[column.name]) }}
                         </div>
@@ -161,7 +161,7 @@ import { AdminService, TableInfo, TableData } from '../../services/admin.service
 
                 <!-- 페이지네이션 -->
                 <div class="mt-4">
-                  <mat-paginator 
+                  <mat-paginator
                     [length]="tableData.pagination.totalCount"
                     [pageSize]="tableData.pagination.limit"
                     [pageIndex]="tableData.pagination.page - 1"
@@ -184,7 +184,7 @@ import { AdminService, TableInfo, TableData } from '../../services/admin.service
       display: flex;
       flex-direction: column;
     }
-    
+
     .md-button {
       border: none;
       cursor: pointer;
@@ -194,11 +194,11 @@ import { AdminService, TableInfo, TableData } from '../../services/admin.service
       align-items: center;
       justify-content: center;
     }
-    
+
     .md-button:hover {
       transform: translateY(-1px);
     }
-    
+
     .md-button:disabled {
       opacity: 0.5;
       cursor: not-allowed;
@@ -334,7 +334,7 @@ export class DatabaseComponent implements OnInit {
 
   private convertToCSV(data: TableData): string {
     const headers = data.columns.map(col => col.name).join(',');
-    const rows = data.rows.map(row => 
+    const rows = data.rows.map(row =>
       data.columns.map(col => {
         const value = row[col.name];
         if (value === null || value === undefined) return '';
@@ -346,7 +346,7 @@ export class DatabaseComponent implements OnInit {
         return stringValue;
       }).join(',')
     ).join('\n');
-    
+
     return `${headers}\n${rows}`;
   }
-}
+}