-
Notifications
You must be signed in to change notification settings - Fork 16
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1626 from solliancenet/sc-fix-ui-lint-errors-2-ch…
…erry-pick (0.8.1) Fix UI lint errors
- Loading branch information
Showing
20 changed files
with
611 additions
and
594 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,59 +1,58 @@ | ||
<template> | ||
<img | ||
v-if="resolvedSrc !== ''" | ||
v-tooltip.bottom="tooltip" | ||
:alt="alt" | ||
class="avatar" | ||
:src="resolvedSrc" | ||
/> | ||
</template> | ||
|
||
<script lang="ts"> | ||
import { defineComponent, computed } from 'vue'; | ||
export default defineComponent({ | ||
name: 'AgentIcon', | ||
props: { | ||
src: { | ||
type: String, | ||
required: true, | ||
}, | ||
alt: { | ||
type: String, | ||
default: 'Agent icon', | ||
}, | ||
tooltip: { | ||
type: String, | ||
default: '', | ||
}, | ||
}, | ||
setup(props) { | ||
const resolvedSrc = computed(() => { | ||
if (props.src.startsWith('~')) { | ||
// Handle relative path dynamically | ||
return new URL(`../assets/${props.src.slice(9)}`, import.meta.url).href; | ||
} | ||
return props.src; | ||
}); | ||
const tooltipDirective = computed(() => { | ||
return props.tooltip !== '' ? { 'v-tooltip': { value: props.tooltip, bottom: true } } : {}; | ||
}); | ||
return { | ||
resolvedSrc, | ||
tooltipDirective, | ||
}; | ||
}, | ||
}); | ||
</script> | ||
|
||
<style scoped> | ||
.avatar { | ||
/* Add any specific styling for the avatar here */ | ||
width: 40px; | ||
height: 40px; | ||
border-radius: 50%; | ||
} | ||
</style> | ||
|
||
<template> | ||
<img | ||
v-if="resolvedSrc !== ''" | ||
v-tooltip.bottom="tooltip" | ||
:alt="alt" | ||
class="avatar" | ||
:src="resolvedSrc" | ||
/> | ||
</template> | ||
|
||
<script lang="ts"> | ||
import { defineComponent, computed } from 'vue'; | ||
export default defineComponent({ | ||
name: 'AgentIcon', | ||
props: { | ||
src: { | ||
type: String, | ||
required: true, | ||
}, | ||
alt: { | ||
type: String, | ||
default: 'Agent icon', | ||
}, | ||
tooltip: { | ||
type: String, | ||
default: '', | ||
}, | ||
}, | ||
setup(props) { | ||
const resolvedSrc = computed(() => { | ||
if (props.src.startsWith('~')) { | ||
// Handle relative path dynamically | ||
return new URL(`../assets/${props.src.slice(9)}`, import.meta.url).href; | ||
} | ||
return props.src; | ||
}); | ||
const tooltipDirective = computed(() => { | ||
return props.tooltip !== '' ? { 'v-tooltip': { value: props.tooltip, bottom: true } } : {}; | ||
}); | ||
return { | ||
resolvedSrc, | ||
tooltipDirective, | ||
}; | ||
}, | ||
}); | ||
</script> | ||
|
||
<style scoped> | ||
.avatar { | ||
/* Add any specific styling for the avatar here */ | ||
width: 40px; | ||
height: 40px; | ||
border-radius: 50%; | ||
} | ||
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,81 +1,86 @@ | ||
<template> | ||
<Dialog | ||
:visible="visible" | ||
:header="header" | ||
:modal="true" | ||
:closable="true" | ||
:style="{ width: '50vw' }" | ||
@update:visible="$emit('update:visible', $event)" | ||
> | ||
<template v-if="analysisResults && analysisResults.length > 0" v-slot:default> | ||
<div v-for="(analysis, index) in analysisResults" :key="index" class="analysis-block"> | ||
<h4>Tool: {{ analysis.tool_name }}</h4> | ||
<p><strong>Category:</strong> {{ analysis.agent_capability_category }}</p> | ||
<CodeBlockHeader language="python" :codecontent="encodeURIComponent(analysis.tool_input)"> | ||
<pre v-html="renderCodeBlock(analysis.tool_input)"></pre> | ||
</CodeBlockHeader> | ||
<p v-if="analysis.tool_output"><strong>Output:</strong> {{ analysis.tool_output }}</p> | ||
</div> | ||
</template> | ||
<template v-if="!analysisResults || analysisResults.length === 0"> | ||
<p>No analysis results available.</p> | ||
</template> | ||
</Dialog> | ||
</template> | ||
|
||
<script lang="ts"> | ||
import { defineComponent } from 'vue'; | ||
import type { PropType } from 'vue'; | ||
import { marked } from 'marked'; | ||
import type { AnalysisResult } from '@/js/types'; | ||
import CodeBlockHeader from '@/components/CodeBlockHeader.vue'; | ||
export default defineComponent({ | ||
name: 'AnalysisModal', | ||
components: { | ||
CodeBlockHeader | ||
}, | ||
props: { | ||
visible: { | ||
type: Boolean, | ||
required: true, | ||
}, | ||
analysisResults: { | ||
type: Array as PropType<Array<AnalysisResult>>, | ||
required: true, | ||
}, | ||
header: { | ||
type: String, | ||
default: 'Analysis', | ||
}, | ||
}, | ||
methods: { | ||
renderCodeBlock(code: string) { | ||
return marked(`\`\`\`python\n${code}\n\`\`\``); | ||
}, | ||
}, | ||
}); | ||
</script> | ||
|
||
<style scoped> | ||
.analysis-block { | ||
margin-bottom: 20px; | ||
} | ||
p { | ||
margin: 10px 0; | ||
} | ||
.header { | ||
display: flex; | ||
justify-content: space-between; | ||
align-items: center; | ||
color: var(--secondary-button-text); | ||
background: var(--secondary-color); | ||
padding-left: 8px; | ||
} | ||
.copy-button { | ||
color: var(--secondary-button-text) !important; | ||
} | ||
</style> | ||
<template> | ||
<Dialog | ||
:visible="visible" | ||
:header="header" | ||
:modal="true" | ||
:closable="true" | ||
:style="{ width: '50vw' }" | ||
@update:visible="$emit('update:visible', $event)" | ||
> | ||
<template v-if="analysisResults && analysisResults.length > 0" #default> | ||
<div v-for="(analysis, index) in analysisResults" :key="index" class="analysis-block"> | ||
<h4>Tool: {{ analysis.tool_name }}</h4> | ||
<p><strong>Category:</strong> {{ analysis.agent_capability_category }}</p> | ||
|
||
<CodeBlockHeader language="python" :codecontent="encodeURIComponent(analysis.tool_input)"> | ||
<!-- eslint-disable-next-line vue/no-v-html --> | ||
<pre v-html="renderCodeBlock(analysis.tool_input)"></pre> | ||
</CodeBlockHeader> | ||
|
||
<p v-if="analysis.tool_output"><strong>Output:</strong> {{ analysis.tool_output }}</p> | ||
</div> | ||
</template> | ||
|
||
<template v-if="!analysisResults || analysisResults.length === 0"> | ||
<p>No analysis results available.</p> | ||
</template> | ||
</Dialog> | ||
</template> | ||
|
||
<script lang="ts"> | ||
import type { PropType } from 'vue'; | ||
import { marked } from 'marked'; | ||
import type { AnalysisResult } from '@/js/types'; | ||
export default { | ||
name: 'AnalysisModal', | ||
props: { | ||
visible: { | ||
type: Boolean, | ||
required: true, | ||
}, | ||
analysisResults: { | ||
type: Array as PropType<Array<AnalysisResult>>, | ||
required: true, | ||
}, | ||
header: { | ||
type: String, | ||
default: 'Analysis', | ||
}, | ||
}, | ||
emits: ['update:visible'], | ||
methods: { | ||
renderCodeBlock(code: string) { | ||
return marked(`\`\`\`python\n${code}\n\`\`\``); | ||
}, | ||
}, | ||
}; | ||
</script> | ||
|
||
<style scoped> | ||
.analysis-block { | ||
margin-bottom: 20px; | ||
} | ||
p { | ||
margin: 10px 0; | ||
} | ||
.header { | ||
display: flex; | ||
justify-content: space-between; | ||
align-items: center; | ||
color: var(--secondary-button-text); | ||
background: var(--secondary-color); | ||
padding-left: 8px; | ||
} | ||
.copy-button { | ||
color: var(--secondary-button-text) !important; | ||
} | ||
</style> |
Oops, something went wrong.