Merge pull request #14 from OlegLustenko/feature/regexp

feat(settings): Add ability to select by Regular Expression
This commit is contained in:
Oleg Lustenko 2022-09-18 09:36:56 +03:00 committed by GitHub
commit 0e5b34469b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 292 additions and 9 deletions

112
main.ts
View File

@ -13,9 +13,13 @@ import { renameFilesInObsidian } from './src/services/file.service';
import { createPreviewElement } from './src/components/PreviewElement';
import {
getObsidianFilesByFolderName,
getObsidianFilesByRegExp,
getObsidianFilesWithTagName,
} from './src/services/obsidian.service';
import { renderPreviewFiles } from './src/components/RenderPreviewFiles';
import { createBackslash } from './src/components/RegExpBackslash';
import { RegExpFlag } from './src/constants/RegExpFlags';
import { RegExpFlagsSuggest } from './src/suggestions/RegExpFlagsSuggest';
interface BulkRenamePluginSettings {
folderName: string;
@ -23,7 +27,11 @@ interface BulkRenamePluginSettings {
existingSymbol: string;
replacePattern: string;
tags: string[];
viewType: 'tags' | 'folder';
regExpState: {
regExp: string;
flags: RegExpFlag[];
};
viewType: 'tags' | 'folder' | 'regexp';
}
const DEFAULT_SETTINGS: BulkRenamePluginSettings = {
@ -31,6 +39,10 @@ const DEFAULT_SETTINGS: BulkRenamePluginSettings = {
fileNames: [],
existingSymbol: '',
replacePattern: '',
regExpState: {
regExp: '',
flags: [],
},
tags: [],
viewType: 'folder',
};
@ -38,10 +50,15 @@ const DEFAULT_SETTINGS: BulkRenamePluginSettings = {
const isViewTypeFolder = ({ settings }: BulkRenamePlugin) => {
return settings.viewType === 'folder';
};
const isViewTypeTags = ({ settings }: BulkRenamePlugin) => {
return settings.viewType === 'tags';
};
const isViewTypeRegExp = ({ settings }: BulkRenamePlugin) => {
return settings.viewType === 'regexp';
};
class BulkRenamePlugin extends Plugin {
settings: BulkRenamePluginSettings;
@ -97,6 +114,7 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
this.renderTabs();
this.renderFileLocation();
this.renderTagNames();
this.renderRegExpInput();
this.renderReplaceSymbol();
this.renderFilesAndPreview();
this.renderRenameFiles();
@ -127,6 +145,17 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
await this.plugin.saveSettings();
this.display();
});
})
.addButton((button) => {
button.setButtonText('Search by RegExp');
if (isViewTypeRegExp(this.plugin)) {
button.setCta();
}
button.onClick(async () => {
this.plugin.settings.viewType = 'regexp';
await this.plugin.saveSettings();
this.display();
});
});
}
@ -138,7 +167,7 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
.setName('Folder location')
.setDesc('Find files within the folder')
.addSearch((cb) => {
new FolderSuggest(this.app, cb.inputEl);
new FolderSuggest(this.app, cb.inputEl, this.plugin);
cb.setPlaceholder('Example: folder1/')
.setValue(this.plugin.settings.folderName)
.onChange((newFolder) => {
@ -157,11 +186,11 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
if (!isViewTypeTags(this.plugin)) {
return;
}
new Setting(this.containerEl)
.setName('Tag names ')
.setDesc('all files with the tags will be found')
.addSearch((cb) => {
// @ts-ignore
cb.inputEl.addEventListener('keydown', (event) => {
if (event.key !== 'Enter') {
return;
@ -185,6 +214,68 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
});
}
renderRegExpInput() {
if (!isViewTypeRegExp(this.plugin)) {
return;
}
const desc = document.createDocumentFragment();
desc.append(
desc.createEl('b', {
text: 'Reg exp will match file Operation System path',
}),
);
new Setting(this.containerEl)
.setName('RegExp Search')
.setDesc(desc)
.addText((cb) => {
const backslash = createBackslash('/');
cb.inputEl.insertAdjacentElement('beforebegin', backslash);
// @ts-ignore
cb.inputEl.addEventListener('keydown', (event) => {
if (event.key !== 'Enter') {
return;
}
const target = event.target as HTMLInputElement;
this.plugin.settings.regExpState.regExp = target.value;
this.plugin.saveSettings();
});
cb.setPlaceholder('Put your RegExp here')
.setValue(this.plugin.settings.regExpState.regExp)
.onChange((newFolder) => {
this.plugin.settings.regExpState.regExp = newFolder;
this.plugin.saveSettings();
this.getFilesByRegExp();
});
// @ts-ignore
cb.inputEl.addClass('bulk_regexp');
cb.inputEl.onblur = this.reRenderPreview;
})
.addText((cb) => {
new RegExpFlagsSuggest(this.app, cb.inputEl, this.plugin);
const backslash = createBackslash('/');
cb.inputEl.insertAdjacentElement('beforebegin', backslash);
cb.inputEl.addEventListener('keydown', (event) => {
// @ts-ignore
event.stopPropagation();
event.stopImmediatePropagation();
event.preventDefault();
});
cb.setPlaceholder('flags here')
// .setDisabled(true)
.setValue(this.plugin.settings.regExpState.flags.join(''))
.onChange((flag: RegExpFlag) => {
this.plugin.saveSettings();
this.getFilesByRegExp();
this.reRenderPreview();
});
cb.inputEl.addClass('bulk_regexp_flags');
})
.controlEl.addClass('bulk_regexp_control');
}
renderReplaceSymbol() {
const { settings } = this.plugin;
@ -248,7 +339,7 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
renderRenameFiles() {
const desc = document.createDocumentFragment();
desc.append(
'You are going to update all marked files and their directories',
'You are going to update all files from preview section',
desc.createEl('br'),
desc.createEl('b', {
text: 'Warning: ',
@ -296,6 +387,12 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
this.getFilesByTags();
return;
}
if (isViewTypeRegExp(this.plugin)) {
this.getFilesByRegExp();
return;
}
this.getFilesByFolder();
}
@ -312,6 +409,13 @@ export class BulkRenameSettingsTab extends PluginSettingTab {
this.plugin,
);
}
getFilesByRegExp() {
this.plugin.settings.fileNames = getObsidianFilesByRegExp(
this.app,
this.plugin,
);
}
}
export default BulkRenamePlugin;

65
package-lock.json generated
View File

@ -9,7 +9,8 @@
"version": "0.3.5",
"license": "MIT",
"dependencies": {
"@popperjs/core": "^2.11.2"
"@popperjs/core": "^2.11.2",
"xregexp": "^5.1.1"
},
"devDependencies": {
"@types/jest": "^28.1.8",
@ -855,6 +856,18 @@
"source-map": "^0.6.0"
}
},
"node_modules/@babel/runtime-corejs3": {
"version": "7.19.1",
"resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.19.1.tgz",
"integrity": "sha512-j2vJGnkopRzH+ykJ8h68wrHnEUmtK//E723jjixiAl/PPf6FhqY/vYRcMVlNydRKQjQsTsYEjpx+DZMIvnGk/g==",
"dependencies": {
"core-js-pure": "^3.25.1",
"regenerator-runtime": "^0.13.4"
},
"engines": {
"node": ">=6.9.0"
}
},
"node_modules/@babel/template": {
"version": "7.18.10",
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.18.10.tgz",
@ -3367,6 +3380,16 @@
"node": ">=0.10.0"
}
},
"node_modules/core-js-pure": {
"version": "3.25.1",
"resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.25.1.tgz",
"integrity": "sha512-7Fr74bliUDdeJCBMxkkIuQ4xfxn/SwrVg+HkJUAoNEXVqYLv55l6Af0dJ5Lq2YBUW9yKqSkLXaS5SYPK6MGa/A==",
"hasInstallScript": true,
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/core-js"
}
},
"node_modules/cross-spawn": {
"version": "7.0.3",
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
@ -8421,6 +8444,11 @@
"node": ">= 4"
}
},
"node_modules/regenerator-runtime": {
"version": "0.13.9",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
},
"node_modules/regex-not": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.2.tgz",
@ -10009,6 +10037,14 @@
"node": "^12.13.0 || ^14.15.0 || >=16.0.0"
}
},
"node_modules/xregexp": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/xregexp/-/xregexp-5.1.1.tgz",
"integrity": "sha512-fKXeVorD+CzWvFs7VBuKTYIW63YD1e1osxwQ8caZ6o1jg6pDAbABDG54LCIq0j5cy7PjRvGIq6sef9DYPXpncg==",
"dependencies": {
"@babel/runtime-corejs3": "^7.16.5"
}
},
"node_modules/y18n": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
@ -10669,6 +10705,15 @@
}
}
},
"@babel/runtime-corejs3": {
"version": "7.19.1",
"resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.19.1.tgz",
"integrity": "sha512-j2vJGnkopRzH+ykJ8h68wrHnEUmtK//E723jjixiAl/PPf6FhqY/vYRcMVlNydRKQjQsTsYEjpx+DZMIvnGk/g==",
"requires": {
"core-js-pure": "^3.25.1",
"regenerator-runtime": "^0.13.4"
}
},
"@babel/template": {
"version": "7.18.10",
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.18.10.tgz",
@ -12606,6 +12651,11 @@
"integrity": "sha512-XgZ0pFcakEUlbwQEVNg3+QAis1FyTL3Qel9FYy8pSkQqoG3PNoT0bOCQtOXcOkur21r2Eq2kI+IE+gsmAEVlYw==",
"dev": true
},
"core-js-pure": {
"version": "3.25.1",
"resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.25.1.tgz",
"integrity": "sha512-7Fr74bliUDdeJCBMxkkIuQ4xfxn/SwrVg+HkJUAoNEXVqYLv55l6Af0dJ5Lq2YBUW9yKqSkLXaS5SYPK6MGa/A=="
},
"cross-spawn": {
"version": "7.0.3",
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
@ -16376,6 +16426,11 @@
"source-map": "~0.6.1"
}
},
"regenerator-runtime": {
"version": "0.13.9",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
},
"regex-not": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.2.tgz",
@ -17596,6 +17651,14 @@
"signal-exit": "^3.0.7"
}
},
"xregexp": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/xregexp/-/xregexp-5.1.1.tgz",
"integrity": "sha512-fKXeVorD+CzWvFs7VBuKTYIW63YD1e1osxwQ8caZ6o1jg6pDAbABDG54LCIq0j5cy7PjRvGIq6sef9DYPXpncg==",
"requires": {
"@babel/runtime-corejs3": "^7.16.5"
}
},
"y18n": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",

View File

@ -15,7 +15,8 @@
"author": "",
"license": "MIT",
"dependencies": {
"@popperjs/core": "^2.11.2"
"@popperjs/core": "^2.11.2",
"xregexp": "^5.1.1"
},
"devDependencies": {
"@types/jest": "^28.1.8",

View File

@ -0,0 +1,6 @@
export const createBackslash = (textContent = '/') => {
const previewLabel = window.document.createElement('div');
previewLabel.className = 'bulk_regexp_slash';
previewLabel.textContent = textContent;
return previewLabel;
};

View File

@ -0,0 +1,15 @@
export type RegExpFlag = 'g' | 'i' | 'm' | 'u' | 'y' | 'n' | 's' | 'x' | 'A';
export const REGEXP_FLAGS = [
'g',
'i',
'm',
'u',
'y',
'n',
's',
'x',
'A',
] as const;
export type RegExpFlags = typeof REGEXP_FLAGS;

View File

@ -1,5 +1,6 @@
import { App, TFile } from 'obsidian';
import BulkRenamePlugin from '../../main';
import XRegExp from 'xregexp';
export const getObsidianFilesByFolderName = (
app: App,
@ -17,6 +18,27 @@ export const getObsidianFilesByFolderName = (
return filesSortedByName;
};
export const getObsidianFilesByRegExp = (
app: App,
plugin: BulkRenamePlugin,
) => {
const { regExpState } = plugin.settings;
const regExp = XRegExp(regExpState.regExp, regExpState.flags.join(''));
const abstractFiles = app.vault.getAllLoadedFiles();
const matchedFileNames = abstractFiles.filter((file) => {
if (file instanceof TFile && XRegExp.match(file.path, regExp)) {
return true;
}
}) as TFile[];
const filesSortedByName = sortFilesByName(matchedFileNames);
return filesSortedByName;
};
export const getObsidianFilesWithTagName = (
app: App,
plugin: BulkRenamePlugin,

View File

@ -0,0 +1,39 @@
// Credits go to Liam's Periodic Notes Plugin: https://github.com/liamcain/obsidian-periodic-notes
import { TextInputSuggest } from './suggest';
import { REGEXP_FLAGS, RegExpFlag } from '../constants/RegExpFlags';
export class RegExpFlagsSuggest extends TextInputSuggest<RegExpFlag> {
// @ts-ignore TODO refactor types
getSuggestions() {
return REGEXP_FLAGS;
}
renderSuggestion = (flag: RegExpFlag, el: HTMLElement) => {
const { regExpState } = this.plugin.settings;
const hasFlag = regExpState.flags.includes(flag);
if (hasFlag) {
el.addClass('bulk-flag-selected');
} else {
el.removeClass('bulk-flag-selected');
}
el.setText(flag);
};
selectSuggestion = (flag: RegExpFlag, event: MouseEvent | KeyboardEvent) => {
const { regExpState } = this.plugin.settings;
const target = event.target as HTMLDivElement;
const hasFlag = regExpState.flags.includes(flag);
if (hasFlag) {
regExpState.flags = regExpState.flags.filter((existingFlag) => {
return existingFlag !== flag;
});
} else {
regExpState.flags = [...regExpState.flags, flag];
}
target.classList.toggle('bulk-flag-selected');
this.inputEl.value = regExpState.flags.join('');
this.inputEl.trigger('input');
};
}

View File

@ -2,6 +2,7 @@
import { App, ISuggestOwner, Scope } from 'obsidian';
import { createPopper, Instance as PopperInstance } from '@popperjs/core';
import BulkRenamePlugin from '../../main';
const wrapAround = (value: number, size: number): number => {
return ((value % size) + size) % size;
@ -104,6 +105,7 @@ class Suggest<T> {
export abstract class TextInputSuggest<T> implements ISuggestOwner<T> {
protected app: App;
protected plugin: BulkRenamePlugin;
protected inputEl: HTMLInputElement | HTMLTextAreaElement;
private popper: PopperInstance;
@ -111,7 +113,12 @@ export abstract class TextInputSuggest<T> implements ISuggestOwner<T> {
private suggestEl: HTMLElement;
private suggest: Suggest<T>;
constructor(app: App, inputEl: HTMLInputElement | HTMLTextAreaElement) {
constructor(
app: App,
inputEl: HTMLInputElement | HTMLTextAreaElement,
plugin: BulkRenamePlugin,
) {
this.plugin = plugin;
this.app = app;
this.inputEl = inputEl;
this.scope = new Scope();
@ -191,7 +198,7 @@ export abstract class TextInputSuggest<T> implements ISuggestOwner<T> {
this.suggestEl.detach();
}
abstract getSuggestions(inputStr: string): T[];
abstract getSuggestions(inputStr?: string): T[];
abstract renderSuggestion(item: T, el: HTMLElement): void;
abstract selectSuggestion(item: T): void;
abstract selectSuggestion(item: T, evt: MouseEvent | KeyboardEvent): void;
}

View File

@ -23,3 +23,29 @@
.bulk_preview_label {
margin-right: 15px;
}
.bulk_regexp_control {
border: 1px solid var(--background-modifier-border);
}
.bulk_regexp_control > input {
border: none;
}
.bulk_regexp,
.bulk_regexp_flags {
width: 100%;
}
.bulk_regexp_flags {
caret-color: transparent;
}
.bulk_regexp_slash {
font-size: 1.5em;
opacity: 0.5;
}
.bulk-flag-selected {
background-color: lavender !important;
}