release(file-list): v0.3.0

liriliri · Jan 13, 2025 · 097c974 · 097c974
1 parent afecd4f
commit 097c974
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 13 deletions.
diff --git a/index.json b/index.json
@@ -110,7 +110,7 @@
   "file-list": {
     "react": true,
     "dependencies": ["data-grid", "icon-list"],
-    "version": "0.2.0",
+    "version": "0.3.0",
     "style": true,
     "icon": false,
     "test": true,

diff --git a/src/file-list/README.md b/src/file-list/README.md
@@ -46,6 +46,7 @@ const fileList = new LunaFileList(container, {
 ## Configuration
 
 * files(IFile[]): File list.
+* filter(string | RegExp | AnyFn): File filter.
 * listView(boolean): Show files in list view.
 
 ## Types

diff --git a/src/file-list/index.ts b/src/file-list/index.ts
@@ -4,6 +4,7 @@ import LunaDataGrid from 'luna-data-grid'
 import LunaIconList from 'luna-icon-list'
 import { exportCjs } from '../share/util'
 import map from 'licia/map'
+import I18n from 'licia/I18n'
 import splitPath from 'licia/splitPath'
 import fileSize from 'licia/fileSize'
 import asset from './asset'
@@ -16,6 +17,7 @@ import toEl from 'licia/toEl'
 import each from 'licia/each'
 import types from 'licia/types'
 import wrap from 'licia/wrap'
+import upperCase from 'licia/upperCase'
 import isFn from 'licia/isFn'
 
 const folderIcon = asset['folder.svg']
@@ -57,6 +59,24 @@ export interface IFile {
  * })
  */
 export default class FileList extends Component<IOptions> {
+  static i18n = new I18n(navigator.language !== 'zh-CN' ? 'en-US' : 'zh-CN', {
+    'en-US': {
+      name: 'Name',
+      size: 'Size',
+      type: 'Type',
+      directory: 'Directory',
+      file: 'File',
+      dateModified: 'Date Modified',
+    },
+    'zh-CN': {
+      name: '名称',
+      size: '大小',
+      type: '类型',
+      directory: '文件夹',
+      file: '文件',
+      dateModified: '修改日期',
+    },
+  })
   private dataGrid: LunaDataGrid
   private iconList: LunaIconList
   private onResize: () => void
@@ -76,19 +96,28 @@ export default class FileList extends Component<IOptions> {
       columns: [
         {
           id: 'name',
-          title: 'Name',
-          weight: 60,
+          title: FileList.i18n.t('name'),
+          weight: 40,
           sortable: true,
         },
         {
           id: 'size',
-          title: 'Size',
+          title: FileList.i18n.t('size'),
           weight: 20,
+          comparator: (a: string, b: string) => fileSize(a) - fileSize(b),
+          sortable: true,
+        },
+        {
+          id: 'type',
+          title: FileList.i18n.t('type'),
+          weight: 20,
+          sortable: true,
         },
         {
           id: 'mtime',
-          title: 'Date Modified',
+          title: FileList.i18n.t('dateModified'),
           weight: 20,
+          sortable: true,
         },
       ],
       selectable: true,
@@ -203,13 +232,26 @@ export default class FileList extends Component<IOptions> {
         name: toEl(
           `<span><img src="${this.getIcon(file)}" />${file.name}</span>`
         ) as HTMLElement,
+        type: this.getType(file),
         size: file.size ? fileSize(file.size) : '--',
         mtime: dateFormat(file.mtime, 'yyyy-mm-dd HH:MM:ss'),
         file,
       }
     })
     this.dataGrid.setData(data as any)
   }
+  private getType(file: IFile) {
+    if (file.directory) {
+      return FileList.i18n.t('directory')
+    }
+
+    const ext = splitPath(file.name).ext
+    if (ext) {
+      return upperCase(ext.slice(1))
+    }
+
+    return FileList.i18n.t('file')
+  }
   private bindEvent() {
     this.resizeSensor.addListener(this.onResize)
 

diff --git a/src/file-list/package.json b/src/file-list/package.json
@@ -1,6 +1,6 @@
 {
   "name": "file-list",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "List files in the directory",
   "luna": {
     "react": true,

diff --git a/src/file-list/story.js b/src/file-list/story.js
@@ -41,6 +41,7 @@ const def = story(
   },
   {
     readme,
+    i18n: FileList.i18n,
     story: __STORY__,
     ReactComponent({ theme }) {
       const { listView, filter } = createKnobs()
@@ -81,45 +82,49 @@ function getFiles() {
       name: 'test.txt',
       size: 1024,
       directory: false,
-      mtime: new Date(),
+      mtime: randomDate(),
     },
     {
       name: 'folder 1',
       directory: true,
-      mtime: new Date(),
+      mtime: randomDate(),
     },
     {
       name: 'picture.jpg',
       thumbnail: '',
       size: 2048,
       directory: false,
-      mtime: new Date(),
+      mtime: randomDate(),
     },
     {
       name: 'pic1.png',
       thumbnail: '/pic1.png',
-      mtime: new Date(),
+      mtime: randomDate(),
     },
     {
       name: 'binary',
       size: 4096,
       directory: false,
-      mtime: new Date(),
+      mtime: randomDate(),
     },
     {
       name: 'video.mp4',
       size: 8192,
       directory: false,
-      mtime: new Date(),
+      mtime: randomDate(),
     },
     {
       name: 'audio.mp3',
       size: 16384,
-      mtime: new Date(),
+      mtime: randomDate(),
     },
   ]
 }
 
+function randomDate() {
+  return new Date(Date.now() - Math.random() * 10000000000)
+}
+
 function createKnobs() {
   const filter = text('Filter', '')
   const listView = boolean('List View', false)