diff --git a/cypress/e2e/tables-import.cy.js b/cypress/e2e/tables-import.cy.js
index e29299690..81b9dd00c 100644
--- a/cypress/e2e/tables-import.cy.js
+++ b/cypress/e2e/tables-import.cy.js
@@ -20,13 +20,15 @@ describe('Import csv', () => {
 		cy.get('.modal__content button').contains('Select from Files').click()
 		cy.get('.file-picker__files').contains('test-import').click()
 		cy.get('.file-picker button span').contains('Choose test-import.csv').click()
+		cy.get('.modal__content .import-filename', { timeout: 5000 }).should('be.visible')
 		cy.get('.modal__content button').contains('Import').click()
+
 		cy.get('[data-cy="importResultColumnsFound"]').should('contain.text', '4')
 		cy.get('[data-cy="importResultColumnsMatch"]').should('contain.text', '4')
 		cy.get('[data-cy="importResultColumnsCreated"]').should('contain.text', '0')
 		cy.get('[data-cy="importResultRowsInserted"]').should('contain.text', '3')
-		cy.get('[data-cy="importResultParsingErrors"]').should('not.exist')
-		cy.get('[data-cy="importResultRowErrors"]').should('not.exist')
+		cy.get('[data-cy="importResultParsingErrors"]').should('contain.text', '0')
+		cy.get('[data-cy="importResultRowErrors"]').should('contain.text', '0')
 	})
 
 	it('Import csv from device', () => {
@@ -35,12 +37,67 @@ describe('Import csv', () => {
 		cy.get('.modal__content button').contains('Upload from device').click()
 		cy.get('input[type="file"]').selectFile('cypress/fixtures/test-import.csv', { force: true })
 		cy.get('.modal__content button').contains('Import').click()
-		cy.get('[data-cy="importResultColumnsFound"]').should('contain.text', '4')
+
+		cy.get('[data-cy="importResultColumnsFound"]', { timeout: 20000 }).should('contain.text', '4')
 		cy.get('[data-cy="importResultColumnsMatch"]').should('contain.text', '4')
 		cy.get('[data-cy="importResultColumnsCreated"]').should('contain.text', '0')
 		cy.get('[data-cy="importResultRowsInserted"]').should('contain.text', '3')
-		cy.get('[data-cy="importResultParsingErrors"]').should('not.exist')
-		cy.get('[data-cy="importResultRowErrors"]').should('not.exist')
+		cy.get('[data-cy="importResultParsingErrors"]').should('contain.text', '0')
+		cy.get('[data-cy="importResultRowErrors"]').should('contain.text', '0')
+	})
+
+})
+
+describe('Import csv from Files file action', () => {
+
+	before(function() {
+		cy.createRandomUser().then(user => {
+			localUser = user
+		})
+	})
+
+	beforeEach(function() {
+		cy.login(localUser)
+		cy.visit('apps/files/files')
+		cy.uploadFile('test-import.csv', 'text/csv')
+	})
+
+	it('Import to new table', () => {
+		cy.reload()
+
+		cy.get('[data-cy-files-list-row-actions] .action-item button').click()
+		cy.get('[data-cy-files-list-row-action="import-to-tables"]').click()
+
+		cy.intercept({ method: 'POST', url: '**/apps/tables/import/table/*'}).as('importNewTableReq')
+		cy.get('[data-cy="fileActionImportButton"]').click()
+		cy.wait('@importNewTableReq').its('response.statusCode').should('equal', 200)
+
+		cy.get('[data-cy="importResultColumnsFound"]').should('contain.text', '4')
+		cy.get('[data-cy="importResultColumnsMatch"]').should('contain.text', '0')
+		cy.get('[data-cy="importResultColumnsCreated"]').should('contain.text', '4')
+		cy.get('[data-cy="importResultRowsInserted"]').should('contain.text', '3')
+		cy.get('[data-cy="importResultParsingErrors"]').should('contain.text', '0')
+		cy.get('[data-cy="importResultRowErrors"]').should('contain.text', '0')
 	})
 
+	it('Import to existing table', () => {
+		cy.get('[data-cy-files-list-row-actions] .action-item button').click()
+		cy.get('[data-cy-files-list-row-action="import-to-tables"]').click()
+
+		cy.get('[data-cy="importAsNewTableSwitch"]').click()
+		cy.get('[data-cy="selectExistingTableDropdown"]').type('tutorial')
+		cy.get('.name-parts').click()
+
+		cy.intercept({ method: 'POST', url: '**/apps/tables/import/table/*'}).as('importExistingTableReq')
+		cy.get('[data-cy="fileActionImportButton"]').click()
+		cy.wait('@importExistingTableReq').its('response.statusCode').should('equal', 200)
+
+		cy.get('[data-cy="importResultColumnsFound"]').should('contain.text', '4')
+		cy.get('[data-cy="importResultColumnsMatch"]').should('contain.text', '4')
+		cy.get('[data-cy="importResultColumnsCreated"]').should('contain.text', '0')
+		cy.get('[data-cy="importResultRowsInserted"]').should('contain.text', '3')
+		cy.get('[data-cy="importResultParsingErrors"]').should('contain.text', '0')
+		cy.get('[data-cy="importResultRowErrors"]').should('contain.text', '0')
+	})
+	
 })
diff --git a/lib/AppInfo/Application.php b/lib/AppInfo/Application.php
index 05047f29a..738534a66 100644
--- a/lib/AppInfo/Application.php
+++ b/lib/AppInfo/Application.php
@@ -6,6 +6,7 @@
 use OCA\Analytics\Datasource\DatasourceEvent;
 use OCA\Tables\Capabilities;
 use OCA\Tables\Listener\AnalyticsDatasourceListener;
+use OCA\Tables\Listener\LoadAdditionalListener;
 use OCA\Tables\Listener\TablesReferenceListener;
 use OCA\Tables\Listener\UserDeletedListener;
 use OCA\Tables\Reference\ContentReferenceProvider;
@@ -17,10 +18,12 @@
 use OCP\AppFramework\Bootstrap\IBootstrap;
 use OCP\AppFramework\Bootstrap\IRegistrationContext;
 use OCP\Collaboration\Reference\RenderReferenceEvent;
+use OCP\Collaboration\Resources\LoadAdditionalScriptsEvent;
 use OCP\IConfig;
 use OCP\Server;
 use OCP\User\Events\BeforeUserDeletedEvent;
 use Psr\Container\ContainerExceptionInterface;
+
 use Psr\Container\NotFoundExceptionInterface;
 
 class Application extends App implements IBootstrap {
@@ -45,6 +48,8 @@ public function register(IRegistrationContext $context): void {
 		$context->registerEventListener(DatasourceEvent::class, AnalyticsDatasourceListener::class);
 		$context->registerEventListener(RenderReferenceEvent::class, TablesReferenceListener::class);
 
+		$context->registerEventListener(LoadAdditionalScriptsEvent::class, LoadAdditionalListener::class);
+
 		$context->registerSearchProvider(SearchTablesProvider::class);
 
 		try {
diff --git a/lib/Listener/LoadAdditionalListener.php b/lib/Listener/LoadAdditionalListener.php
new file mode 100644
index 000000000..6978f047b
--- /dev/null
+++ b/lib/Listener/LoadAdditionalListener.php
@@ -0,0 +1,20 @@
+<?php
+
+namespace OCA\Tables\Listener;
+
+use OCA\Tables\AppInfo\Application;
+use OCP\Collaboration\Resources\LoadAdditionalScriptsEvent;
+use OCP\EventDispatcher\Event;
+use OCP\EventDispatcher\IEventListener;
+use OCP\Util;
+
+/** @template-implements IEventListener<LoadAdditionalScriptsEvent> */
+class LoadAdditionalListener implements IEventListener {
+	public function handle(Event $event): void {
+		if (!($event instanceof LoadAdditionalScriptsEvent)) {
+			return;
+		}
+
+		Util::addScript(Application::APP_ID, 'tables-files', 'files');
+	}
+}
diff --git a/src/file-actions.js b/src/file-actions.js
new file mode 100644
index 000000000..50dd896d0
--- /dev/null
+++ b/src/file-actions.js
@@ -0,0 +1,33 @@
+import { FileAction, registerFileAction } from '@nextcloud/files'
+import { spawnDialog } from '@nextcloud/dialogs'
+import tablesIcon from '@mdi/svg/svg/table-large.svg?raw'
+
+__webpack_nonce__ = btoa(OC.requestToken) // eslint-disable-line
+__webpack_public_path__ = OC.linkTo('tables', 'js/') // eslint-disable-line
+
+const validMimeTypes = [
+	'text/csv',
+	'text/html',
+	'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+	'application/vnd.ms-excel',
+]
+
+const fileAction = new FileAction({
+	id: 'import-to-tables',
+	displayName: () => t('tables', 'Import into Tables'),
+	iconSvgInline: () => tablesIcon,
+
+	enabled: (files) => {
+		const file = files[0]
+
+		return file.type === 'file' && validMimeTypes.includes(file.mime)
+	},
+
+	exec: async (file) => {
+		const { default: FileActionImport } = await import('./modules/modals/FileActionImport.vue')
+		spawnDialog(FileActionImport, { file })
+		return null
+	},
+})
+
+registerFileAction(fileAction)
diff --git a/src/modules/modals/FileActionImport.vue b/src/modules/modals/FileActionImport.vue
new file mode 100644
index 000000000..072925014
--- /dev/null
+++ b/src/modules/modals/FileActionImport.vue
@@ -0,0 +1,281 @@
+<template>
+	<NcModal v-if="!importResults">
+		<div class="modal__content">
+			<h2>{{ t('tables', 'Import file into Tables') }}</h2>
+
+			<RowFormWrapper
+				class="row"
+				:title="t('tables', 'Import as new table')"
+				:description="t('tables', 'This will create a new table from the data in this file.')">
+				<div style="display: flex; flex-flow: row wrap; align-items: center;">
+					<NcCheckboxRadioSwitch
+						data-cy="importAsNewTableSwitch"
+						:aria-label="t('tables', 'Import as new table')"
+						:checked.sync="importAsNew"
+						type="switch"
+						class="switch"
+						style="flex-grow: 0;">
+						{{ t('tables', 'Import as new table') }}
+					</NcCheckboxRadioSwitch>
+
+					<div style="display: flex; flex-flow: row nowrap; flex-grow: 1;">
+						<NcEmojiPicker :close-on-select="true" @select="selectIcon">
+							<NcButton
+								:aria-label="t('tables', 'Select emoji for table')"
+								type="tertiary"
+								:disabled="!importAsNew"
+								@click.prevent>
+								<template #icon>
+									{{ newTable.emoji }}
+								</template>
+							</NcButton>
+						</NcEmojiPicker>
+
+						<input
+							:aria-label="t('tables', 'Title of the new table')"
+							style="flex-grow: 1;"
+							:placeholder="newTable.title"
+							:disabled="!importAsNew"
+							@input="setNewTableTitle">
+					</div>
+				</div>
+			</RowFormWrapper>
+
+			<RowFormWrapper
+				class="row"
+				:title="t('tables', 'Import into existing table')"
+				:description="t('tables', 'This will import the data from this file into an already existing table.')">
+				<div style="display: flex; flex-flow: row nowrap; margin: 20px 0;">
+					<NcSelect
+						v-model="selectedTable"
+						data-cy="selectExistingTableDropdown"
+						:options="tableOptions"
+						:aria-label-combobox="t('tables', 'Select the table to import into')"
+						:placeholder="t('tables', 'Select an existing table')"
+						:disabled="importAsNew"
+						:loading="loadingTables"
+						style="flex-grow: 1;" />
+				</div>
+			</RowFormWrapper>
+
+			<NcCheckboxRadioSwitch
+				:aria-label="t('tables', 'Create missing columns')"
+				type="switch"
+				:disabled="importAsNew"
+				:checked.sync="createMissingColumns"
+				style="flex-grow: 0;">
+				{{ t('tables', 'Create missing columns') }}
+			</NcCheckboxRadioSwitch>
+
+			<div class="end">
+				<NcButton
+					data-cy="fileActionImportButton"
+					:aria-label="t('tables', 'Import')"
+					type="primary"
+					:disabled="importingFile"
+					@click="importFile">
+					<template v-if="importingFile" #icon>
+						<NcLoadingIcon :size="20" />
+					</template>
+
+					{{ t('tables', 'Import') }}
+				</NcButton>
+			</div>
+		</div>
+	</NcModal>
+
+	<NcDialog v-else
+		:name="t('tables', 'Import successful')"
+		:open.sync="showResultsDialog"
+		size="small">
+		<template #actions>
+			<NcButton :aria-label="t('tables', 'Close')" @click="closeResultsDialog()">
+				{{ t('tables', 'Close') }}
+			</NcButton>
+		</template>
+
+		<ImportResults :results="importResults" />
+	</NcDialog>
+</template>
+
+<script>
+import {
+	NcModal,
+	NcDialog,
+	NcButton,
+	NcSelect,
+	NcCheckboxRadioSwitch,
+	NcEmojiPicker,
+	NcLoadingIcon,
+} from '@nextcloud/vue'
+
+import { generateUrl } from '@nextcloud/router'
+import { Node } from '@nextcloud/files'
+import { showError } from '@nextcloud/dialogs'
+import axios from '@nextcloud/axios'
+import { translate as t } from '@nextcloud/l10n'
+import RowFormWrapper from '../../shared/components/ncTable/partials/rowTypePartials/RowFormWrapper.vue'
+import ImportResults from './ImportResults.vue'
+
+export default {
+	name: 'FileActionImport',
+
+	components: {
+		NcModal,
+		NcButton,
+		NcDialog,
+		ImportResults,
+		NcLoadingIcon,
+		NcSelect,
+		NcCheckboxRadioSwitch,
+		NcEmojiPicker,
+		RowFormWrapper,
+	},
+
+	props: {
+		file: {
+			type: Node,
+			default: null,
+		},
+	},
+
+	data() {
+		return {
+			importAsNew: true,
+			createMissingColumns: true,
+
+			loadingTables: false,
+			importingFile: false,
+
+			newTable: {
+				emoji: '🔧',
+				title: this.file.basename,
+			},
+			existingTables: [],
+			selectedTable: null,
+
+			importResults: null,
+			showResultsDialog: true,
+		}
+	},
+
+	computed: {
+		tableOptions() {
+			const options = this.existingTables.map(table => {
+				return {
+					label: `${table.emoji} ${table.title}`,
+					value: table.id,
+				}
+			})
+
+			return options ?? 'No existing tables'
+		},
+	},
+
+	async mounted() {
+		this.loadingTables = true
+
+		const res = await axios.get(generateUrl('/apps/tables/table'))
+
+		if (res.data) {
+			res.data.forEach(table => this.existingTables.push({
+				title: table.title,
+				emoji: table.emoji,
+				id: table.id,
+			}))
+		}
+
+		this.loadingTables = false
+	},
+
+	methods: {
+		t,
+		selectIcon(icon) {
+			this.newTable.emoji = icon
+		},
+		setNewTableTitle(title) {
+			this.newTable.title = title.srcElement.value
+		},
+		closeResultsDialog() {
+			this.showResultsDialog = false
+		},
+		async importFile() {
+			this.importingFile = true
+
+			if (this.importAsNew) {
+				this.importResults = await importToNewTable(this.newTable.title, this.newTable.emoji, this.file)
+
+				if (!this.importResults) {
+					showError(t('tables', 'Could not create table'))
+				}
+			} else {
+				if (!this.selectedTable) {
+					showError(t('tables', 'You must select an existing table'))
+					return
+				}
+
+				this.importResults = await importToExistingTable(this.selectedTable.value, this.file, this.createMissingColumns)
+
+				if (!this.importResults) {
+					showError(t('tables', 'Could not import data to table'))
+				}
+			}
+
+			this.importingFile = false
+		},
+	},
+}
+
+async function importToNewTable(title, emoji, file) {
+	const newTable = await insertTable(title, emoji)
+
+	if (!newTable) {
+		return false
+	}
+
+	return await updateTable(newTable.id, file.path, true)
+}
+
+async function importToExistingTable(tableId, file, createMissingColumns) {
+	return await updateTable(tableId, file.path, createMissingColumns)
+}
+
+async function insertTable(title, emoji) {
+	const res = await axios.post(generateUrl('/apps/tables/table'), {
+		title,
+		emoji,
+		template: 'custom',
+	})
+
+	return res.data
+}
+
+async function updateTable(tableId, path, createMissingColumns) {
+	const res = await axios.post(generateUrl(`/apps/tables/import/table/${tableId}`), {
+		path,
+		createMissingColumns,
+	})
+
+	return res.data
+}
+</script>
+
+<style scoped lang="scss">
+.modal__content {
+	margin: 20px;
+}
+
+.row {
+	margin: 20px 0;
+}
+
+.switch {
+	margin: 5px;
+}
+
+.end {
+	display: flex;
+	flex-flow: row nowrap;
+	justify-content: flex-end;
+}
+</style>
diff --git a/src/modules/modals/Import.vue b/src/modules/modals/Import.vue
index fe943b999..7662a6018 100644
--- a/src/modules/modals/Import.vue
+++ b/src/modules/modals/Import.vue
@@ -67,59 +67,7 @@
 
 			<!-- show results -->
 			<div v-if="!loading && result !== null && !waitForReload">
-				<RowFormWrapper v-if="result !== ''">
-					<div>
-						<h3 class="result-headline">
-							<IconCheck v-if="!result['errors_parsing_count'] && !result['errors_count']" :size="15" />
-							<IconAlert v-else :size="15" />
-							{{ t('tables', 'Imported from ') + importFileName }}
-						</h3>
-					</div>
-					<div class="fix-col-1">
-						{{ t('tables', 'Found columns') }}
-					</div>
-					<div class="fix-col-3" data-cy="importResultColumnsFound">
-						{{ result['found_columns_count'] }}
-					</div>
-					<div class="fix-col-1">
-						{{ t('tables', 'Matching columns') }}
-					</div>
-					<div class="fix-col-3" data-cy="importResultColumnsMatch">
-						{{ result['matching_columns_count'] }}
-					</div>
-					<div class="fix-col-1">
-						{{ t('tables', 'Created columns') }}
-					</div>
-					<div class="fix-col-3" data-cy="importResultColumnsCreated">
-						{{ result['created_columns_count'] }}
-					</div>
-					<div class="fix-col-1">
-						{{ t('tables', 'Inserted rows') }}
-					</div>
-					<div class="fix-col-3" data-cy="importResultRowsInserted">
-						{{ result['inserted_rows_count'] }}
-					</div>
-					<template v-if="result['errors_parsing_count'] || result['errors_count']">
-						<div class="fix-col-1">
-							{{ t('tables', 'Value parsing errors') }}
-						</div>
-						<div class="fix-col-3 errors-count" data-cy="importResultParsingErrors">
-							{{ result['errors_parsing_count'] }}
-							<IconAlert :size="15" />
-						</div>
-						<div class="fix-col-1">
-							{{ t('tables', 'Row creation errors') }}
-						</div>
-						<div class="fix-col-3 errors-count" data-cy="importResultRowErrors">
-							{{ result['errors_count'] }}
-							<IconAlert :size="15" />
-						</div>
-					</template>
-				</RowFormWrapper>
-
-				<RowFormWrapper v-else :title="t('tables', 'Result')">
-					{{ t('tables', 'Error during importing. Please read the logs for more information.') }}
-				</RowFormWrapper>
+				<ImportResults :results="result" />
 
 				<div class="row">
 					<div class="fix-col-4 space-T end">
@@ -154,12 +102,11 @@ import permissionsMixin from '../../shared/components/ncTable/mixins/permissions
 import IconFolder from 'vue-material-design-icons/Folder.vue'
 import IconUpload from 'vue-material-design-icons/Upload.vue'
 import IconFile from 'vue-material-design-icons/File.vue'
-import IconCheck from 'vue-material-design-icons/Check.vue'
-import IconAlert from 'vue-material-design-icons/Alert.vue'
 import axios from '@nextcloud/axios'
 import { generateUrl } from '@nextcloud/router'
 import { mapGetters } from 'vuex'
 import NcIconTimerSand from '../../shared/components/ncIconTimerSand/NcIconTimerSand.vue'
+import ImportResults from './ImportResults.vue'
 
 export default {
 
@@ -169,10 +116,9 @@ export default {
 		IconFolder,
 		IconUpload,
 		IconFile,
-		IconCheck,
-		IconAlert,
 		NcModal,
 		NcButton,
+		ImportResults,
 		NcCheckboxRadioSwitch,
 		RowFormWrapper,
 		NcEmptyContent,
diff --git a/src/modules/modals/ImportResults.vue b/src/modules/modals/ImportResults.vue
new file mode 100644
index 000000000..7cddbb43c
--- /dev/null
+++ b/src/modules/modals/ImportResults.vue
@@ -0,0 +1,92 @@
+<template>
+	<table class="file_import__results">
+		<caption>
+			{{ t('tables', 'Result') }}
+		</caption>
+
+		<tbody>
+			<tr>
+				<td>{{ t('tables', 'Found columns') }}</td>
+				<td data-cy="importResultColumnsFound">
+					{{ results.found_columns_count }}
+				</td>
+			</tr>
+
+			<tr>
+				<td>{{ t('tables', 'Matching columns') }}</td>
+				<td data-cy="importResultColumnsMatch">
+					{{ results.matching_columns_count }}
+				</td>
+			</tr>
+
+			<tr>
+				<td>{{ t('tables', 'Created columns') }}</td>
+				<td data-cy="importResultColumnsCreated">
+					{{ results.created_columns_count }}
+				</td>
+			</tr>
+
+			<tr>
+				<td>{{ t('tables', 'Inserted rows') }}</td>
+				<td data-cy="importResultRowsInserted">
+					{{ results.inserted_rows_count }}
+				</td>
+			</tr>
+
+			<tr>
+				<td>{{ t('tables', 'Value parsing errors') }}</td>
+				<td data-cy="importResultParsingErrors">
+					{{ results.errors_parsing_count }}
+				</td>
+			</tr>
+
+			<tr>
+				<td>{{ t('tables', 'Row creation errors') }}</td>
+				<td data-cy="importResultRowErrors">
+					{{ results.errors_count }}
+				</td>
+			</tr>
+		</tbody>
+	</table>
+</template>
+
+<script>
+import { translate as t } from '@nextcloud/l10n'
+
+export default {
+	name: 'ImportResults',
+
+	props: {
+		results: {
+			type: Object,
+			default() {
+				return {
+					found_columns_count: 0,
+					matching_columns_count: 0,
+					created_columns_count: 0,
+					inserted_rows_count: 0,
+					errors_parsing_count: 0,
+					errors_count: 0,
+				}
+			},
+		},
+	},
+
+	methods: {
+		t,
+	},
+}
+</script>
+
+<style scoped>
+.file_import__results {
+	margin: auto;
+	min-width: 350px;
+	max-width: 600px;
+
+	& caption {
+		font-weight: bold;
+		margin: calc(var(--default-grid-baseline) * 2) auto;
+	}
+}
+</style>
diff --git a/webpack.js b/webpack.js
index 648f1f210..7daa253f6 100644
--- a/webpack.js
+++ b/webpack.js
@@ -1,6 +1,20 @@
 const path = require('path')
 const webpackConfig = require('@nextcloud/webpack-vue-config')
 
-webpackConfig.entry['reference'] = path.join(__dirname, 'src', 'reference.js')
+webpackConfig.entry = {
+	main: path.join(__dirname, 'src', 'main.js'),
+	files: path.join(__dirname, 'src', 'file-actions.js'),
+	reference: path.join(__dirname, 'src', 'reference.js'),
+}
+
+webpackConfig.module = {
+	rules: [
+		...webpackConfig.module.rules,
+		{
+			resourceQuery: /raw/,
+			type: 'asset/source',
+		}
+	]
+}
 
 module.exports = webpackConfig