feat: sharepoint for storing files #1
@@ -1,13 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
type IconName =
|
type IconName = 'folder' | 'file' | 'upload' | 'download' | 'external' | 'trash' | 'x' | 'plus';
|
||||||
| 'folder'
|
|
||||||
| 'file'
|
|
||||||
| 'upload'
|
|
||||||
| 'download'
|
|
||||||
| 'external'
|
|
||||||
| 'trash'
|
|
||||||
| 'x'
|
|
||||||
| 'plus';
|
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{ name: IconName; size?: number }>(), {
|
const props = withDefaults(defineProps<{ name: IconName; size?: number }>(), {
|
||||||
size: 16,
|
size: 16,
|
||||||
@@ -20,7 +12,11 @@
|
|||||||
file: ['M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z', 'M14 2v4a2 2 0 0 0 2 2h4'],
|
file: ['M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z', 'M14 2v4a2 2 0 0 0 2 2h4'],
|
||||||
upload: ['M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4', 'M17 8l-5-5-5 5', 'M12 3v12'],
|
upload: ['M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4', 'M17 8l-5-5-5 5', 'M12 3v12'],
|
||||||
download: ['M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4', 'M7 10l5 5 5-5', 'M12 15V3'],
|
download: ['M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4', 'M7 10l5 5 5-5', 'M12 15V3'],
|
||||||
external: ['M15 3h6v6', 'M10 14 21 3', 'M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'],
|
external: [
|
||||||
|
'M15 3h6v6',
|
||||||
|
'M10 14 21 3',
|
||||||
|
'M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6',
|
||||||
|
],
|
||||||
trash: [
|
trash: [
|
||||||
'M3 6h18',
|
'M3 6h18',
|
||||||
'M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6',
|
'M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6',
|
||||||
|
|||||||
@@ -11,7 +11,12 @@ body {
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
background: var(--color-bg);
|
background: var(--color-bg);
|
||||||
color: var(--color-text);
|
color: var(--color-text);
|
||||||
font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
|
font-family:
|
||||||
|
system-ui,
|
||||||
|
-apple-system,
|
||||||
|
'Segoe UI',
|
||||||
|
Roboto,
|
||||||
|
sans-serif;
|
||||||
font-size: var(--text-base);
|
font-size: var(--text-base);
|
||||||
line-height: var(--leading-normal);
|
line-height: var(--leading-normal);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -15,4 +15,3 @@ export function formatLocaleDateWithTime(iso: string): string {
|
|||||||
minute: '2-digit',
|
minute: '2-digit',
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
getDownloadUrls,
|
getDownloadUrls,
|
||||||
type StorageItem,
|
type StorageItem,
|
||||||
} from '../services/storage';
|
} from '../services/storage';
|
||||||
import { formatLocaleDate } from '../utils/utils';
|
import { formatLocaleDate } from '../utils/utils';
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|||||||
@@ -12,7 +12,7 @@
|
|||||||
type IntegrationConfigRequest,
|
type IntegrationConfigRequest,
|
||||||
type CredentialResponse,
|
type CredentialResponse,
|
||||||
} from '../services/integration';
|
} from '../services/integration';
|
||||||
import { formatLocaleDateWithTime } from '../utils/utils';
|
import { formatLocaleDateWithTime } from '../utils/utils';
|
||||||
|
|
||||||
const config = ref<IntegrationConfig | null>(null);
|
const config = ref<IntegrationConfig | null>(null);
|
||||||
const credentials = ref<CredentialResponse[]>([]);
|
const credentials = ref<CredentialResponse[]>([]);
|
||||||
|
|||||||
@@ -11,7 +11,7 @@
|
|||||||
type IntegrationConfig,
|
type IntegrationConfig,
|
||||||
type CredentialResponse,
|
type CredentialResponse,
|
||||||
} from '../services/integration';
|
} from '../services/integration';
|
||||||
import { formatLocaleDateWithTime } from '../utils/utils';
|
import { formatLocaleDateWithTime } from '../utils/utils';
|
||||||
|
|
||||||
const config = ref<IntegrationConfig | null>(null);
|
const config = ref<IntegrationConfig | null>(null);
|
||||||
const credentials = ref<CredentialResponse[]>([]);
|
const credentials = ref<CredentialResponse[]>([]);
|
||||||
@@ -141,7 +141,6 @@ import { formatLocaleDateWithTime } from '../utils/utils';
|
|||||||
disconnecting.value = false;
|
disconnecting.value = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -177,7 +176,8 @@ import { formatLocaleDateWithTime } from '../utils/utils';
|
|||||||
<template v-if="integrationConfigured">
|
<template v-if="integrationConfigured">
|
||||||
<div class="integration-row">
|
<div class="integration-row">
|
||||||
<div class="integration-info">
|
<div class="integration-info">
|
||||||
<span class="integration-icon"><AppIcon
|
<span class="integration-icon"
|
||||||
|
><AppIcon
|
||||||
name="folder"
|
name="folder"
|
||||||
:size="20"
|
:size="20"
|
||||||
/></span>
|
/></span>
|
||||||
@@ -217,9 +217,7 @@ import { formatLocaleDateWithTime } from '../utils/utils';
|
|||||||
class="btn btn-primary"
|
class="btn btn-primary"
|
||||||
:disabled="connecting"
|
:disabled="connecting"
|
||||||
@click="
|
@click="
|
||||||
connectAccount(
|
connectAccount(connectionMode === 'byo' ? ['user-configured-oauth'] : undefined)
|
||||||
connectionMode === 'byo' ? ['user-configured-oauth'] : undefined,
|
|
||||||
)
|
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
{{ connecting ? 'Connecting...' : 'Connect Account' }}
|
{{ connecting ? 'Connecting...' : 'Connect Account' }}
|
||||||
@@ -238,7 +236,9 @@ import { formatLocaleDateWithTime } from '../utils/utils';
|
|||||||
class="credential-row"
|
class="credential-row"
|
||||||
>
|
>
|
||||||
<span class="cred-type">{{ cred.integrationType }}</span>
|
<span class="cred-type">{{ cred.integrationType }}</span>
|
||||||
<span class="cred-date">Connected {{ formatLocaleDateWithTime(cred.connectedAt) }}</span>
|
<span class="cred-date"
|
||||||
|
>Connected {{ formatLocaleDateWithTime(cred.connectedAt) }}</span
|
||||||
|
>
|
||||||
<span class="cred-id">{{ cred.credentialId.slice(0, 12) }}...</span>
|
<span class="cred-id">{{ cred.credentialId.slice(0, 12) }}...</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user