Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Github archive revert #2757

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Github archive revert #2757

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 76 additions & 0 deletions frontend/src/config/integrations/github-archive/components/connect/github-connect.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
<template>
<div>
<div class="flex items-center gap-4">
<!-- <lf-button type="secondary-ghost" class="!text-gray-500" @click="isDetailsModalOpen = true">-->
<!-- <lf-icon name="circle-info" type="regular" />-->
<!-- Details-->
<!-- </lf-button>-->
Comment on lines +4 to +7
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Remove commented-out code

Remove commented-out code to improve code maintainability. If this code is needed for future reference, document it in the project's documentation or version control history.

Also applies to: 25-29

<el-tooltip
content="Onboarding new data for GitHub is currently disabled due to some issues we are experiencing.
Please contact support if you need to onboard new data or update settings."
placement="top"
>
<span>
<lf-button type="secondary" disabled @click="isConnectModalOpen = true">
<lf-icon name="link-simple" />
Connect
</lf-button>
</span>
</el-tooltip>
</div>
<lf-github-connect-modal
v-if="isConnectModalOpen"
v-model="isConnectModalOpen"
/>
<!-- <lf-github-details-modal-->
<!-- v-if="isDetailsModalOpen"-->
<!-- v-model="isDetailsModalOpen"-->
<!-- @connect="isConnectModalOpen = true; isDetailsModalOpen = false;"-->
<!-- />-->
<lf-github-connect-finishing-modal v-model="isFinishingModalOpen" />
</div>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue';
import LfButton from '@/ui-kit/button/Button.vue';
import LfIcon from '@/ui-kit/icon/Icon.vue';
import { useRoute } from 'vue-router';
import { mapActions } from '@/shared/vuex/vuex.helpers';

const route = useRoute();
const { doGithubConnect } = mapActions('integration');

const isConnectModalOpen = ref(false);
// const isDetailsModalOpen = ref(false);
const isFinishingModalOpen = ref(false);

const finallizeGithubConnect = () => {
const {
code, source, state,
} = route.query;
const setupAction = route.query.setup_action;
const installId = route.query.installation_id;

if (code && !source && state !== 'noconnect') {
isFinishingModalOpen.value = true;
doGithubConnect({
code,
installId,
setupAction,
}).then(() => {
isFinishingModalOpen.value = false;
});
}
};
Comment on lines +48 to +65
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Add input validation and error handling

The finallizeGithubConnect function lacks proper input validation and error handling.

 const finallizeGithubConnect = () => {
   const {
     code, source, state,
   } = route.query;
   const setupAction = route.query.setup_action;
   const installId = route.query.installation_id;

+  // Validate query parameters
+  if (!code || typeof code !== 'string') {
+    console.error('Invalid or missing code parameter');
+    return;
+  }

   if (code && !source && state !== 'noconnect') {
     isFinishingModalOpen.value = true;
     doGithubConnect({
       code,
       installId,
       setupAction,
-    }).then(() => {
+    }).then((response) => {
+      // Handle successful connection
       isFinishingModalOpen.value = false;
+    }).catch((error) => {
+      console.error('GitHub connection failed:', error);
+      // Show error message to user
+      isFinishingModalOpen.value = false;
     });
   }
 };
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
const finallizeGithubConnect = () => {
const {
code, source, state,
} = route.query;
const setupAction = route.query.setup_action;
const installId = route.query.installation_id;
if (code && !source && state !== 'noconnect') {
isFinishingModalOpen.value = true;
doGithubConnect({
code,
installId,
setupAction,
}).then(() => {
isFinishingModalOpen.value = false;
});
}
};
const finallizeGithubConnect = () => {
const {
code, source, state,
} = route.query;
const setupAction = route.query.setup_action;
const installId = route.query.installation_id;
// Validate query parameters
if (!code || typeof code !== 'string') {
console.error('Invalid or missing code parameter');
return;
}
if (code && !source && state !== 'noconnect') {
isFinishingModalOpen.value = true;
doGithubConnect({
code,
installId,
setupAction,
}).then((response) => {
// Handle successful connection
isFinishingModalOpen.value = false;
}).catch((error) => {
console.error('GitHub connection failed:', error);
// Show error message to user
isFinishingModalOpen.value = false;
});
}
};


onMounted(() => {
finallizeGithubConnect();
});
</script>

<script lang="ts">
export default {
name: 'LfGithubConnect',
};
</script>
2 changes: 1 addition & 1 deletion ...ions/github/components/github-connect.vue → ...hub-archive/components/github-connect.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
import { ref, computed } from 'vue';
import LfButton from '@/ui-kit/button/Button.vue';
import LfIcon from '@/ui-kit/icon/Icon.vue';
import LfGithubSettingsDrawer from '@/config/integrations/github/components/settings/github-settings-drawer.vue';
import LfGithubSettingsDrawer from '@/config/integrations/github-archive/components/settings/github-settings-drawer.vue';
import { isTeamUser } from '@/config/permissions';
import { useAuthStore } from '@/modules/auth/store/auth.store';
import { storeToRefs } from 'pinia';
Expand Down
112 changes: 112 additions & 0 deletions frontend/src/config/integrations/github-archive/components/github-details-modal.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
<template>
<lf-modal v-model="isModalOpen" width="37.5rem">
<div class="px-6 pt-5 pb-6">
<!-- Header -->
<div class="flex justify-between pb-8">
<div class="pt-1 flex items-center gap-2">
<div class="border border-gray-200 rounded-md h-12 w-12 p-2">
<img src="/images/integrations/github.png" alt="GitHub" class="w-8 h-8 object-contain" />
</div>
<div>
<lf-icon name="angle-right" :size="20" class="text-gray-500" />
</div>
<div class="border border-gray-200 rounded-md h-12 w-12 p-2">
<img src="/images/integrations/custom/lfx.png" alt="LFX" class="w-8 h-8 object-contain" />
</div>
</div>
<lf-button type="secondary-ghost" icon-only @click="isModalOpen = false">
<lf-icon name="xmark" type="regular" />
</lf-button>
</div>

<!-- Content -->
<h5 class="pb-3">
GitHub integration
</h5>
<p class="text-small pb-6">
GitHub is a code hosting platform that over 80 million developers use for
collaboration and version control. Its one of the richest places for
developer activity and information.
</p>
<p class="text-small font-semibold pb-1.5">
Activities tracked
</p>
<p class="text-gray-600 text-small pb-3">
Stars/Un-stars, Forks, Issues, Pull requests, Discussions,
Comments on issues, Pull requests, Discussions, Closing of
issues/pull requests/discussions
</p>
<div class="border-t border-gray-200 pb-3" />
<p class="text-small font-semibold pb-1.5">
Historical import
</p>
<p class="text-gray-600 text-small pb-3">
No limitation
</p>
<div class="border-t border-gray-200 pb-3" />
<p class="text-small font-semibold pb-1.5">
Refresh period
</p>
<p class="text-gray-600 text-small pb-10">
Instant (maximum a few seconds)
</p>
<h6 class="pb-6">
How to connect
</h6>
<div class="flex pb-6">
<div class="w-6 h-6 rounded-full bg-gray-200 font-secondary text-center text-medium flex items-center justify-center">
1
</div>
<div class="pl-2">
<p class="text-small leading-6 font-semibold pb-0.5">
Select the repositories you want to track
</p>
<p class="text-tiny text-gray-500">
Esse et nihil ratione sit facere aut fugiat corporis et animi velit natus laudantium et.
</p>
</div>
</div>
<div class="flex pb-10">
<div class="w-6 h-6 rounded-full bg-gray-200 font-secondary text-center text-medium flex items-center justify-center">
2
</div>
<div class="pl-2">
<p class="text-small leading-6 font-semibold pb-0.5">
Map each repository with the correspondent project
</p>
<p class="text-tiny text-gray-500">
In vero sed libero labore voluptatem eos ut libero consequuntur dolorem aut ut similique.
</p>
</div>
</div>
<lf-button type="secondary" size="large" class="w-full" @click="emit('connect')">
<lf-icon name="link-simple" type="regular" />
Connect GitHub
</lf-button>
</div>
</lf-modal>
</template>

<script setup lang="ts">
import LfModal from '@/ui-kit/modal/Modal.vue';
import { computed } from 'vue';
import LfButton from '@/ui-kit/button/Button.vue';
import LfIcon from '@/ui-kit/icon/Icon.vue';

const props = defineProps<{
modelValue: boolean,
}>();

const emit = defineEmits<{(e: 'update:modelValue', value: boolean): void, (e: 'connect'): void }>();

const isModalOpen = computed({
get: () => props.modelValue,
set: (value: boolean) => emit('update:modelValue', value),
});
</script>

<script lang="ts">
export default {
name: 'LfGithubDetailsModal',
};
</script>
2 changes: 1 addition & 1 deletion ...ons/github/components/github-dropdown.vue → ...ub-archive/components/github-dropdown.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
import { defineProps, ref } from 'vue';
import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
import LfIcon from '@/ui-kit/icon/Icon.vue';
import LfGithubSettingsDrawer from '@/config/integrations/github/components/settings/github-settings-drawer.vue';
import LfGithubSettingsDrawer from '@/config/integrations/github-archive/components/settings/github-settings-drawer.vue';

const props = defineProps<{
integration: any,
Expand Down
76 changes: 76 additions & 0 deletions frontend/src/config/integrations/github-archive/components/github-params.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
<template>
<div class="flex items-center gap-1">
<el-popover trigger="hover" placement="top" popper-class="!w-auto">
<template #reference>
<div
class="text-gray-600 text-2xs flex items-center leading-5"
>
<i
class="ri-git-repository-line text-base !text-gray-600 mr-1 h-4 flex items-center"
/>

<span class="font-semibold">
{{ pluralize("repository", Object.keys(mappings).length, true) }}
</span>
</div>
</template>

<p class="text-gray-400 text-sm font-semibold mb-4">
GitHub repositories
</p>
<div class="-my-1 px-1 max-h-44 overflow-auto">
<article
v-for="mapping of mappings"
:key="mapping.url"
class="py-2 flex items-center flex-nowrap"
>
<i
class="ri-git-repository-line text-base mr-2 h-4 flex items-center"
/>
<a
:href="mapping.url"
target="_blank"
rel="noopener noreferrer"
class="text-xs leading-5 max-w-3xs truncate hover:underline !text-black"
>
/{{ repoNameFromUrl(mapping.url) }}
</a>
<div
class="ri-arrow-right-line text-gray-400 text-base mx-2 h-4 flex items-center"
/>
<div class="text-xs leading-5 max-w-3xs truncate">
{{ mapping.segment.name }}
</div>
</article>
</div>
</el-popover>
</div>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { IntegrationService } from '@/modules/integration/integration-service';
import pluralize from 'pluralize';

const props = defineProps<{
integration: any;
}>();
Comment on lines +55 to +57
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Replace any type with proper interface

Using any type reduces type safety. Define a proper interface for the integration prop.

+interface GitHubIntegration {
+  status: string;
+  id: string;
+  // Add other required properties
+}

 const props = defineProps<{
-  integration: any;
+  integration: GitHubIntegration;
 }>();

Committable suggestion skipped: line range outside the PR's diff.


const mappings = ref([]);

const repoNameFromUrl = (url) => url.split('/').at(-1);

onMounted(() => {
if (props.integration.status !== 'mapping') {
IntegrationService.fetchGitHubMappings(props.integration).then((res) => {
mappings.value = res;
});
}
});
Comment on lines +59 to +69
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Add error handling and loading state

The component lacks error handling for the API call and doesn't show a loading state.

+const isLoading = ref(false);
+const error = ref<Error | null>(null);
 const mappings = ref([]);

 onMounted(() => {
   if (props.integration.status !== 'mapping') {
+    isLoading.value = true;
     IntegrationService.fetchGitHubMappings(props.integration).then((res) => {
       mappings.value = res;
+    }).catch((err) => {
+      error.value = err;
+      console.error('Failed to fetch GitHub mappings:', err);
+    }).finally(() => {
+      isLoading.value = false;
     });
   }
 });
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
const mappings = ref([]);
const repoNameFromUrl = (url) => url.split('/').at(-1);
onMounted(() => {
if (props.integration.status !== 'mapping') {
IntegrationService.fetchGitHubMappings(props.integration).then((res) => {
mappings.value = res;
});
}
});
const isLoading = ref(false);
const error = ref<Error | null>(null);
const mappings = ref([]);
const repoNameFromUrl = (url) => url.split('/').at(-1);
onMounted(() => {
if (props.integration.status !== 'mapping') {
isLoading.value = true;
IntegrationService.fetchGitHubMappings(props.integration).then((res) => {
mappings.value = res;
}).catch((err) => {
error.value = err;
console.error('Failed to fetch GitHub mappings:', err);
}).finally(() => {
isLoading.value = false;
});
}
});

</script>

<script lang="ts">
export default {
name: 'LfGithubStatus',
};
</script>
4 changes: 2 additions & 2 deletions .../github-settings-add-repository-modal.vue → .../github-settings-add-repository-modal.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,8 +160,8 @@ import {
GitHubOrganization,
GitHubRepository,
GitHubSettingsRepository,
} from '@/config/integrations/github/types/GithubSettings';
import { GithubApiService } from '@/config/integrations/github/services/github.api.service';
} from '@/config/integrations/github-archive/types/GithubSettings';
import { GithubApiService } from '@/config/integrations/github-archive/services/github.api.service';
import Message from '@/shared/message/message';
import dayjs from 'dayjs';

Expand Down
Loading
Loading